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/ogc3d/ruler3d/Ruler3DController.ts)
/**
 * Handle the user input gestures. The event-object contains information about the type of user-interaction
 */
onGestureEvent(event: GestureEvent): HandleEventResult {
  if (!this._enabled) {
    return EVENT_IGNORED;
  }
  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.MOVE:
    //when user "hovers" over the map, we measure, but do not confirm any point
    return this.onMove(event);
  case GestureEventType.DOUBLE_CLICK:
    //user confirms the polyline
    return this.onDoubleClick(event);
  case GestureEventType.SINGLE_CLICK_UP:
    //user performed click and no double click can follow
    return this.onClick(event);
  default:
    break;
  }
  return HandleEventResult.EVENT_IGNORED;
}

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/ogc3d/ruler3d/Ruler3DController.ts)
onDraw(geoCanvas: GeoCanvas): void {
  if (!this._enabled) {
    return;
  }
  // Array of {line, distance, p1, p2} where p1, p2 {modelPoint, worldPoint}
  const segments = this._measurement!.segments;

  const isTypeOrtho = this.isCurrentMeasureType(MeasureType.ORTHO);
  const isTypeHeight = this.isCurrentMeasureType(MeasureType.HEIGHT);
  const isTypeArea = this.isCurrentMeasureType(MeasureType.AREA);

  if (isTypeArea) {
    this._presentation.drawArea(geoCanvas, segments);
  }

  for (let i = 0; i < segments.length; i++) {
    const segment = segments[i];
    this._presentation.drawSegmentPoints(geoCanvas, segment, i);

    if (!isTypeHeight) {
      this._presentation.drawSegment(geoCanvas, segment);
    }

    if (isTypeOrtho) {
      this._presentation.drawOrtho(geoCanvas, segment);
    }

    if (isTypeHeight) {
      this._presentation.drawHeight(geoCanvas, segment, i);
    }
  }
  // Controller implements Evented - inform listeners that measure results changed
  this._eventedSupport.emit(MEASUREMENT_CHANGED_EVENT);
}

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/ogc3d/ruler3d/Ruler3DController.ts)
onDrawLabel(labelCanvas: LabelCanvas): void {
  if (!this._enabled) {
    return;
  }
  // Array of {line, distance, p1, p2} where p1, p2 {modelPoint, worldPoint}
  const segments = this._measurement!.segments;

  const isTypeOrtho = this.isCurrentMeasureType(MeasureType.ORTHO);
  const isTypeHeight = this.isCurrentMeasureType(MeasureType.HEIGHT);
  const isTypeArea = this.isCurrentMeasureType(MeasureType.AREA);

  if (isTypeArea) {
    this._presentation.drawAreaLabel(labelCanvas, segments);
  }

  for (let i = 0; i < segments.length; i++) {
    const segment = segments[i];
    if (!isTypeHeight) {
      this._presentation.drawSegmentLabel(labelCanvas, segment);
    }

    if (isTypeOrtho) {
      this._presentation.drawOrthoLabel(labelCanvas, segment);
    }

    if (isTypeHeight) {
      this._presentation.drawHeightLabel(labelCanvas, segment, i);
    }
  }
}

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.