You are using a browser that is no longer supported. Please use the latest version of Google Chrome, Mozilla Firefox, Apple Safari, or Microsoft Edge. For more information please see the System Requirements.
Skip To ContentArcGIS for DevelopersSign In Dashboard

Unsupported browser

You are using a browser that is not supported. JavaScript API works on the latest versions of Google Chrome, Mozilla Firefox, Apple Safari, or Microsoft Edge. Use one of these browsers and provide your feedback through GeoNet, the Esri Community.

  • {}
  • Firefox
  • Safari
  • undefined

Note: Support for 3D on mobile devices may vary, view the system requirements for more information.

This sample demonstrates how to prevent users from drawing self-intersecting polylines using the Draw. To start drawing, click the button located just below the zoom controls.

The draw experience is built upon specific classes referred to as draw actions. A Draw action uses view events to generate a set of coordinates from which different types of geometries can be created. Each geometry type has a corresponding draw action class.

After initializing an instance of Draw, call draw.create() and a reference to a relevant draw action will be returned.

In this example, draw.create() is method is called with polyline parameter when user clicks on the Draw polyline button. We listen to different events on the PolylineDrawAction and implement custom logic, preventing users from drawing self-intersecting polylines.

// draw polyline button
document.getElementById("line-button").onclick = function() {;

  // creates and returns an instance of PolyLineDrawAction
  const action = draw.create("polyline");

  // focus the view to activate keyboard shortcuts for sketching

  // listen polylineDrawAction events to give immediate visual feedback
  // to users as the line is being drawn on the view.
  action.on(["vertex-remove", "cursor-update", "redo", "undo"], updateVertices);

Sample search results