2016-11-25 115 views
0

我希望在節點內部有一個形狀,這部分會超出節點的邊界。含義,-10px頂部和左側的父元素。在GoJS節點或graphObject中出現「可見溢出」

現在我有矩形和一個節點內部的圓,它看起來像這樣:

enter image description here

正如你可以看到,該鏈接無法正常連接,因爲節點的大小有擴大。我希望圓是用css術語來定位的,換句話說,我不希望它影響節點調整節點的大小(很明顯,在這個示例中是不可見的)。

我試過以下解決方案:

設置節點的寬度和高度。然後,它會裁剪這個圈子,因爲它超出了界限。

使用節點中的fromSpot和toSpot屬性將鏈接連接到節點的中心。顯然他們被覆蓋的佈局,我不知道如何禁用isLayoutPositioned

使用裝飾品,但我根本不明白我應該如何使用它們。

搜索是否可以以某種方式將元素的溢出設置爲可見,或者以某種方式影響邊界或類似的東西,但是沒有找到任何對我有用的東西。

這裏有什麼適當的解決方案?

回答

0

讓您節點一個「點」小組,通過分配一個GraphObject.portId使您的節點「端口」的「主」元素,相對紅圈定位到「主」元素通過設置其GraphObject.alignment屬性,在這種情況下爲go.Spot.TopLeft。我也猜測,分配Node.locationObjectName是你會想要的。

myDiagram.nodeTemplate = $(go.Node, "Spot", { locationSpot: go.Spot.Center, locationObjectName: "BODY" }, $(go.Shape, { name: "BODY", width: 50, height: 50, fill: "lightgreen", strokeWidth: 0, portId: "" }), $(go.Shape, "Circle", { alignment: go.Spot.TopLeft, width: 20, height: 20, fill: "transparent", stroke: "red" }) );

​​

請閱讀更多的http://gojs.net/latest/intro/nodes.html。我建議您不僅要閱讀入門頁面http://gojs.net/learn,還要閱讀所有適用於您要創建的應用類型的簡介頁面,http://gojs.net/intro

特別地,這些應該是有用的: