Can we preview the link as drawn?

@ahmetgundogdu wrote:

I’m using a Bezier connection type, so can I preview it as it was drawn?

Preview Link:

Drawed Link:

My Link Template

    this.diagram.linkTemplate =
                goMake(go.Link, go.Link.Bezier,
                    {
                        fromEndSegmentLength: 50,
                        toEndSegmentLength: 125,
                        toShortLength: 0.5,
                        //relinkableFrom: false,//this.findConfigDiagram("linkConfig", "relinkableFrom"),
                        //relinkableTo: false,// this.findConfigDiagram("linkConfig", "relinkableTo"),
                        //reshapable: this.findConfigDiagram("linkConfig", "reshapable"),
                        //resegmentable: this.findConfigDiagram("linkConfig", "resegmentable"),
                        //routing: this.getGoEnumValue(this.findConfigDiagram("linkConfig", "routing")),
                        adjusting: go.Link.End, //this.getGoEnumValue(this.findConfigDiagram("linkConfig", "adjusting")),
                        //curve: this.getGoEnumValue(this.findConfigDiagram("linkConfig", "curve")),
                        //corner: this.findConfigDiagram("linkConfig", "corner"),
                        zOrder: -1,

                        //mouse-overs subtly highlight links:
                        mouseEnter: (e: any, link: go.Link) => {
                            (link.findObject("HIGHLIGHT") as any).stroke = "rgba(30,144,255,0.2)";
                            let setVisible = this.findConfigDiagram("linkConfig", "isShowMouseOver");
                            if (setVisible) {
                                //if (link.data && link.data.linkConfig) {
                                //    setVisible = link.data.linkConfig.id == 0 ? false : setVisible;
                                //}
                                link.findObject("linkTextBlockBackground").visible = setVisible;
                                link.findObject("linkTextBlock").visible = setVisible;
                            }
                        },
                        mouseLeave: (e: any, link: any) => {
                            link.findObject("HIGHLIGHT").stroke = "transparent";

                            let setVisible = !this.findConfigDiagram("linkConfig", "isShowMouseOver");
                            if (!setVisible) {
                                link.findObject("linkTextBlockBackground").visible = setVisible;
                                link.findObject("linkTextBlock").visible = setVisible;
                            }
                        },
                    },
                    {
                        selectionAdornmentTemplate:
                            goMake(go.Adornment,
                                goMake(go.Shape,
                                    { isPanelMain: true, stroke: "dodgerblue", strokeWidth: 1 }),
                                goMake(go.Shape,
                                    { toArrow: "SamiAltuncu", fill: "dodgerblue", stroke: null })
                            )
                    },
                    new go.Binding("points").makeTwoWay(),

                    goMake(go.Shape,  // the highlight shape, normally transparent
                        {
                            isPanelMain: true,
                            strokeWidth: 2,
                            stroke: "transparent",
                            name: "HIGHLIGHT",
                        }),
                    goMake(go.Shape, "RoundedRectangle", // the link path shape
                        {
                            isPanelMain: true,
                            strokeWidth: 1
                        },
                        new go.Binding("stroke", "", this.bindLinkBorderColor)
                    ),
                    goMake(go.Shape,  // the arrowhead
                        {
                            toArrow: "SamiAltuncu",
                            strokeWidth: 0
                        },
                        new go.Binding("fill", "", this.bindLinkBorderColor),
                        new go.Binding("stroke", "", this.bindLinkBorderColor)
                    ),
                    goMake(go.Panel, "Auto",
                        {
                            _isLinkLabel: this.findConfigDiagram("linkConfig", "isDraggableLinkLabel"), visible: false
                        },
                        goMake(go.Shape, "RoundedRectangle",  // the label background, which becomes transparent around the edges
                            {
                                name: "linkTextBlockBackground"
                            },
                            new go.Binding("fill", "", this.bindLinkTextBackgroundColor).makeTwoWay(),
                            new go.Binding("stroke", "", this.bindLinkTextBackgroundColor).makeTwoWay(),
                            new go.Binding("visible", "", this.bindLinkTextShow).makeTwoWay(),
                        ),


                        goMake(go.TextBlock, "transition",  // the label text
                            {
                                name: "linkTextBlock",
                                textAlign: "center",
                                isMultiline: false,
                                font: "6pt sans-serif",
                                margin: new go.Margin(2, 2, 1.41, 2),
                                editable: true,  // enable in-place editing
                            },
                            // editing the text automatically updates the model data
                            new go.Binding("text", "", this.bindLinkText).makeTwoWay(this.converterLinkText),
                            //new go.Binding("font", "", this.bindLinkTextFont).makeTwoWay(),
                            new go.Binding("isUnderline", "", this.bindLinkTextUnderline).makeTwoWay(),
                            new go.Binding("stroke", "", this.bindLinkTextColor).makeTwoWay(),
                            new go.Binding("textAlign", "", this.bindLinkTextAlignment).makeTwoWay()
                            new go.Binding("visible", "", this.bindLinkTextShow).makeTwoWay(),
                            //new go.Binding("font", "", this.bindShapeTextFont)
                        )
                    )
                );

Posts: 2

Participants: 2

Read full topic