findLinkDataForKey always return null


#1

Hi all,

I am about to change the opacity of links base on some filter. But I am not able to get the link data via findLinkDataForKey to set the new property value for it.
It works for node but not link.

How I find and set new property

myDiagram.startTransaction('render opacity');
    // node
    for(let i = 0; i < myDiagram.model.nodeDataArray.length; i++) {
      let item = myDiagram.model.nodeDataArray[i];
      let opacity = newV.indexOf(item.pipelineId) > -1 ? 1 : 0.5;

      if (item.opacityNumber != opacity) {
        var nodeData = myDiagram.model.findNodeDataForKey(i);
        myDiagram.model.setDataProperty(nodeData, "opacityNumber", opacity);
      }
    }

    // link
    for (let i = 0; i < myDiagram.model.linkDataArray.length; i++) {
      let linkItem = myDiagram.model.linkDataArray[i];
      let opacity = newV.indexOf(linkItem.pipelineId) > -1 ? 1 : 0.5;

      if (linkItem.opacityNumber != opacity) {
        var linkData = myDiagram.model.findLinkDataForKey(i);
        // it is always null here, so the view won't update
        myDiagram.model.setDataProperty(linkData, "opacityNumber", opacity);
        //myDiagram.model.raiseDataChanged(linkData, "opacityNumber", linkItem.opacityNumber, opacity);
      }
    }

    myDiagram.rebuildParts();
    myDiagram.commitTransaction('render opacity');

I already set up a unique key when init the linkDataArray

linkDataArray.push({
      key: i,
      from: index1,
      to: index2,
      fromNode: item.raw.endNode1,
      toNode: item.raw.endNode2,
      isHeating: item.raw.isHeating == 'true',
      pipelineId: item.raw.pipelineId,
      opacityNumber: 1,
      points
    });

Even I tried to set the key manually for links:

var model = go.Model.fromJson(vm.chartData);
  model.makeUniqueLinkKeyFunction = function (model, data) {
    return data.key;
  };
  myDiagram.model = model;

Can you guys tell me what did I do wrongly? Thank you all in advance !!!
Marcus


#2

When you created the model, did you set https://gojs.net/latest/api/symbols/GraphLinksModel.html#linkKeyProperty to “key”?

If you do, you don’t need to set makeUniqueLinkKeyFunction.


#3

Hi walter,

Can you show me how to do that ?
Currently I only create it by using this

myDiagram.model = go.Model.fromJson(vm.chartData);

If I setup it like this:

myDiagram.model = $(go.GraphLinksModel,
    {
      nodeKeyProperty: 'key',
      linkKeyProperty: 'key',
      linkFromKeyProperty: 'from',
      linkToKeyProperty: 'to',
      nodeDataArray: vm.chartData.nodeDataArray,
      linkDataArray: vm.chartData.linkDataArray
    });

I got this error in console:

image

Thank you a lot :)


#4

I don’t understand how you are getting that error. With either of your statements that set Diagram.model, it seems to me that the value would be an instance of Model, so the error message doesn’t make sense. Could you check in the debugger to see what that value actually is? I suppose you could test it by evaluating myDiagram.model instanceof go.GraphLinksModel.


#5

Hi,

I finally found the way:

var model = new go.GraphLinksModel(vm.chartData.nodeDataArray, vm.chartData.linkDataArray);
  model.linkFromKeyProperty = "from";
  model.linkToKeyProperty = "to";
  model.nodeKeyProperty = "key";
  model.linkKeyProperty = "key";

  myDiagram.model = model;

It worked fine this way. I don’t understand why when I setup it like this, it causes error:

myDiagram.model = $(go.GraphLinksModel,
{
  nodeKeyProperty: 'key',
  linkKeyProperty: 'key',
  linkFromKeyProperty: 'from',
  linkToKeyProperty: 'to',
  nodeDataArray: vm.chartData.nodeDataArray,
  linkDataArray: vm.chartData.linkDataArray
});

Anyways, thank you a lot for your support !!!


#6

The latter code looks correct to me – even more so than the former code which sets important model properties after assigning the nodeDataArray and linkDataArray.

Are you sure that “$” evaluates to go.GraphObject.make?