JSFiddle - React, Tailwind, and code Playground

by Yaprak Ayazoğlu

HTML

<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js"></script>

CSS

/* line 45, app.scss */
.node {
  cursor: pointer;
  stroke: #3182bd;
  stroke-width: 1.5px;
}

/* line 51, app.scss */
.link-line {
  fill: none;
  stroke: #9ecae1;
  stroke-width: 1.5px;
}

JavaScript

var topol = {"nodes": [
  {
    "type": "Internet",
    "name": "Internet",
    "group": 1,
    "id": 1
  },
  {
    "type": "Switch",
    "name": "Switch1",
    "dataPathId": "None",
    "hwAddress": "A0:B3:CC:A8:D0:6F",
    "ipv4Address": "192.168.50.3",
    "vendor": "HP Networking",
    "activeSince": "2014.03.14 16:27:31",
    "packets": "0",
    "bytes": "0",
    "flows": "0",
    "version": "1.3",
    "group": 2,
    "_children": [],
    "children": [],
    "id": 2
  },
  {
    "type": "Switch",
    "name": "Switch2",
    "dataPathId": "None",
    "hwAddress": "A0:B3:CC:A7:7B:2B",
    "ipv4Address": "192.168.50.4",
    "vendor": "HP Networking",
    "activeSince": "2014.03.14 16:27:31",
    "packets": "0",
    "bytes": "0",
    "flows": "0",
    "version": "1.3",
    "group": 2,
    "_children": [],
    "children": [],
    "id": 3
  },
  {
    "type": "Switch",
    "name": "Switch3",
    "dataPathId": "PICA8_OPENSWITCH",
    "hwAddress": "60:EB:69:FE:59:8B",
    "ipv4Address": "192.168.50.13",
    "vendor": "Pica8, Inc.",
    "activeSince": "2014.03.14 16:27:33",
    "packets": "0",
    "bytes": "0",
    "flows": "0",
    "version": "1.3",
    "group": 2,
    "_children": [
      {
        "type": "Host",
        "name": "Host1",
        "hostHWAddress": "00:17:A4:EA:D5:D6",
        "hostIpv4Address": "192.168.40.102",
        "switchHWAddress": "60:EB:69:FE:59:8B",
        "switchPortNo": "25",
        "activeSince": "2014.03.14 16:27:36",
        "displayName": "Unknown",
        "group": 3
      }
    ],
    "children": [],
    "id": 4
  },
  {
    "type": "Switch",
    "name": "Switch4",
    "dataPathId": "PICA8_OPENSWITCH",
    "hwAddress": "60:EB:69:FE:59:5E",
    "ipv4Address": "192.168.50.12",
    "vendor": "Pica8, Inc.",
    "activeSince": "2014.03.14 16:27:32",
    "packets": "0",
    "bytes": "0",
    "flows": "0",
    "version": "1.3",
    "group": 2,
    "_children": [
      {
        "type": "Host",
        "name": "Host2",
       ...