Implementing Examples #64

adityasinghwa · 2016-09-15T06:34:26Z

Hi,

I was trying to implement a simple html based demo of the examples given on the website. I have never worked with javascript or html before. Could someone look at the setup below and please help me out!

<head>

title

</head>
<body>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="jsnetworkx.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>


<svg width="960" height="600"></svg>

<script> 

$(window).load(function (){

var svg = d3.select("svg"),
    width = +svg.attr("width"),
    height = +svg.attr("height");

var color = d3.scaleOrdinal(d3.schemeCategory20);

var simulation = d3.forceSimulation()
    .force("link", d3.forceLink().id(function(d) { return d.id; }))
    .force("charge", d3.forceManyBody())
    .force("center", d3.forceCenter(width / 2, height / 2));


// This is a graph generator
var G = jsnx.cycleGraph(6);
// Compute the shortest path between 0 and 4
var path = jsnx.bidirectionalShortestPath(G, 0, 4);
// A simple way to color all nodes in the path:
G.addNodesFrom(path, {color: '#FFF'});
// Color the start and end differently
G.node.get(0).color = '#0F0'; // start is green
G.node.get(4).color = '#F00'; // end is red
console.log(G.nodes()); 
jsnx.draw(G, {
  element: '#demo-canvas',
  withLabels: true,
  nodeStyle: {
    fill: function(d) {
      return d.data.color || '#AAA'; // any node without color is gray
    }
  }
});
});
</script>
</body>

The text was updated successfully, but these errors were encountered:

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Implementing Examples #64

Implementing Examples #64

adityasinghwa commented Sep 15, 2016

Implementing Examples #64

Implementing Examples #64

Comments

adityasinghwa commented Sep 15, 2016