topologyNetwork

by Nayana Das

HTML

<script src="http://www.google.com/jsapi"></script>
<script src="https://www.dropbox.com/s/1njeylnnjjzigw1/network.js"></script>
<body>
    <div id="mynetwork"></div>
    <p>
      Icons: <a href="http://www.tpdkdesign.net" target="_blank">Refresh Cl by TpdkDesign.net</a>
    </p>
    
    <div id="info"></div>
  </body>

CSS

body {font: 10pt arial;}

JavaScript

var nodesTable = null;
      var linksTable = null;
      var network = null;

    //  var DIR = 'img/refresh-cl/';

      google.load('visualization', '1');
      
      // Set callback to run when API is loaded
      google.setOnLoadCallback(drawVisualization); 

      // Called when the Visualization API is loaded.
      function drawVisualization() {
        // Create a data table with nodes.
        nodesTable = new google.visualization.DataTable();
        nodesTable.addColumn('number', 'id');
        nodesTable.addColumn('string', 'text');   // optional
    //        nodesTable.addColumn('string', 'image');  // optional
        nodesTable.addColumn('string', 'style');   // optional
 	//nodesTable.addColumn('string', 'title');
        
        // Create a data table with links.
        linksTable = new google.visualization.DataTable();
        linksTable.addColumn('number', 'from');
        linksTable.addColumn('number', 'to');
        linksTable.addColumn('number', 'length');
	//linksTable.addColumn('string', 'title'); // optional
        var lengthMain = 150;
        var lengthSub = 50;
  
	
	nodesTable.addRow([1, 'Main', 'image']);
        nodesTable.addRow([2, 'Computer', 'image']);
        nodesTable.addRow([3, 'Computer', 'image']);
	nodesTable.addRow([4, 'Computer', 'image']);
	nodesTable.addRow([5, 'Computer', 'image']);

        linksTable.addRow([1, 2, lengthMain]);
        linksTable.addRow([1, 3, lengthMain]);
	linksTable.addRow([1, 4, lengthMain]);
	linksTable.addRow([1, 5, lengthMain]);	
   
        
        nodesTable.addRow([103, 'Network', DIR + 'Network-Drive-icon.png', 'image']);
        linksTable.addRow([1, 103, lengthSub]);

        // specify options
        var options = {
          'width': '600px', 
          'height': '600px',
          'stabilize': false   // stabilize positions before displaying
        };

        // Instantiate our graph object.
        network = new links.Network(document.getElementById('mynetwork'));

      ...