Class StandardUIViewer

標準 Mapray Viewer

コアライブラリのラッパです。 マウス操作やキーボード操作など一般的な操作がサポートされます。

import mapray from "@mapray/mapray-js";
import maprayui from "@mapray/ui";

const node = document.getElementById("id"); // HTMLElement要素を取得します
const ACCESS_TOKEN = "..."; // 事前に取得した値を指定します。

const stdViewer = new maprayui.StandardUIViewer( node, ACCESS_TOKEN );

const mtFujiPosition = new mapray.GeoPoint(138.72884, 35.36423, 0);

// カメラ視点の変更
stdViewer.setCameraPosition({
  longitude: mtFujiPosition.longitude,
  latitude: mtFujiPosition.latitude - 0.05,
  height: mtFujiPosition.altitude + 6000
});

// カメラ視線先の変更
stdViewer.setLookAtPosition({
  longitude: mtFujiPosition.longitude,
  latitude: mtFujiPosition.latitude,
  height: mtFujiPosition.altitude + 3000
});

const pin = new mapray.PinEntity(stdViewer.viewer.scene)
pin.altitude_mode = mapray.AltitudeMode.RELATIVE;
pin.addMakiIconPin( "mountain-15", mtFujiPosition );
stdViewer.addEntity(pin);

Hierarchy

Constructors

constructor

Properties

_altitude_range _animation _buf_matrix1 _buf_matrix2 _camera_parameter _controllable _curve_move? _curve_rotation? _default_fov _flycamera_on_success? _flycamera_target_time _flycamera_total_time _fovy_key _free_rotate_drag _height_drag _key_mode _last_camera_parameter _mouse_down_position _operation_mode _pre_mouse_position _rotate_center? _rotate_drag _translate_drag _translate_eye_drag _update_url_hash _update_url_hash_backup _update_url_hash_full_digits _updater _viewer? _viewer_camera_mode _zoom_wheel

Accessors

viewer

Methods

_addEventListener _calculateKeyPoint _changeFovy _correctAltitude _freeRotation _getLookAtAngle _getOffsetPoint _initCameraParameter _isSame _mousePos _onBlur _onHashChange _onKeyDown _onKeyUp _onMouseDown _onMouseMove _onMouseUp _onMouseWheel _removeEventListener _resetEventParameter _restoreCameraParameterFromHash _setupAnimationBindingBlock _updateURLHash addEntity addLayer calculateAngle clearEntities clearLayer createCameraParameterHash createDemProvider createFlyCurve createImageProvider createViewer destroy disableURLUpdate enableURLUpdate getCameraAngle getCameraParameter getCameraParameterFromHash getCameraPosition getControllable getEntity getEntityNum getLayer getLayerNum insertLayer onBlur onEndFlyCamera onKeyDown onKeyUp onMouseDown onMouseMove onMouseUp onMouseWheel onStart onStop onUpdateFrame removeEntity removeLayer resetOpEvent rotateVector setCameraAngle setCameraParameter setCameraPosition setControllable setLookAtPosition startFlyCamera updateCamera updateClipPlane updateFlyCamera updateRotation updateTranslation updateTranslationOfEyeDirection updateTranslationOfHeight

Constructors

constructor

Properties

Private _altitude_range

_altitude_range: {
    max: number;
    min: number;
}

Type declaration

  • max: number
  • min: number

Private _animation

_animation: EasyBindingBlock

Private _buf_matrix1

_buf_matrix1: Matrix

Private _buf_matrix2

_buf_matrix2: Matrix

Private _camera_parameter

_camera_parameter: CameraParameter & RollPitchYawData & GeoPointData

Private _controllable

_controllable: boolean

Private Optional _curve_move

_curve_move?: KFLinearCurve

Private Optional _curve_rotation

_curve_rotation?: KFLinearCurve

Private _default_fov

_default_fov: number = StandardUIViewer.DEFAULT_CAMERA_PARAMETER.fov

リセット用の画角

Private Optional _flycamera_on_success

_flycamera_on_success?: (() => void)

Type declaration

    • (): void

    • Returns void

Private _flycamera_target_time

_flycamera_target_time: number

Private _flycamera_total_time

_flycamera_total_time: number

Private _fovy_key

_fovy_key: number

画角変更の指定回数

Private _free_rotate_drag

_free_rotate_drag: Vector2

自由回転の移動量（マウスの移動量）

Private _height_drag

_height_drag: Vector2

高度変更の移動量（マウスの移動量）

Private _key_mode

_key_mode: boolean

キー操作中

Private _last_camera_parameter

_last_camera_parameter: CameraParameter & RollPitchYawData & GeoPointData

Private _mouse_down_position

_mouse_down_position: [x: number, y: number]

マウスダウンした位置

Private _operation_mode

_operation_mode: OperationMode

Private _pre_mouse_position

_pre_mouse_position: [x: number, y: number]

直前のマウス位置

Private Optional _rotate_center

_rotate_center?: Vector3

回転中心

Private _rotate_drag

_rotate_drag: Vector2

回転の移動量（マウスの移動量）

Private _translate_drag

_translate_drag: Vector2

平行移動の移動量（マウスの移動量）

Private _translate_eye_drag

_translate_eye_drag: Vector2

平行移動の移動量（マウスの移動量）

Private _update_url_hash

_update_url_hash: boolean

URLHash更新フラグ

Private _update_url_hash_backup

_update_url_hash_backup: boolean

Private _update_url_hash_full_digits

_update_url_hash_full_digits: boolean

URLに含む値の桁数(true:全桁, false:桁数制限)

Private _updater

_updater: Updater

Protected Optional _viewer

_viewer?: Viewer

Private _viewer_camera_mode

_viewer_camera_mode: CameraMode

Private _zoom_wheel

_zoom_wheel: number

視線方向への移動量（ホイールの移動量）

Accessors

viewer

Methods

Private _addEventListener

Private _calculateKeyPoint

Private _changeFovy

Private _correctAltitude

Private _freeRotation

Private _getLookAtAngle

Private _getOffsetPoint

  • _getOffsetPoint(longitude: number, latitude: number, distance: number, bearing: number, dst: GeoPoint): GeoPoint

  • ある地点から指定距離、指定方向に移動した位置を算出する

    Parameters

    • longitude: number

      経度

    • latitude: number

      緯度

    • distance: number

      距離(m)

    • bearing: number

      方角(deg)

    • dst: GeoPoint

      計算結果が格納されるオブジェクト

    Returns GeoPoint

Private _initCameraParameter

Private _isSame

  • _isSame(value1: number, value2: number, threshold?: number): boolean

  • 閾値のある同一判定

    Returns

    判定結果

    Parameters

    • value1: number

      値1

    • value2: number
    • threshold: number = 0.000001

      閾値

    Returns boolean

Private _mousePos

  • _mousePos(el: HTMLElement, event: MouseEvent): [x: number, y: number]

  • 要素上での座標を取得

    Returns

    要素(el)の上での座標

    Parameters

    • el: HTMLElement

      HTMLElement

    • event: MouseEvent

      イベントオブジェクト

    Returns [x: number, y: number]

Private _onBlur

Private _onHashChange

Private _onKeyDown

Private _onKeyUp

Private _onMouseDown

  • _onMouseDown(event: MouseEvent): void

  • マウスを押した時のイベント

    Parameters

    • event: MouseEvent

      マウスイベントデータ

    Returns void

Private _onMouseMove

  • _onMouseMove(event: MouseEvent): void

  • マウスを動かした時のイベント

    Parameters

    • event: MouseEvent

      マウスイベントデータ

    Returns void

Private _onMouseUp

  • _onMouseUp(event: MouseEvent): void

  • マウスを上げた時のイベント

    Parameters

    • event: MouseEvent

      マウスイベントデータ

    Returns void

Private _onMouseWheel

Private _removeEventListener

Private _resetEventParameter

Private _restoreCameraParameterFromHash

Private _setupAnimationBindingBlock

Private _updateURLHash

addEntity

addLayer

Protected calculateAngle

clearEntities

clearLayer

createCameraParameterHash

  • 現在のカメラ情報から URL Hash string を取得

    Returns

    Hash Stringが生成できないときは undefined

    Returns undefined | string

Protected createDemProvider

Protected createFlyCurve

Protected createImageProvider

Protected createViewer

destroy

disableURLUpdate

enableURLUpdate

  • URL Hash 書き換え機能を有効にします。 カメラ移動時に自動的に URL Hash を書き換えます。

    Parameters

    • readUrlOnStart: boolean

      true の場合、関数呼び出し時に URL Hash で示される位置に移動します。

    Returns void

getCameraAngle

getCameraParameter

getCameraParameterFromHash

getCameraPosition

Protected getControllable

getEntity

getEntityNum

getLayer

getLayerNum

insertLayer

  • レイヤの追加（任意）

    Parameters

    • index: number

      挿入場所

    • layer: any

      作成するレイヤのプロパティ

    Returns void

onBlur

Protected onEndFlyCamera

onKeyDown

onKeyUp

onMouseDown

  • マウスを押した時のイベント

    Parameters

    • point: [x: number, y: number]

      要素上の座標

    • event: MouseEvent

      マウスイベントデータ

    Returns void

onMouseMove

  • マウスを動かした時のイベント

    Parameters

    • point: [x: number, y: number]

      要素上の座標

    • event: MouseEvent

      マウスイベントデータ

    Returns void

onMouseUp

  • マウスを上げた時のイベント

    Parameters

    • point: [x: number, y: number]

      要素上の座標

    • event: MouseEvent

      マウスイベントデータ

    Returns void

onMouseWheel

  • マウスホイールを動かした時のイベント

    Parameters

    • point: [x: number, y: number]

      要素上の座標

    • event: WheelEvent

      ホイールイベント

    Returns void

onStart

onStop

onUpdateFrame

removeEntity

removeLayer

resetOpEvent

Protected rotateVector

setCameraAngle

setCameraParameter

setCameraPosition

Protected setControllable

setLookAtPosition

startFlyCamera

  • ２点間のカメラアニメーション

    • 指定した位置間でカメラアニメーションを行う iscs_startで指定した位置、もしくは現在のカメラの位置から、 iscs_endで指定した位置から20km南側、上方向に+20kmの高度の位置からiscs_endを注視点とした位置と方向に timeで指定された秒数でカメラアニメーションを行う。 途中、高度200kmまでカメラが上昇する。

    Returns

    Promise

    Parameters

    • options: FlyParam

      引数オブジェクト

    Returns Promise<void>

Protected updateCamera

Protected updateClipPlane

Protected updateFlyCamera

  • Fly中のupdate処理

    Fly実行中(this._viewer_camera_mode が StandardUIViewer.CameraMode.CAMERA_FLY の時)は onUpdateFrame から呼び出されます

    Parameters

    • delta_time: number

    Returns void

Protected updateRotation

Protected updateTranslation

Protected updateTranslationOfEyeDirection

Protected updateTranslationOfHeight

Settings

Member Visibility

Theme