Kingwaytek

3D模型

起始版本: 1.1.0

使用 three.add3dModel 建立 3D 模型後,開始操作 3D 模型

3D模型

新增 3D 模型後,即可進行屬性修改、路徑移動等操作:

屬性修改

setCoordinates

setCoordinates(coordinates)

設定 3D 物件座標。

參數:

  • coordinates Array : 欲設定 3D 物件的座標。

範例:

setRotation

setRotation(rotation)

設定 3D 物件旋轉角度,注意:是依照 three.add3dModel 時設定的 rotation 為基準,再去另行設定旋轉角。

參數:

  • rotation Object : 欲設定 3D 物件的旋轉角度,格式為 { x: 0, y: 0, z: 0 }

範例:

setScale

setScale(scale)

設定 3D 物件的縮放比例,注意:是依照 three.add3dModel 時設定的 scale 為基準,再去另行設定縮放比例。

參數:

  • scale number | Object : 欲設定 3D 物件的縮放比例,格式可為數字或是 { x: 1, y: 1, z: 1 }

範例:

路徑移動

followPath

followPath(options)

3D 物件沿著路徑移動。

參數:

  • options Object : 路徑移動選項。
名稱描述
options.path Array路徑(必填)
options.start number開始時間(選填),預設為 Date.now()
options.duration number持續時間(必填),單位為毫秒
options.trackHeading boolean模型是否面向路徑方向(選填),預設為 true
options.curveOptions Object曲線選項,詳情參考 options.curveOptions
options.onStart Function生命週期:開始時執行的回調函式
options.onEnd Function生命週期:結束時執行的回調函式
  • options.curveOptions Object : 曲線選項。
名稱描述
curveOptions.closed boolean是否閉合(選填),預設為 false
curveOptions.curveType string曲線類型(選填),可選值為 catmullromcubicbezierquadraticbezier,預設為 catmullrom
curveOptions.tension number張力,預設為 0.0

範例:

接續下一個路徑移動:

點選「開始使用」,即可開始操作地圖

setPathScheduler

setPathScheduler(options)

設定 3D 物件路徑的時程表。

參數:

  • options Object : 路徑時程表選項。
名稱描述
options.schedule Array<Task>任務時程(必填),詳情參考 Task
options.trackHeading boolean模型是否面向路徑方向(選填),預設為 true
options.curveOptions Object曲線選項,詳情參考 options.curveOptions
options.taskOnStart Function生命週期:每個任務開始時執行的回調函式
options.taskOnEnd Function生命週期:每個任務結束時執行的回調函式
options.scheduleOnStart Function生命週期:時程表開始時執行的回調函式
options.scheduleOnEnd Function生命週期:時程表結束時執行的回調函式
  • options.curveOptions Object : 曲線選項。
名稱描述
curveOptions.closed boolean是否閉合(選填),預設為 false
curveOptions.curveType string曲線類型(選填),可選值為 catmullromcubicbezierquadraticbezier,預設為 catmullrom
curveOptions.tension number張力,預設為 0.0
  • Task Object : 任務。
名稱描述
Task.id string任務 ID(選填),若是有需修改任務時程,則需要使用 Task.id
Task.departure string出發時間(必填),格式為 'HH:mm:ss' 或是 'HH:mm'
Task.arrival string到達時間(必填),格式為 'HH:mm:ss' 或是 'HH:mm'
Task.path Array路徑(必填)

範例:

點選「開始使用」,即可開始操作地圖

updatePathScheduler

updatePathScheduler(schedule)

更新 3D物件路徑時程。

參數:

  • schedule Array<UpdatedTask> : 欲修改的路徑時程。
名稱描述
UpdatedTask.id string任務 ID(必填)
UpdatedTask.departure string出發時間(必填),格式為 'HH:mm:ss' 或是 'HH:mm'
UpdatedTask.arrival string到達時間(必填),格式為 'HH:mm:ss' 或是 'HH:mm'

範例: