Zoomchart net chart form links issue

Question

I'm using the Zoomchart library's NetChart class to form netchart. But I'm facing issue with links. And not able to find any solution.

Below is the case which I want to achieve:-

Let suppose we have two nodes A and B. Here A is the seller and B is the buyer.

Seller A -> B
Buyer  B -> A

I'm loading data dynamically. And when we initially loading A then we are getting B as Buyer of A. And this forms a link like A -> B. But when B loads its related data then it is getting A as it is buying data from it(A). And this form two link nodes:-

{
    "from": "A",
    "to": "B"
}

{
    "from": "B",
    "to": "A"
}

It is creating a chart like this:-

But it should be a single link. Below is the code:-

this.chartObject = new NetChart({
    container: document.getElementById('sellerBuyersLinkingChart'),
    area: { height: null },
    navigation:{
       focusNodeExpansionRadius: 1,
       initialNodes: ["n-1"],
       mode:"focusnodes"
    },
    data: {
        dataFunction: (nodeList, success, error) => {

            $.ajax({
                url:url+'?nodes='+nodeList.toString(),
                success: (response, textStatus, jqXHR) => {

                    success(response, textStatus, jqXHR);
                },
                error: error
            });
        },
        requestMaxUnits: 1
    },
    style: {
        nodeStyleFunction: (node) => {
        },
        linkStyleFunction: (link) => {
            let type = link.data['extra']['type'];
            if(type == 'sellers') {
                link['fromDecoration'] = "arrow";
                link['fillColor'] = "rgba(47,195,47,0.8)";
                link['direction'] = "L";
            } else {
                link['toDecoration'] = "arrow";
                link['fillColor'] = "rgba(236,46,46,0.8)";
                link['direction'] = "R";
            }

        },
        nodeFocused: {
            fillColor: 'rgba(232,189,43,1)'
        }
    }
});

Expectations: Is there any way that I can send to link id with URL. With that way, I can remove the same node from the link.

This chart should create nodes like this:-

score 0 · Answer 1 · answered Dec 14 '19 at 13:10

1) You can use multiLinkProcessor to combine multiple links if they are not unique

2) If you add unique id to links, then you can update, remove or manipulate them individually (in fact it's recommended to always add id for links and nodes and that will prevent duplicates). Not having ids will prompt notice in console log as well.

Zoomchart net chart form links issue

1 Answers1