JSFiddle - React, Tailwind, and code Playground
by Musakkhir Sayyed
HTML
<html>
<head>
<title></title>
<link href="http://fonts.googleapis.com/css?family=Contrail+One" rel="stylesheet"
type="text/css" />
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<script src="http://d3js.org/d3.v2.min.js" type="text/javascript"></script>
</head>
<body></body>
</html>
CSS
text
{
font-family: "Contrail One";
text-shadow: 4px 4px 4px #aaa;
}
line.link
{
stroke: #999;
stroke-opacity: .6;
}
JavaScript
$(function () {
var width = 700, height = 500;
var color = d3.scale.category20();
var force = d3.layout.force().gravity(.05).distance(100).charge(-100).size([width, height + 300]);
var svg = d3.select("body").append("svg").attr("width", width).attr("height", height + 300);
var nodeContainer = svg.append('g'),
linkContainer = svg.append('g'),
textContainer = svg.append('g');
var...