从带有节点位置的JSON文件加载go.js图

时间:2019-06-28 08:44:57

标签: javascript gojs

通过将以下行添加到代码的nodeTemplate部分中,我已成功将节点的位置保存在json文件中:

myDiagram.nodeTemplate = $(go.Node, "Auto", new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),

json文件如下:

"{ \"class\": \"GraphLinksModel\",\n \"nodeDataArray\": [ \n{\"text\":\"Node\", \"color\":\"white\", \"key\":-1, \"loc\":\"-105 -107\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-2, \"loc\":\"64.52284749830794 277\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-3, \"loc\":\"161.04569499661588 0\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-4, \"loc\":\"0 70\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-5, \"loc\":\"80.52284749830794 70\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-6, \"loc\":\"161.04569499661588 70\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-7, \"loc\":\"0 140\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-8, \"loc\":\"-166.47715250169205 182.99999999999997\"},\n{\"text\":\"Node\", \"color\":\"white\", \"key\":-9, \"loc\":\"161.04569499661588 140\"}\n ],\n \"linkDataArray\": [ \n{\"from\":-4, \"to\":-8},\n{\"from\":-7, \"to\":-5},\n{\"from\":-1, \"to\":-4},\n{\"from\":-2, \"to\":-5},\n{\"from\":-6, \"to\":-6},\n{\"from\":-6, \"to\":-9},\n{\"from\":-3, \"to\":-5}\n ]}"

但是,当我尝试从Json文件加载图时,将重新组织节点的布局。我正在使用basic diagram sample作为代码。 我尝试将图初始化更改为:

$(go.Diagram, "myDiagramDiv", // create a Diagram for the DIV HTML element { layout: $(go.GridLayout, { isInitial: false, isOngoing: false }),...

,但未显示该图。如果我只留下iOnGoing = false,则显示的是节点在一条直线上。

在将图保存到json文件时,如果想要将节点保持在适当的位置,那我在做错什么?

1 个答案:

答案 0 :(得分:0)

我通过写:myDiagram.nodeTemplate = $(go.Node, "Auto", { locationSpot: go.Spot.Center }, new go.Binding("position", "pos", go.Point.parse).makeTwoWay(go.Point.stringify),...而不是myDiagram.nodeTemplate = $(go.Node, "Auto", new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),来解决它(注意从“位置”和“位置”到“位置”和“位置”的变化)。 那解决了问题。

无需更改图初始化