Free Polyline drawing without node

as I am using PolylineLinkingTool as a reference. here wants to draw a polyline independently without any nodes. it wont have any fromNode or toNode. when activate polyline tool from toolbar it should start a draw polyline as required. when user wants to finish drawing it can deactivate by double click on canvas at last point. even I see PolygonDrawingTool but it is draw a node(shape). here link is needed so cant use PolygonDrawingTool. please help me how i can manage polyline.


PolylineLinkingTool is fundamentally a LinkingTool, which draws a new Link between Nodes.

Use extensions/PolygonDrawingTool.js or extensionsTS/PolygonDrawingTool.ts. Set PolygonDrawingTool.isPolygon to false. That’s what the Polyline Linking Tool sample does when the user clicks the “Draw Polyline” button.

Thanks for the quick response.

  1. is there any possibility to draw a new link using PolylineLinkingTool without nodes?
  2. yes I check PolygonDrawingTool and make false isPolygon but still its a generate node not a link.

I suppose that is possible, but it would require additional work to implement. To get you started, here is the definition of a LinkingTool that doesn’t require a port/node to start from:

  function DisconnectedLinkingTool() {;
    this.isUnconnectedLinkValid = true;
    this._fakeStartPort = null;
  go.Diagram.inherit(DisconnectedLinkingTool, go.LinkingTool);

  DisconnectedLinkingTool.prototype.canStart = function() {
    if (!this.isEnabled) return false;
    var diagram = this.diagram;
    if (diagram === null || diagram.isReadOnly || diagram.isModelReadOnly) return false;
    if (!diagram.allowLink) return false;
    var model = diagram.model;
    if (!(model instanceof go.GraphLinksModel) && !(model instanceof go.TreeModel)) return false;
    // require left button & that it has moved far enough away from the mouse down point, so it isn't a click
    if (!diagram.lastInput.left) return false;
    // don't include the following check when this tool is running modally
    if (diagram.currentTool !== this) {
      if (!this.isBeyondDragSize()) return false;
    var port = this.findLinkablePort();
    if (port === null) {
      var $ = go.GraphObject.make;
      this._fakeStartPort = this.startObject =
        $(go.Shape, { width: 1, height: 1, portId: "", fromLinkable: true });
      var node =
          { layerName: "Tool", locationSpot: go.Spot.Center, location: diagram.firstInput.documentPoint },
    return true;

  DisconnectedLinkingTool.prototype.insertLink = function(fromnode, fromport, tonode, toport) {
    if (this._fakeStartPort !== null) {
      fromnode = fromport = null;
    var link =, fromnode, fromport, tonode, toport);
    if (link !== null) link.defaultFromPoint = this.diagram.firstInput.documentPoint.copy();
    return link;

  DisconnectedLinkingTool.prototype.doStop = function() {
    if (this._fakeStartPort !== null) {
      this._fakeStartPort = null;
  // end of DisconnectedLinkingTool

I’ve tested this in a copy of the Draggable Link sample.

If you want to do something similar but have the user click multiple times, at various consecutive points along a route, you could merge this code with the PolylineLinkingTool. You’ll need to figure out how to finish the operation, since you won’t be able to have the user click on a valid destination port to indicate that the linking operation is finished.

Thanks Walter it works, which method need to call to stop to deactivate this type. or how I can stop it while right cilck or any keystroke.

Override doKeyDown and doMouseDown and doMouseUp and decide if those events are the user’s way of telling you to finish the tool’s operation.

Remember to think about mouse-less devices such as touch-only input devices.

ok Thanks Walter. Good point to consider.