You can use the default LuciadRIA create and edit controllers, but you can also create custom controllers, by implementing Controller. You need custom controllers to add custom user interaction to your application.

Handling user gestures and key strokes

Extensions of Controller can respond to input events by overriding the Controller.onGestureEvent(GestureEvent) and Controller.onKeyEvent(KeyEvent) methods.

luciad.view.input.GestureEvent describes incoming gesture events. The GestureEvent class serves as a wrapper for the raw events generated by the browser. You can obtain the raw DOM event with the domEvent property.

Similarly, luciad.view.input.KeyEvent provides a wrapper for browser key events. You can obtain the raw DOM event with the domEvent property.

Controller implementations can also use the MapNavigator class to move around and zoom on the map. You can get a MapNavigator instance from the Map.

Program: Use a GestureEvent to handle incoming motion events. (from samples/rulercontroller/RulerController.js)
RulerController.prototype.onGestureEvent = function(event) {

  switch (event.type) {
    case GestureEventType.DRAG:
      return this._onDrag(event);
    case GestureEventType.DOWN:
      return this._onDown(event);
    case GestureEventType.DRAG_END:
      return this._onDragEnd(event);
    case GestureEventType.SINGLE_CLICK_UP:
      return this._onClick(event);
      break;
    case GestureEventType.MOVE:
      //when user "hovers" over the map,
      //we measure, but do not confirm any point
      return this._onMove(event);
      break;
    case GestureEventType.DOUBLE_CLICK:
      //user confirms the polyline
      return this._onDoubleClick(event);
    case GestureEventType.SINGLE_CLICK_CONFIRMED:
      //user performed click and no double click can follow
      return this._onClickConfirmed(event);
    default:
      break;
  }

};

Painting shapes in a Controller

You can use GeoCanvas to paint shapes in your controller. You use it in a similar way as in FeaturePainter.

The following snippet shows an example of painting shapes using a GeoCanvas from within the controller’s onDraw method.

Program: Custom Controller implementation that illustrates the usage of GeoCanvas (from samples/rulercontroller/RulerController.js)
RulerController.prototype.onDraw = function(geoCanvas) {

  geoCanvas.drawShape(this._polyLine, this._lineStyle);

  var pc = this._polyLine.pointCount;
  while (pc--) {
    geoCanvas.drawIcon(
      this._polyLine.getPoint(pc),
      this._pointIcon);
  }

};

Painting labels in a Controller

You can use LabelCanvas to paint labels in your controller. You use it in a similar way as in FeaturePainter.

Program: Custom Controller implementation that illustrates the usage of LabelCanvas (from samples/rulercontroller/RulerController.js)
RulerController.prototype.onDrawLabel = function(labelCanvas) {
  if (this._text && this._polyLine.pointCount) {
    var html = '<span class="rulerLabel">' + this._text + '</span>';
    var labelStyle = {
      positions: [PointLabelPosition.NORTH, PointLabelPosition.SOUTH]
    };
    labelCanvas.drawLabel(
      html,
      this._polyLine.getPoint(this._polyLine.pointCount - 1),
      labelStyle);
  }
};

Controller implementations must call Controller.invalidate() whenever the painted information becomes outdated. This serves as a signal that the controller wishes to re-draw its contents, and ensures that Controller.onDraw(GeoCanvas) is called during the next map repaint. Otherwise, there is no guarantee of that.