|
@@ -2,48 +2,95 @@
|
|
|
<!-- 暂时隐藏工具栏 -->
|
|
|
<!-- <div v-show="ToolBarShow"> -->
|
|
|
<div v-if="true">
|
|
|
-
|
|
|
<!-- <div class="resourceTree" @click="choose(0)"></div> -->
|
|
|
<div class="toolBar">
|
|
|
- <el-cascader size="mini" :show-all-levels="false" :options="xzqTreeData" placeholder="行政区"
|
|
|
- :props="{ checkStrictly: true, expandTrigger: 'hover' }" clearable v-model="xzqTreeValue"></el-cascader>
|
|
|
+ <el-cascader
|
|
|
+ size="mini"
|
|
|
+ :show-all-levels="false"
|
|
|
+ :options="xzqTreeData"
|
|
|
+ placeholder="行政区"
|
|
|
+ :props="{ checkStrictly: true, expandTrigger: 'hover' }"
|
|
|
+ clearable
|
|
|
+ v-model="xzqTreeValue"
|
|
|
+ ></el-cascader>
|
|
|
<el-select size="mini" v-model="Skybox" placeholder="天空盒">
|
|
|
- <el-option v-for="item in SkyboxList" :key="item.value" :label="item.label" :value="item.value">
|
|
|
+ <el-option
|
|
|
+ v-for="item in SkyboxList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.Resource" @click="choose(0)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.Resource"
|
|
|
+ @click="choose(0)"
|
|
|
+ >
|
|
|
<span class="iconfont icontuceng"></span>
|
|
|
</li>
|
|
|
|
|
|
<!-- <ul v-if="show"> -->
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.PoinyQuery" @click="choose(9)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.PoinyQuery"
|
|
|
+ @click="choose(9)"
|
|
|
+ >
|
|
|
<i class="el-icon-thumb"></i>
|
|
|
</li>
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.PlacenameLocation" @click="choose(10)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.PlacenameLocation"
|
|
|
+ @click="choose(10)"
|
|
|
+ >
|
|
|
<i class="el-icon-place"></i>
|
|
|
</li>
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.BookMark" @click="choose(11)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.BookMark"
|
|
|
+ @click="choose(11)"
|
|
|
+ >
|
|
|
<i class="el-icon-notebook-2"></i>
|
|
|
</li>
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.measure" @click="choose(7)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.measure"
|
|
|
+ @click="choose(7)"
|
|
|
+ >
|
|
|
<span class="iconfont iconliangsuan"></span>
|
|
|
</li>
|
|
|
<!-- <li class="sm-btn sm-tool-btn" :title="Resource.clip" @click="choose(4)">
|
|
|
<span class="iconfont iconiEarth-R8-xiugai_caijian"></span>
|
|
|
</li> -->
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.terrain" @click="choose(5)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.terrain"
|
|
|
+ @click="choose(5)"
|
|
|
+ >
|
|
|
<span class="iconfont icondixing"></span>
|
|
|
</li>
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.onlineEditing" @click="choose(8)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.onlineEditing"
|
|
|
+ @click="choose(8)"
|
|
|
+ >
|
|
|
<span class="iconfont iconzaixianbianji"></span>
|
|
|
</li>
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.analysis" @click="choose(6)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.analysis"
|
|
|
+ @click="choose(6)"
|
|
|
+ >
|
|
|
<span class="iconfont iconsanweifenxi"></span>
|
|
|
</li>
|
|
|
<!-- <li class="sm-btn sm-tool-btn" :title="Resource.fly" @click="choose(12)">
|
|
|
<i class="el-icon-guide"></i>
|
|
|
</li> -->
|
|
|
- <li class="sm-btn sm-tool-btn" :title="Resource.sceneOptions" @click="choose(3)">
|
|
|
+ <li
|
|
|
+ class="sm-btn sm-tool-btn"
|
|
|
+ :title="Resource.sceneOptions"
|
|
|
+ @click="choose(3)"
|
|
|
+ >
|
|
|
<i class="el-icon-setting"></i>
|
|
|
</li>
|
|
|
<!-- <li class="sm-btn sm-tool-btn" title="行政区划开关" @click="choose(12)">
|
|
@@ -53,11 +100,23 @@
|
|
|
<li class="sm-btn sm-tool-btn" title="模型拉伸" @click="choose(13)">
|
|
|
<i class="el-icon-receiving"></i>
|
|
|
</li>
|
|
|
- <div style="display: none" class="sm-tool-btn" @click="toggleVisibility" :class="{ 'sm-tool-btn-only': !show }">
|
|
|
- <span class="iconfont" :class="!show
|
|
|
- ? 'iconiEarth-R8-xiugai_shouqi'
|
|
|
- : 'iconiEarth-R8-xiugai_zhankai'
|
|
|
- "></span>
|
|
|
+ <li class="sm-btn sm-tool-btn" title="倾斜模型" @click="choose(14)">
|
|
|
+ <i class="el-icon-office-building"></i>
|
|
|
+ </li>
|
|
|
+ <div
|
|
|
+ style="display: none"
|
|
|
+ class="sm-tool-btn"
|
|
|
+ @click="toggleVisibility"
|
|
|
+ :class="{ 'sm-tool-btn-only': !show }"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="iconfont"
|
|
|
+ :class="
|
|
|
+ !show
|
|
|
+ ? 'iconiEarth-R8-xiugai_shouqi'
|
|
|
+ : 'iconiEarth-R8-xiugai_zhankai'
|
|
|
+ "
|
|
|
+ ></span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 调用子组件-->
|
|
@@ -79,9 +138,14 @@
|
|
|
<air-lines-trail-lines></air-lines-trail-lines>
|
|
|
<scan-effect></scan-effect>
|
|
|
<wind-particle></wind-particle>
|
|
|
- <placename-location style="width: 400px; height: 400px; z-index: 999999"></placename-location>
|
|
|
- <click-query style="width: 400px; height: 700px; z-index: 999999"></click-query>
|
|
|
+ <placename-location
|
|
|
+ style="width: 400px; height: 400px; z-index: 999999"
|
|
|
+ ></placename-location>
|
|
|
+ <click-query
|
|
|
+ style="width: 400px; height: 700px; z-index: 999999"
|
|
|
+ ></click-query>
|
|
|
<modelStretch></modelStretch>
|
|
|
+ <tiltedModel></tiltedModel>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -91,8 +155,9 @@ import { GetXzqhTree, GetXzqhGeom } from "@/api/map";
|
|
|
import Bookmark from "../../Bookmark/Bookmark.vue";
|
|
|
import * as cockpit from "@/common/js/cockpit.js";
|
|
|
import modelStretch from "@/views/modelStretch/index.vue";
|
|
|
+import tiltedModel from "../../3DAnalysis/TiltedModel/index.vue";
|
|
|
export default {
|
|
|
- components: { clickQuery, Bookmark, modelStretch },
|
|
|
+ components: { clickQuery, Bookmark, modelStretch, tiltedModel },
|
|
|
name: "ToolBar",
|
|
|
props: {},
|
|
|
data() {
|
|
@@ -109,25 +174,32 @@ export default {
|
|
|
skyListener: null,
|
|
|
defaultSkyBox: null,
|
|
|
ViewerSkyBox: {},
|
|
|
- SkyboxList: [{
|
|
|
- value: 'lantian',
|
|
|
- label: '蓝天'
|
|
|
- }, {
|
|
|
- value: 'qingtian',
|
|
|
- label: '晴天'
|
|
|
- }, {
|
|
|
- value: 'wanxia',
|
|
|
- label: '晚霞'
|
|
|
- }, {
|
|
|
- value: 'cloudy',
|
|
|
- label: '多云'
|
|
|
- }, {
|
|
|
- value: 'partly_cloudy_puresky',
|
|
|
- label: '晴间多云'
|
|
|
- }, {
|
|
|
- value: 'yewan',
|
|
|
- label: '夜晚'
|
|
|
- }]
|
|
|
+ SkyboxList: [
|
|
|
+ {
|
|
|
+ value: "lantian",
|
|
|
+ label: "蓝天",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "qingtian",
|
|
|
+ label: "晴天",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "wanxia",
|
|
|
+ label: "晚霞",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "cloudy",
|
|
|
+ label: "多云",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "partly_cloudy_puresky",
|
|
|
+ label: "晴间多云",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "yewan",
|
|
|
+ label: "夜晚",
|
|
|
+ },
|
|
|
+ ],
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
@@ -144,14 +216,32 @@ export default {
|
|
|
for (let i = 0; i < this.SkyboxList.length; i++) {
|
|
|
let c = new Cesium.SkyBox({
|
|
|
sources: {
|
|
|
- positiveX: "/static/Cesium/Assets/Textures/SkyBox/" + this.SkyboxList[i].value + "/Right.jpg",
|
|
|
- negativeX: "/static/Cesium/Assets/Textures/SkyBox/" + this.SkyboxList[i].value + "/Left.jpg",
|
|
|
- positiveY: "/static/Cesium/Assets/Textures/SkyBox/" + this.SkyboxList[i].value + "/Front.jpg",
|
|
|
- negativeY: "/static/Cesium/Assets/Textures/SkyBox/" + this.SkyboxList[i].value + "/Back.jpg",
|
|
|
- positiveZ: "/static/Cesium/Assets/Textures/SkyBox/" + this.SkyboxList[i].value + "/Up.jpg",
|
|
|
- negativeZ: "/static/Cesium/Assets/Textures/SkyBox/" + this.SkyboxList[i].value + "/Down.jpg",
|
|
|
+ positiveX:
|
|
|
+ "/static/Cesium/Assets/Textures/SkyBox/" +
|
|
|
+ this.SkyboxList[i].value +
|
|
|
+ "/Right.jpg",
|
|
|
+ negativeX:
|
|
|
+ "/static/Cesium/Assets/Textures/SkyBox/" +
|
|
|
+ this.SkyboxList[i].value +
|
|
|
+ "/Left.jpg",
|
|
|
+ positiveY:
|
|
|
+ "/static/Cesium/Assets/Textures/SkyBox/" +
|
|
|
+ this.SkyboxList[i].value +
|
|
|
+ "/Front.jpg",
|
|
|
+ negativeY:
|
|
|
+ "/static/Cesium/Assets/Textures/SkyBox/" +
|
|
|
+ this.SkyboxList[i].value +
|
|
|
+ "/Back.jpg",
|
|
|
+ positiveZ:
|
|
|
+ "/static/Cesium/Assets/Textures/SkyBox/" +
|
|
|
+ this.SkyboxList[i].value +
|
|
|
+ "/Up.jpg",
|
|
|
+ negativeZ:
|
|
|
+ "/static/Cesium/Assets/Textures/SkyBox/" +
|
|
|
+ this.SkyboxList[i].value +
|
|
|
+ "/Down.jpg",
|
|
|
},
|
|
|
- })
|
|
|
+ });
|
|
|
c.WSpeed = 0.5;
|
|
|
this.ViewerSkyBox[this.SkyboxList[i].value] = c;
|
|
|
}
|
|
@@ -173,8 +263,12 @@ export default {
|
|
|
let skyBoxH1 = 15e4; // 天空开始渐变的最大高度
|
|
|
let skyBoxH2 = 12e4; // 天空开始渐变的最小高度
|
|
|
let bufferHeight = 1e4;
|
|
|
- if (cameraHeight < skyAtmosphereH1 && Cesium.defined(that.currentSkyBox)) {
|
|
|
- let skyAtmosphereT = (cameraHeight - skyBoxH2) / (skyAtmosphereH1 - skyBoxH2);
|
|
|
+ if (
|
|
|
+ cameraHeight < skyAtmosphereH1 &&
|
|
|
+ Cesium.defined(that.currentSkyBox)
|
|
|
+ ) {
|
|
|
+ let skyAtmosphereT =
|
|
|
+ (cameraHeight - skyBoxH2) / (skyAtmosphereH1 - skyBoxH2);
|
|
|
if (skyAtmosphereT > 1.0) {
|
|
|
skyAtmosphereT = 1.0;
|
|
|
} else if (skyAtmosphereT < 0.0) {
|
|
@@ -251,11 +345,10 @@ export default {
|
|
|
return item.label == "三亚市";
|
|
|
});
|
|
|
if (list.length > 0) {
|
|
|
- list[0].value = '4602'
|
|
|
+ list[0].value = "4602";
|
|
|
this.xzqTreeData = list[0];
|
|
|
- }
|
|
|
- else this.xzqTreeData = res.data;
|
|
|
- store.setRegionTree(this.xzqTreeData)
|
|
|
+ } else this.xzqTreeData = res.data;
|
|
|
+ store.setRegionTree(this.xzqTreeData);
|
|
|
}
|
|
|
});
|
|
|
},
|
|
@@ -291,7 +384,7 @@ export default {
|
|
|
},
|
|
|
Skybox() {
|
|
|
this.setSkyBox();
|
|
|
- }
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|