mapgis-3d-scene-roaming
# 属性
# vueKey
- 类型:
String
- 可选
- 非侦听属性
- 默认值:
default
- 描述: mapgis-web-scene 组件的 ID,当使用多个 mapgis-web-scene 组件时,需要指定该值,来唯一标识 mapgis-web-scene 组件,同时 mapgis-web-scene 插槽中的组件也需要传入相同的 vueKey,让组件知道应该作用于哪一个 mapgis-web-scene。
# vueIndex
- 类型:
Number
- 可选
- 非侦听属性
- 默认值:
(Math.random() * 100000000).toFixed(0)
随机计算值 - 描述: 当 mapgis-web-scene 插槽中使用了多个相同组件时,例如多个 mapgis-3d-igs-doc-layer 组件,用来区分组件的标识符。
# setting
- 可选
- 非侦听属性
- 默认值
{
"speed": 10,
"exHeight": 1,
"heading": 90,
"pitch": 0,
"range": 1,
"animationType": 1,
"interpolationAlgorithm": "LagrangePolynomialApproximation",
"isLoop": true,
"showPath": true,
"showInfo": true,
"modelUrl": ""
}
描述: 漫游参数设置
参数 类型 描述 speed Number 漫游速度。默认 10m/s(10 米/秒) 特别提醒(漫游场景范围很大的时候,这个一定要设置大,比如飞机可能就是真实的几千米每秒 如果不按真实设置,会导致内部时间点插值过密,造成卡顿)。 exHeight Number 附加高程。默认 1 heading Number 航向角 (单位弧度)。默认 90 pitch Number 俯仰角 (单位弧度)。默认 0 range Number 视角高度。默认 0 animationType Number 动画漫游的类型。默认 1。动画漫游的类型:1 跟随,2 锁定第一视角,3 上帝视角。场景漫游三个视角解释:跟随:相机视角不与漫游模型同时移动,可交互,方位角,俯仰角,距离不可设置,因为这三个参数的值的改变对场景没有影响;锁定第一视角:模拟本人漫游,可设置方位角,俯仰角,距离;上帝视角:从上空俯视漫游,俯仰角默认为-90,方位角默认为 90,方位角和距离可设置。 interpolationAlgorithm String 插值算法 默认 LagrangePolynomialApproximation 拉格朗日 还有线性插值 LinearApproximation 埃尔米特插值插值 HermitePolynomialApproximation。 isLoop Boolean 是否循环。 默认 true showPath Boolean 是否显示路径。默认 true showInfo Boolean 是否显示提示信息。默认 true modelUrl String 模型资源路径。默认"",可通过配置界面设置
# models
- 类型:
Array
- 可选
- 非侦听属性
- 默认值: []
- 描述: 模型数组, 示例:[{label: "人",value: "./CesiumModels/Cesium_Man.glb",},{label: "卡车",value: "./CesiumModels/CesiumMilkTruck.glb",},{label: "飞机",value: "./CesiumModels/Cesium_Air.gltf",}]
# paths
- 类型:
Array
- 可选
- 非侦听属性
- 默认值: []
- 描述: 路径数据数组
# 方法
# onAddPathStart
- Description: 新增路线
# onAddPathComplete
- Description: 新路线增加完成。
# onAddPathCancel
- Description: 取消新路线增加。
# onGotoPath
- Description: 进入指定路径设置界面。
- Param:
{path}
path
路径对象
# onDeletePath
- Description: 删除指定路径。
- Param:
{path}
path
路径对象
# onGotoHome
- Description: 返回主页。
# onGetPathRoaming
- Description: 获取单个路径漫游组件对象。
- Payload 单个路径漫游组件对象
# 事件
# @load
- Description: 在 场景漫游组件 加载完毕后发送该事件
- Payload 场景漫游组件对象
# @unload
- Description: 在 场景漫游组件 销毁时发送该事件
- Payload 场景漫游组件对象
# @save-paths
- Description: 点击保存按钮发送该事件
- Payload paths 路径数据对象
# 示例
<template>
<mapgis-web-scene style="{height: '100vh'}">
<mapgis-3d-ogc-wmts-layer
:baseUrl="url"
:wmtsLayer="layer"
:tileMatrixSet="tileMatrixSet"
:format="format"
:tilingScheme="tilingScheme"
:token="token"
></mapgis-3d-ogc-wmts-layer>
<mapgis-3d-igs-m3d
:autoReset="autoReset"
:maximumScreenSpaceError="maximumScreenSpaceError"
:url="m3dUrl"
/>
<mapgis-ui-card class="storybook-ui-card">
<mapgis-3d-scene-roaming :setting="setting" :models="models" />
</mapgis-ui-card>
</mapgis-web-scene>
</template>
<script>
export default {
name: "sceneroaming",
data() {
return {
url: "http://t0.tianditu.gov.cn/img_c/wmts",
m3dUrl: "http://develop.smaryun.com:6163/igs/rest/g3d/ZondyModels",
autoReset: true,
maximumScreenSpaceError: 8,
tileMatrixSet: "c",
tilingScheme: "EPSG:4326",
layer: "img",
format: "tiles",
token: {
key: "tk",
value: "2ddaabf906d4b5418aed0078e1657029"
},
setting: {
speed: 10,
exHeight: 1,
heading: 90,
pitch: 0,
range: 1,
animationType: 1,
interpolationAlgorithm: "LagrangePolynomialApproximation",
isLoop: true,
showPath: true,
showInfo: true,
modelUrl: ""
},
models: [
{
label: "人",
value: "./CesiumModels/Cesium_Man.glb"
},
{
label: "卡车",
value: "./CesiumModels/CesiumMilkTruck.glb"
},
{
label: "飞机",
value: "./CesiumModels/Cesium_Air.gltf"
}
]
};
},
methods: {}
};
</script>