如何在增量树中动态调整节点大小

Question

我以这种方式创建了增量树：

myDiagram.nodeTemplate =
  $(go.Node, "Spot",
   {
    selectionObjectName: "PANEL",
    isTreeExpanded: true,
    isTreeLeaf: true
   },
   // the node's outer shape, which will surround the text
   $(go.Panel, "Horizontal",
   { name: "PANEL" },
   $(go.Shape, "Circle",
   { fill: "whitesmoke", stroke: "black" },
    new go.Binding("fill", "color", function (dist) {
    return go.Brush.randomColor();//blues[dist];
    })),
    $(go.TextBlock,
    { font: "6pt sans-serif" },
     new go.Binding("text", "text"))
     ),
     // the expand/collapse button, at the top-right corner
     $("TreeExpanderButton",
     {
      width: 20, height: 20,
      alignment: go.Spot.TopRight,
      alignmentFocus: go.Spot.Center
      },
    { visible: true })  // end TreeExpanderButton
    );  // end Node

并将数据添加为：

item = {}
item["key"] = 1;
item["text"] = "Test1";
item["cnt"] = 50;
item["color"] = go.Brush.randomColor();
item["parent"] = 0;
item["share"] = 0;
nodeDataArray.push(item);
myDiagram.model = new go.TreeModel(nodeDataArray);

它使树成为：

但是，我想根据共享值更改所有这些节点的形状。这可以是任何默认值的百分比。那么如何在插入其中的所有节点后更改所有节点的大小。此外，任何人都可以告诉我，如何将这个文本放在节点上而不是在它之外，我希望所有节点在开始时都有一个默认大小，然后根据共享调整所有节点的大小。文字可以在形状之外流动。

Answer 1

首先，我希望您认识到，通过每次添加节点创建新模型，该图表将丢弃所有旧节点和链接，并为模型中的所有数据创建新节点和链接。这是构建树的一种非常低效的方法 - 最好只使用每个新节点数据对象调用Model.addNodeData。

如果您的节点模板中存在依赖于“share”数据属性的数据绑定，则可以通过调用Model.setDataProperty来修改节点：

myDiagram.model.setDataProperty(someItem, "share", 17);

我强烈建议您阅读https://gojs.net/learn以及简介的所有页面（从https://gojs.net/intro开始），以了解如何定义节点模板以依赖于您的数据属性。

Answer 2

我首先将形状对象的名称命名为＆＃39; SHAPE＆＃39;然后添加以下代码：

myDiagram.nodes.each(function (n) {
    n.findObject('SHAPE').height = n.data.share * 150 / 100;
})