# 填挖方分析
mapgis-3d-cut-fill
# 属性
# height
- 类型:
Number
- 默认值:
100
- 侦听属性
- 描述: 填方或挖方的起始高度,挖方从下往上挖,填方从上往下填
# xPaneNum
- 类型:
Number
- 默认值:
16
- 侦听属性
- 描述: x方向采样个数,数值越大,计算的值越准确
# yPaneNum
- 类型:
Number
- 默认值:
16
- 侦听属性
- 描述: y方向采样个数,数值越大,计算的值越准确
# color
- 类型:
String
- 默认值:
#398167
- 侦听属性
- 描述: 填挖方墙体颜色,与css的color属性一致,使用16进制颜色
# opacity
- 类型:
Number
- 默认值:
0.7
- 侦听属性
- 描述: 填挖方墙体透明度,与css的opacity属性一致
##方法
# startAnalyse
- Description: 开始填挖方分析
- Param:
{type,height,xPaneNum,yPaneNum}
type
可选,分析类型,cut:开挖分析,fill:填方分析height
可选,填方或挖方的起始高度,挖方从下往上挖,填方从上往下填xPaneNum
可选,x方向采样个数,数值越大,计算的值越准确yPaneNum
可选,y方向采样个数,数值越大,计算的值越准确
# stopAnalyse
- Description: 清除填挖方分析
# 事件
# @loaded
- Description: 填挖方组件加载完毕事件
- Payload
{ Fill }
Fill
填挖方组件对象
# @analysed
- Description: 在填挖方分析完毕后发送该事件
- Payload
{ result }
result
分析结果
# @analyseStoped
- Description: 在清除填挖方分析后发送该事件
# 填挖方分析使用方法
<template>
<mapgis-web-scene
libPath="cesium/Cesium.js"
pluginPath="cesium/webclient-cesium-plugin.min.js"
v-on:load="handleLoad"
>
<mapgis-3d-ogc-wmts-layer
:baseUrl="url"
:wmtsLayer="layer"
:tileMatrixSet="tileMatrixSet"
:format="format"
:tilingScheme="tilingScheme"
:token="token"
></mapgis-3d-ogc-wmts-layer>
<mapgis-3d-terrain-provider :url="terrainUrl" :v-if="showTerrain"></mapgis-3d-terrain-provider>
<mapgis-3d-cut-fill></mapgis-3d-cut-fill>
</mapgis-web-scene>
</template>
<script>
export default {
data() {
return {
url: "http://t0.tianditu.gov.cn/img_c/wmts",
terrainUrl: '',
tileMatrixSet: "c",
tilingScheme: "EPSG:4326",
layer:"img",
format: "tiles",
token:{
key: "tk",
value: "9c157e9585486c02edf817d2ecbc7752"
},
showTerrain: false
};
},
methods: {
handleLoad(e) {
const { component, Cesium } = e;
Cesium.Ion.defaultAccessToken =
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJiM2Q0ZGMxYy1iZGZkLTQ4OWItODlhMy1iOWNkMDE0M2U3YWEiLCJpZCI6NTEzNSwiaWF0IjoxNjA2MjE0OTkyfQ.2aktNrUASlLsPwSFtkgKBTQLJTAnOTyjgKDRQmnafiE';
const { webGlobe } = component;
webGlobe.viewer.camera.setView({
direction: { x: 0.4680575394156845, y: -0.8267033643312148, z: 0.31222377744109403 },
position: { x: -674271.5790185562, y: 5530042.656916835, z: 3232882.3357299212 }
});
//构造视图功能管理对象(视图)
var sceneManager = new CesiumZondy.Manager.SceneManager({
viewer: webGlobe.viewer
});
//视点跳转(经度,纬度,视角高度,方位角,俯仰角,翻滚角)
sceneManager.flyToEx(94.73761648879076, 29.44177452960854, {
height: 5900,
heading: 60,
pitch: -16,
roll: 0
});
this.terrainUrl = new Cesium.IonResource.fromAssetId(1);
this.showTerrain = true;
}
}
};
</script>
# 自定义界面-插槽方式
<template>
<mapgis-web-scene
libPath="cesium/Cesium.js"
pluginPath="cesium/webclient-cesium-plugin.min.js"
>
<mapgis-3d-ogc-wmts-layer
:baseUrl="url"
:wmtsLayer="layer"
:tileMatrixSet="tileMatrixSet"
:format="format"
:tilingScheme="tilingScheme"
:token="token"
></mapgis-3d-ogc-wmts-layer>
<mapgis-3d-terrain-provider :url="terrainUrl" :v-if="showTerrain"></mapgis-3d-terrain-provider>
<mapgis-3d-cut-fill
@loaded="loaded"
>
<div>
<button @click="startAnalyse">开始分析</button>
<button @click="stopAnalyse">结束分析</button>
</div>
</mapgis-3d-cut-fill>
</mapgis-web-scene>
</template>
<script>
export default {
data() {
return {
url: "http://t0.tianditu.gov.cn/img_c/wmts",
terrainUrl: '',
tileMatrixSet: "c",
tilingScheme: "EPSG:4326",
layer:"img",
format: "tiles",
token:{
key: "tk",
value: "9c157e9585486c02edf817d2ecbc7752"
},
showTerrain: false,
analyse: undefined
};
},
methods: {
loaded(analyse){
this.analyse = analyse;
},
startAnalyse(){
//这里可自己指定分析类型、高度以及分析精度,如果不指定,则取prop中传入的,最后取默认值
this.analyse.startAnalyse("cut",100,16,16);
},
stopAnalyse(){
this.analyse.stopAnalyse();
},
handleLoad(e) {
const { component, Cesium } = e;
Cesium.Ion.defaultAccessToken =
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJiM2Q0ZGMxYy1iZGZkLTQ4OWItODlhMy1iOWNkMDE0M2U3YWEiLCJpZCI6NTEzNSwiaWF0IjoxNjA2MjE0OTkyfQ.2aktNrUASlLsPwSFtkgKBTQLJTAnOTyjgKDRQmnafiE';
const { webGlobe } = component;
webGlobe.viewer.camera.setView({
direction: { x: 0.4680575394156845, y: -0.8267033643312148, z: 0.31222377744109403 },
position: { x: -674271.5790185562, y: 5530042.656916835, z: 3232882.3357299212 }
});
//构造视图功能管理对象(视图)
var sceneManager = new CesiumZondy.Manager.SceneManager({
viewer: webGlobe.viewer
});
//视点跳转(经度,纬度,视角高度,方位角,俯仰角,翻滚角)
sceneManager.flyToEx(94.73761648879076, 29.44177452960854, {
height: 5900,
heading: 60,
pitch: -16,
roll: 0
});
this.terrainUrl = new Cesium.IonResource.fromAssetId(1);
this.showTerrain = true;
}
}
};
</script>