Class SceneComponent

Renders an Esri ArcGIS JavaScript API SceneView to the DOM.

This component can be thought of as the top of a VMC map tree. Add the vmc-web-map selector to your Angular template, and add any dependent widgets inside the element as child elements.

Example usage:

<vmc-scene>
  <vmc-legend></vmc-legend>
</vmc-scene>

Hierarchy

  • SceneComponent

Implements

  • ViewBase
  • OnInit
  • OnDestroy

Constructors

constructor

Properties

_basemap$ _center$ _initProps$ _view _zoom$ destroy$ el esriEventer rxLayerViewService sceneService view view$

Events

centerChange focusedChange interactingChange isUpdatingLayers orientationChange resolutionChange scaleChange sceneViewReady stationaryChange updatingChange viewBlur viewClick viewDblClick viewDrag viewFocus viewHold viewImmediateClick viewImmediateDblClick viewKeyDown viewKeyUp viewLayerViewCreate viewLayerViewCreateError viewLayerViewDestroy viewMouseWheel viewPointerDown viewPointerEnter viewPointerLeave viewPointerMove viewPointerUp viewResize viewpointChange zoomChange

Accessors

basemap center initProps zoom

Methods

initScene ngOnDestroy ngOnInit

Constructors

constructor

  • Parameters

    • destroy$: Observable<null>
    • esriEventer: EsriEventer
    • sceneService: SceneService
    • rxLayerViewService: RxLayerViewService

    Returns SceneComponent

Properties

Readonly Private _basemap$

_basemap$: BehaviorSubject<undefined | string | BasemapProperties> = ...

Readonly Private _center$

_center$: BehaviorSubject<number[] | Point> = ...

Readonly Private _initProps$

_initProps$: BehaviorSubject<null | SceneViewProperties> = ...

Private _view

_view: BehaviorSubject<null | SceneView> = ...

Readonly Private _zoom$

_zoom$: BehaviorSubject<number> = ...

Private destroy$

destroy$: Observable<null>

el

el: ElementRef<HTMLDivElement>

/**

  • An Angular ElementRef
  • of the
    element that hosts the map view.

Private esriEventer

esriEventer: EsriEventer

Private rxLayerViewService

rxLayerViewService: RxLayerViewService

Private sceneService

sceneService: SceneService

view

view: null | SceneView = null

A reference to the Esri SceneView that is associated with this component's view.

Readonly view$

view$: Observable<null | SceneView> = ...

Events

centerChange

centerChange: Observable<Point> = ...

The Esri SceneView.center property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

supports 2-way data binding, but it can disrupt animations.

focusedChange

focusedChange: Observable<boolean> = ...

The Esri SceneView.focused property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

interactingChange

interactingChange: Observable<boolean> = ...

The Esri SceneView.interacting property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

isUpdatingLayers

isUpdatingLayers: Observable<boolean> = ...

An rxjs Observable Stream exposed as an Angular Event. This property events the value true when one or more supported layers in the SceneView are updating. It emits false when the updates are stable.

orientationChange

orientationChange: Observable<string> = ...

The Esri SceneView.orientation property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

resolutionChange

resolutionChange: Observable<number> = ...

The Esri SceneView.resolution property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

scaleChange

scaleChange: Observable<number> = ...

The Esri SceneView.scale property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

sceneViewReady

sceneViewReady: EventEmitter<SceneView> = ...

Emits a reference to the Esri SceneView when it is fully loaded, as indicated by the View's View.when method.

stationaryChange

stationaryChange: Observable<boolean> = ...

The Esri SceneView.stationary property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

updatingChange

updatingChange: Observable<boolean> = ...

The Esri SceneView.updating property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

viewBlur

viewBlur: Observable<ViewBlurEvent> = ...

The Esri SceneView.blur event, exposed as an Angular event.

viewClick

viewClick: Observable<ViewClickEvent> = ...

The Esri SceneView.click event, exposed as an Angular event.

viewDblClick

viewDblClick: Observable<ViewDoubleClickEvent> = ...

The Esri SceneView.double-click event, exposed as an Angular event.

viewDrag

viewDrag: Observable<ViewDragEvent> = ...

The Esri SceneView.drag event, exposed as an Angular event.

viewFocus

viewFocus: Observable<ViewFocusEvent> = ...

The Esri SceneView.focus event, exposed as an Angular event.

viewHold

viewHold: Observable<ViewHoldEvent> = ...

The Esri SceneView.hold event, exposed as an Angular event.

viewImmediateClick

viewImmediateClick: Observable<ViewImmediateClickEvent> = ...

The Esri SceneView.immediate-click event, exposed as an Angular event.

viewImmediateDblClick

viewImmediateDblClick: Observable<ViewImmediateDoubleClickEvent> = ...

The Esri SceneView.immediate-double-click event, exposed as an Angular event.

viewKeyDown

viewKeyDown: Observable<ViewKeyDownEvent> = ...

The Esri SceneView.key-down event, exposed as an Angular event.

viewKeyUp

viewKeyUp: Observable<ViewKeyUpEvent> = ...

The Esri SceneView.key-up event, exposed as an Angular event.

viewLayerViewCreate

viewLayerViewCreate: Observable<ViewLayerviewCreateEvent> = ...

The Esri SceneView.layerview-create event, exposed as an Angular event.

viewLayerViewCreateError

viewLayerViewCreateError: Observable<ViewLayerviewCreateErrorEvent> = ...

The Esri SceneView.layerview-create-error event, exposed as an Angular event.

viewLayerViewDestroy

viewLayerViewDestroy: Observable<ViewLayerviewDestroyEvent> = ...

The Esri SceneView.layerview-destroy event, exposed as an Angular event.

viewMouseWheel

viewMouseWheel: Observable<ViewMouseWheelEvent> = ...

The Esri SceneView.mouse-wheel event, exposed as an Angular event.

viewPointerDown

viewPointerDown: Observable<ViewPointerDownEvent> = ...

The Esri SceneView.pointer-down event, exposed as an Angular event.

viewPointerEnter

viewPointerEnter: Observable<ViewPointerEnterEvent> = ...

The Esri SceneView.pointer-enter event, exposed as an Angular event.

viewPointerLeave

viewPointerLeave: Observable<ViewPointerLeaveEvent> = ...

The Esri SceneView.pointer-leave event, exposed as an Angular event.

viewPointerMove

viewPointerMove: Observable<ViewPointerMoveEvent> = ...

The Esri SceneView.pointer-move event, exposed as an Angular event.

viewPointerUp

viewPointerUp: Observable<ViewPointerUpEvent> = ...

The Esri SceneView.pointer-up event, exposed as an Angular event.

viewResize

viewResize: Observable<ViewResizeEvent> = ...

The Esri SceneView.resize event, exposed as an Angular event.

viewpointChange

viewpointChange: Observable<Viewpoint> = ...

The Esri SceneView.viewpoint property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

Does not supports 2-way data binding.

zoomChange

zoomChange: Observable<number> = ...

The Esri SceneView.zoom property as an Angular event. Internally, the VMC library uses the Esri watch pattern.

Remark

supports 2-way data binding, but it can disrupt animations.

Accessors

basemap

  • set basemap(val: undefined | string | BasemapProperties): void

  • An Angular component input property that sets the default basemap.

    If set during the components runtime (after ngOnInit), changing this property will update the scene.

    Parameters

    • val: undefined | string | BasemapProperties

    Returns void

center

  • set center(val: number[]): void

  • An Angular component input property that sets the default center of the map. Expects a coordinate array of [x, y] or an Esri Point.

    If set during the components runtime (after ngOnInit), changing this property will update the map.

    Parameters

    • val: number[]

    Returns void

initProps

  • set initProps(val: null | SceneViewProperties): void

  • A static set of Esri SceneViewProperties that will be passed to the Esri SceneView when it is constructed by the WebMapComponent. Useful to set properties on the view for the first render. For example, to disable parts of the default SceneView UI.

    Parameters

    • val: null | SceneViewProperties

    Returns void

zoom

  • set zoom(val: number): void

  • An Angular component input property that sets the default zoom of the map.

    If set during the components runtime (after ngOnInit), changing this property will update the map.

    Parameters

    • val: number

    Returns void

Methods

initScene

  • Parameters

    • basemap: string | Basemap
    • center: number[] | Point
    • zoom: number
    • initProps: null | SceneViewProperties

    Returns void

Private ngOnDestroy

  • Private

    Returns void

Private ngOnInit

  • Private

    Returns void

Settings

Member Visibility

Theme

Generated using TypeDoc