ZingChart: How do I get a new url for each node in a stacked bar chart?

You will use ZingChart's API to capture node_click  event and from there determine what you want to do in a switch statement. In this case I updated the color. In any case you can open a new window or apply some action based on that click.

zingchart.bind('myChart', 'node_click', function(p){

    console.log(p); // shows what is going on

    var plotIndex = p.plotindex;
    var nodeIndex = p.nodeindex;
    var graphId   = p.id;
 
    switch (nodeIndex){
        default:
        console.log(zingchart.exec('myChart', 'getobjectinfo', {
            object: 'plot',
            plotindex:plotIndex
        }).xdata['urls'][nodeIndex]);
    }
 
    switch(plotIndex) {
        case 2:
        //do something
        zingchart.exec(graphId, 'modifyplot', {
            plotindex: plotIndex,
            data: {
                backgroundColor: "#000"
            }
        });
        break;
        case 1:
        //do something
        zingchart.exec(graphId, 'modifyplot', {
            plotindex: plotIndex,
            data: {
                backgroundColor: "#C4C4C4"
            }
        });
        break;
        default:
        //plotIndex 0
        zingchart.exec(graphId, 'modifyplot', {
            plotindex: plotIndex,
            data: {
                backgroundColor: "red"
            }
        });
    }
});


Check the console in the demo linked below.

Documentation

API events
API methods

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us