0

我有以下节点模板:

// define the Node template
mySecondDiagram.nodeTemplate =
    $$(go.Node, "Auto",
        // for sorting, have the Node.text be the data.name
        new go.Binding("text", "name"),
        // bind the Part.layerName to control the Node's layer depending on whether it isSelected
        new go.Binding("layerName", "isSelected", function(sel) { return sel ? "Foreground" : ""; }).ofObject(),
        // define the node's outer shape
        $$(go.Shape, "Rectangle",
            {
                name: "SHAPE", fill: "white", stroke: null,
                // set the port properties:
                portId: "", fromLinkable: true, toLinkable: true, cursor: "pointer"
            }),
        $$(go.Panel, "Horizontal",
            $$(go.Picture,
                {
                    name: 'Picture',
                    desiredSize: new go.Size(50, 50),
                    margin: new go.Margin(6, 8, 6, 10)
                },
                new go.Binding("source", "", findHeadShot)),
                // define the panel where the text will appear
            $$(go.Panel, "Table",
                {
                    maxSize: new go.Size(150, 999),
                    margin: new go.Margin(6, 10, 0, 3),
                    defaultAlignment: go.Spot.Left
                },
                $$(go.RowColumnDefinition,
                    {
                        column: 2,
                        width: 4
                    },
                    new go.Binding("column", "",columnSpan)
                ),
                $$(go.TextBlock, textStyle(),  // the name
                    {
                        row: 0, column: 0,columnSpan: 4,
                        font: "12pt Segoe UI,sans-serif",
                        editable: false, isMultiline: false,
                        minSize: new go.Size(10, 16)
                    },
                    new go.Binding("text", "name").makeTwoWay(),
                    new go.Binding("stroke", "",textColor)
                ),
                $$(go.TextBlock,textStyle(),
                    {
                        row: 1, column: 0, columnSpan: 2,
                        font: "8pt sans-serif"
                    },
                    new go.Binding("text", "", theInfoTextConverter)
                )
            ) // end of table
        ) // end Horizontal Panel
    );  // end Node

现在有些节点没有图片。但我相信 go.Picture 无论如何都会将文本侧向 50 像素(通过 go.size(50,50) )。有没有办法可以动态地将 go.Picture 添加到面板中?

这可能是一个初学者的问题。目前我正在学习如何使用 gojs

4

1 回答 1

1

是的,因为Picture是 "Horizo​​ntal" 的第一个元素Panel,它总是在右侧的 "Table"Panel的左侧。图片的尺寸始终为 50x50。

您可以设置或绑定Picture.visible为 false。这将使它占用零空间。

我假设您在 "Table" 中遗漏了一堆东西Panel,因为否则指定columnandcolumnSpan属性是没有意义的,也没有 that RowColumnDefinition

于 2016-02-27T18:02:10.787 回答