Back

NetChart with data function

JavaScript network chart with incremental loading. Data function is called with jQuery only when the user requests it by expanding the visible nodes.

Documentation Open in JSFiddle
Start Free Trial Purchase

HTML

HTML 
<script src="https://cdn.zoomcharts-cloud.com/1/nightly/zoomcharts.js"></script>

<div id="demo"></div>

CSS

CSS 
//No CSS for this example

JavaScript

JavaScript 

    var t = new NetChart({
        container: document.getElementById("demo"),
        area: { height: null },
        data:
        {
            dataFunction: function(nodeList, success, error){
                // using jquery for ajax call
                //return just the first node, net chart will ask for more
                jQuery.ajax({
                    url:"/dvsl/data/net-chart/friend-net/"+nodeList[0]+".json",
                    success: success,
                    error: error});
            }
        },
        navigation:{
            initialNodes:["m-1"],
            mode:"manual"
        },
        style: {
            node: {
                fillColor: "rgba(47,195,47,1)"
            },
            link: {
                fillColor: "rgba(176,220,11,0.6)"
            }
        }

    });

Data

Data 
//No separate data for this example