2

我用 GoJS 创建了一个图表。我需要每个节点都包含一个href。

var template = GO(go.Node, "Auto", {
        desiredSize: new go.Size(width, height)
    },
    GO(go.Shape, shapeMap.getValue(shape), new go.Binding("fill", "fill")),
    GO(go.TextBlock, {
        textAlign: 'center',
        margin: 4
    }, new go.Binding("stroke", "color"), new go.Binding("text", "text")));

var node = {
    key: src,
    color: textColor,
    fill: backgroundColor,
    category: shape,
    text: "www.google.com"
};

图.model.addNodeData(节点);

我试图插入一个 Html 内容。

var node = {
    key: src,
    color: textColor,
    fill: backgroundColor,
    category: shape,
    text: <a href='www.google.com'>href</a>
};

但它不起作用。我怎样才能做到这一点?

4

2 回答 2

3

TextBlock 不会呈现 HTML,而只是将字符串呈现为文本块。

如果将 URL 放入节点数据中,则可以声明一个打开窗口的GraphObject.click事件处理程序。

GO(go.Node, . . .
  {
    click: function(e, obj) {
        window.open("http://" + encodeURIComponent(obj.part.data.url));
      }
  },
  . . .
  GO(go.TextBlock,
    { textAlign: "center", margin: 4 },
    new go.Binding("stroke", "color"),
    new go.Binding("text", "url"))
  ),
  . . .
)

这适用于节点数据,例如:

{ url: "www.example.com" }

您可以在 TextBlock.text 绑定上使用转换函数来显示与 data.url 属性值不同的字符串。

http://gojs.net/latest/samples/euler.html上的示例也演示了这一点

于 2015-07-05T18:59:25.457 回答
0

将点击事件添加到 TextBlock,并在点击功能中 - 打开新网页。

GO(go.Node,...
  GO(go.TextBlock,{textAlign: 'center', click: function(e, obj) {window.open(obj.part.data.url)}}),...);
于 2015-07-07T13:21:48.200 回答