代码之家 › 专栏 › 技术社区 › jackerman09

用GoJS更改链接上面板的zOrder

gojs javascript

jackerman09 · 技术社区 · 4 年前

我试图配置我的GoJS图(使用LayeredDiagraphLayout),使显示链接标签(在本例中显示百分比)的面板始终位于图上所有其他项之前的前景。目前,它在面板前面显示一些连接线(如图所示):

以确保显示百分比的面板在所有其他内容之前始终可见。

将链接引入前景层(如建议 here

myDiagram.linkTemplate =
  $$(go.Link,
    { routing: go.Link.AvoidsNodes, curve: go.Link.JumpGap, corner: 5, layerName:"Foreground" },
    $$(go.Shape, { strokeWidth: 3, stroke: "#555" }),
    $$(go.Panel, "Auto", // this whole Panel is a link label
      $$(go.Shape, "RoundedRectangle", { fill: "lightgray", stroke: "gray" }),
      $$(go.TextBlock, { margin: 3 },
        new go.Binding("text", "ownership"))
    )
  );

分配 zOrder go.Panel , go.Shape ,和 go.TextBlock 但是,上面代码中的项目都会出现这样的错误: Uncaught Error: Trying to set undefined property "zOrder" on object: Shape(RoundedRectangle) . 根据 documentation Part 延伸 Panel zOrder 到a 面板 ,但它给出了这个错误,所以很明显我的期望是错误的。

0 回复 | 直到 4 年前

Walter Northwoods 4 年前

看到了吗 https://forum.nwoods.com/t/changing-zorder-for-panel-on-link-on-layereddiagraphlayout/13714 为了讨论。

也许这就是你想要的,假设标签是链接的第二个元素:

      $(go.Diagram, . . .,
        {
          layout: $(go.LayeredDigraphLayout, { direction: 90, . . . }),
          "LayoutCompleted": function(e) {
            e.diagram.links.each(function(l) { l.elt(1).segmentIndex = -Infinity; });
            e.diagram.nodes.each(function(n) {
              var outs = n.findLinksOutOf();
              var ins = n.findLinksInto();
              if (outs.count === 1) outs.first().elt(1).segmentIndex = 1;
              else if (ins.count === 1) ins.first().elt(1).segmentIndex = -2;
            });
          },
          . . .

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前