Class: DrawTool

DrawTool()

The DrawTool view allows a user to draw an arbitrary polygon on the map. The polygon is stored in a GeoPoints collection and displayed on the map using a connected CesiumVectorData model.

Screenshot

Constructor

new DrawTool()

Since:
  • 2.27.0
Source:

Extends

  • Backbone.View

Members

buttonClass :string

Class to use for the buttons
Type:
  • string
Source:

buttonClassActive :string

Class to use for the active button
Type:
  • string
Source:

buttonEls :Object

The buttons that have been rendered in the toolbar. Formatted as an object with the button name as the key and the button element as the value.
Type:
  • Object
Source:

buttons :Array.<DrawToolButtonOptions>

The buttons to display in the toolbar and their corresponding actions.
Type:
Source:

className :string

The HTML classes to use for this view's element
Type:
  • string
Source:

color :string

The color of the polygon that is being drawn as a hex string.
Type:
  • string
Source:

interactions :MapInteraction

A reference to the MapInteraction model on the MapModel that is used to listen for clicks on the map.
Type:
Source:

layer :CesiumVectorData

The CesiumVectorData model that will display the polygon that is being drawn.
Type:
Source:

mapModel :Map

The Cesium map model to draw on. This must be the same model that the mapWidget is using.
Type:
Source:

mode

The current mode of the draw tool. This can be "draw", "move", "remove", or "add" - any of the "name" properties of the buttons array, excluding buttons like "clear" and "save" that have a method property.
Source:

opacity :number

The initial opacity of the polygon that is being drawn. A number between 0 and 1.
Type:
  • number
Source:

points :GeoPoints

The GeoPoints collection that stores the points of the polygon that is being drawn.
Type:
Source:

type :string

The type of View this is
Type:
  • string
Source:

Methods

activateButton()

Sets the style of the button with the given name to indicate that it is active.
Source:

addPoint(point) → {GeoPoint}

Adds a point to the polygon that is being drawn.
Parameters:
Name Type Description
point Object The point to add to the polygon. This should have a latitude and longitude property.
Source:
Returns:
The GeoPoint model that was added to the polygon.
Type
GeoPoint

clearPoints()

Clears the polygon that is being drawn.
Source:

handleClick(throttleopt)

Handles a click on the map. If the draw tool is active, it will add the coordinates of the click to the polygon being drawn.
Parameters:
Name Type Attributes Default Description
throttle Number <optional>
50 The number of milliseconds to block clicks for after a click is handled. This prevents double clicks.
Source:

initialize(options)

Initializes the DrawTool
Parameters:
Name Type Description
options Object A literal object with options to pass to the view
Properties
Name Type Attributes Default Description
model Map The Cesium map model to draw on. This must be the same model that the mapWidget is using.
mode string <optional>
false The initial mode of the draw tool.
Source:

onClose()

Clears the polygon that is being drawn
Source:

removeClickListeners()

Removes the click listeners from the map model and sets the clickFeatureAction back to its original value.
Source:

removeLayer()

Removes the polygon object from the map
Source:

render() → {DrawTool}

Renders the DrawTool
Source:
Returns:
Returns the view
Type
DrawTool

renderToolbar()

Create and insert the buttons for drawing and clearing the polygon.
Source:

reset()

Resets the draw tool to its initial state.
Source:

resetButtonStyles()

Resets the styles of all of the buttons to indicate that they are not active.
Source:

save(callback)

Sends the polygon coordinates to a callback function to do something with them.
Parameters:
Name Type Description
callback function The callback function to send the polygon coordinates to.
Source:

setClickListeners()

Set listeners to call the handleClick method when the user clicks on the map.
Source:

setMode(mode)

Sets the mode of the draw tool. Currently only "draw" and false are supported.
Parameters:
Name Type Description
mode string | boolean The mode to set. This can be "draw" or false to indicate that the draw tool should not be active.
Source:

setUpConnectors() → {GeoPointsVectorData}

Sets up the connector to connect the GeoPoints collection to the CesiumVectorData model. Adds the connector and points properties to this view.
Source:
Returns:
The connector
Type
GeoPointsVectorData

setUpLayer() → {CesiumVectorData}

Sets up the layer to show the polygon on the map that is being drawn. Adds the layer property to this view.
Source:
Returns:
The CesiumVectorData model that will display the polygon that is being drawn.
Type
CesiumVectorData

setUpMapModel()

Sets up the map model and adds the interactions and originalAction properties to this view.
Source:

showError(messageopt)

Show an error message to the user if the map model is not available or any other error occurs.
Parameters:
Name Type Attributes Description
message string <optional>
The error message to show to the user.
Source:

toggleMode(mode)

Toggles the mode of the draw tool.
Parameters:
Name Type Description
mode string The mode to toggle to.
Source: