Draw a free line on layout

@Abhishek wrote:

I want to be able to draw a free line by drag creation like we build walls in Floor Planner App, but want a node (a simple free line) rather than a group.
I know this may be too simple of a question, but I browsed many questions but can’t find a solution.

I started with the below code –

this.floorPlan.nodeTemplateMap.add(
      "LineNode",
      this.makeLineNode()
    );

    this.floorPlan.toolManager.mouseMoveTools.insertAt(
      2,
      $(DragCreatingTool, {
        isEnabled: true,
        delay: 0,
        box: $(go.Part, "Spot",
           $(go.Shape, "MinusLine")
        ),
        insertPart: function (bounds) {
          this.archetypeNodeData.category = "LineNode";
          return DragCreatingTool.prototype.insertPart.call(this, bounds);
        },
      })
);

 makeLineNode() {
    var $ = go.GraphObject.make;
    return $(go.Node, 'Spot',
      {
        selectionObjectName: 'SHAPE',
        rotateObjectName: 'SHAPE',
        locationSpot: go.Spot.TopLeft,
        reshapable: true,
        minSize: new go.Size(1, 1),
        selectionAdorned: false,
        copyable: false
      },
      $(go.Shape,
        {
          name: 'SHAPE',
          fill: 'lightgray', stroke: 'black', strokeWidth: 1
        },
        new go.Binding('fill', 'color'),
        new go.Binding('stroke', 'isSelected', function (s, obj) {
          if (obj.part.containingGroup != null) {
            const group = obj.part.containingGroup;
            if (s) { group.data.isSelected = true; }
          }
          return s ? 'dodgerblue' : 'black';
        }).ofObject()
      )
    );
  }

Posts: 1

Participants: 1

Read full topic