# MapStory
mapgis-3d-map-story 点此跳转到示例
# 属性
| 名称 | 类型 | 默认值 | 描述 | 是否监听 |
|---|---|---|---|---|
| dataSource | Array | [] | mapStory 数组 | 是 |
| height | Number | 700 | 地图故事面板高度 | 是 |
| width | Number | 300 | 地图故事面板宽度 | 是 |
| enableOneMap | Boolean | false | 是否为一张图模式，此模式下 UI 有所调整，不用一张图的项目可忽略 | 是 |
| models | models | {} | 模型信息对象，添加模型时使用 | 是 |
# 参数详情
### dataSource（地图故事数据源）
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| dataSource | [mapStory] | [] | mapStory 数组 |
### mapStory（地图故事对象）
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| title | String | 无标题 | 地图故事标题 |
| description | String | 无 | 地图故事描述信息 |
| uuid | String | Math.random() | 地图故事的 ID，默认随机数 |
| map | map | {} | 与地图故事绑定的底图，每个故事绑定一个底图 |
| chapters | [chapter] | [] | 地图故事的章节数组，每个地图故事可有多个章节 |
### map（地图故事底图）
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| type | String | 无 | 地图类型，分别为"WMTS","WMS","TILE"(IGS 瓦片),"DOC"(IGS 地图文档),"DYNAMIC"(IGS 矢量图层),"GeoJSON"(GeoJSON 数据) |
| baseUrl | String | 无 | 基地址 |
| layer | String | 无 | 图层名称 |
| tilingScheme | String | 无 | 瓦片切片方式，支持"EPSG:4326","EPSG:4490","EPSG:4610","EPSG:4214","EPSG:3857" |
| tileMatrixSet | String | 无 | 瓦片矩阵集 |
| format | String | image/png | 瓦片的请求返回格式，"image/png","tiles"等 |
| vueKey | String | default | vueKey，唯一标识一个 Cesium 球体，分屏时使用 |
| vueIndex | String | Math.random() | vueIndex，唯一标识一个地图图层 |
### chapter（地图故事章节信息）
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| title | String | 无标题 | 章节标题 |
| uuid | String | Math.random() | 章节 ID，默认随机数 |
| mapStoryUUID | String | Math.random() | 章节所对应的地图故事 ID |
| animationTime | Number | 5000 | 从当前章节播放到下一个章节所需时间 |
| content | String | 无 | 章节描述信息 |
| features | Array | [] | 当前章节所包含的标绘要素 |
| camera | camera | {} | 当前章节所对应的相机视角 |
### camera（地图故事相机视角对象）
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| heading | Number | 0 | 方向角，弧度制 |
| pitch | Number | 0 | 俯仰角，弧度制 |
| roll | Number | 0 | 滚动角，弧度制 |
| positionCartographic | Object | {} | 相机视角所在位置 |
| positionCartographic.longitude | Number | 0 | 经度 |
| positionCartographic.latitude | Number | 0 | 纬度 |
| positionCartographic.height | Number | 0 | 高程 |
### models（模型信息）
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| models | Object | {} | 模型分类对象 |
| models.img | String | 无 | 模型缩略图的相对路径 |
| models.model | String | 无 | 模型的相对路径 |
# 事件
# @storyPreview
- 描述 预览地图故事
- Payload
{ mapStoryData } mapStoryData地图故事数据，预览功能默已经包含在地图故事里，当希望自己实现预览功能时，可使用此事件
# @chapterPreview
- 描述 预览地图里的某一章节
- Payload
{ mapStoryData } mapStoryData地图故事数据，预览功能默已经包含在地图故事里，当希望自己实现预览功能时，可使用此事件
# @save
- 描述 保存地图故事
- Payload
{ mapStoryData } mapStoryData地图故事数据
## 示例
<template>
<mapgis-web-scene style="height:95vh">
<mapgis-3d-map-story
@storyPreview="storyPreview"
@chapterPreview="chapterPreview"
@save="save"
:dataSource="dataSource"
/>
</mapgis-web-scene>
</template>
<script>
export default {
data() {
return {
dataSource: []
};
},
methods: {
storyPreview(mapStoryData) {},
chapterPreview(mapStoryData) {},
save(mapStoryData) {}
}
};
</script>
<style lang="css"></style>