Skip to content

蒋波涛 / super_globe_vue

Go to a project
Toggle navigation
Toggle navigation pinning
a707c407 by chiangbt
Options

20191207

1 parent 4b3e59ec
Inline Side-by-side
Showing 9 changed files with 465 additions and 69 deletions
...@@ -28,6 +28,8 @@ SuperGlobeVue是基于vue-cli3和supermap cesium 的一款Globe地球视图。 ...@@ -28,6 +28,8 @@ SuperGlobeVue是基于vue-cli3和supermap cesium 的一款Globe地球视图。
28 - viewer_ming.vue 多个栅格图层面的动画效果 28 - viewer_ming.vue 多个栅格图层面的动画效果
29 - viewer_changeview.vue 地图视图效果，在10000米以上不能改变角度，10000米以下能够改动视角 29 - viewer_changeview.vue 地图视图效果，在10000米以上不能改变角度，10000米以下能够改动视角
30 - viewer_3dmodel.vue 展示矢量数据白模 30 - viewer_3dmodel.vue 展示矢量数据白模
31 - viewer_underground.vue 地底开挖效果，实际上是改变某个SCP图层的局部透明度
32 - viewer_split.vue 地图分屏
31 33
32 ## 2、设置 34 ## 2、设置
33 ### 项目依赖库安装 35 ### 项目依赖库安装
......
...@@ -6315,7 +6315,8 @@ ...@@ -6315,7 +6315,8 @@
6315 "ansi-regex": { 6315 "ansi-regex": {
6316 "version": "2.1.1", 6316 "version": "2.1.1",
6317 "bundled": true, 6317 "bundled": true,
6318 "dev": true 6318 "dev": true,
6319 "optional": true
6319 }, 6320 },
6320 "aproba": { 6321 "aproba": {
6321 "version": "1.2.0", 6322 "version": "1.2.0",
...@@ -6336,12 +6337,14 @@ ...@@ -6336,12 +6337,14 @@
6336 "balanced-match": { 6337 "balanced-match": {
6337 "version": "1.0.0", 6338 "version": "1.0.0",
6338 "bundled": true, 6339 "bundled": true,
6339 "dev": true 6340 "dev": true,
6341 "optional": true
6340 }, 6342 },
6341 "brace-expansion": { 6343 "brace-expansion": {
6342 "version": "1.1.11", 6344 "version": "1.1.11",
6343 "bundled": true, 6345 "bundled": true,
6344 "dev": true, 6346 "dev": true,
6347 "optional": true,
6345 "requires": { 6348 "requires": {
6346 "balanced-match": "^1.0.0", 6349 "balanced-match": "^1.0.0",
6347 "concat-map": "0.0.1" 6350 "concat-map": "0.0.1"
...@@ -6356,17 +6359,20 @@ ...@@ -6356,17 +6359,20 @@
6356 "code-point-at": { 6359 "code-point-at": {
6357 "version": "1.1.0", 6360 "version": "1.1.0",
6358 "bundled": true, 6361 "bundled": true,
6359 "dev": true 6362 "dev": true,
6363 "optional": true
6360 }, 6364 },
6361 "concat-map": { 6365 "concat-map": {
6362 "version": "0.0.1", 6366 "version": "0.0.1",
6363 "bundled": true, 6367 "bundled": true,
6364 "dev": true 6368 "dev": true,
6369 "optional": true
6365 }, 6370 },
6366 "console-control-strings": { 6371 "console-control-strings": {
6367 "version": "1.1.0", 6372 "version": "1.1.0",
6368 "bundled": true, 6373 "bundled": true,
6369 "dev": true 6374 "dev": true,
6375 "optional": true
6370 }, 6376 },
6371 "core-util-is": { 6377 "core-util-is": {
6372 "version": "1.0.2", 6378 "version": "1.0.2",
...@@ -6483,7 +6489,8 @@ ...@@ -6483,7 +6489,8 @@
6483 "inherits": { 6489 "inherits": {
6484 "version": "2.0.3", 6490 "version": "2.0.3",
6485 "bundled": true, 6491 "bundled": true,
6486 "dev": true 6492 "dev": true,
6493 "optional": true
6487 }, 6494 },
6488 "ini": { 6495 "ini": {
6489 "version": "1.3.5", 6496 "version": "1.3.5",
...@@ -6495,6 +6502,7 @@ ...@@ -6495,6 +6502,7 @@
6495 "version": "1.0.0", 6502 "version": "1.0.0",
6496 "bundled": true, 6503 "bundled": true,
6497 "dev": true, 6504 "dev": true,
6505 "optional": true,
6498 "requires": { 6506 "requires": {
6499 "number-is-nan": "^1.0.0" 6507 "number-is-nan": "^1.0.0"
6500 } 6508 }
...@@ -6509,6 +6517,7 @@ ...@@ -6509,6 +6517,7 @@
6509 "version": "3.0.4", 6517 "version": "3.0.4",
6510 "bundled": true, 6518 "bundled": true,
6511 "dev": true, 6519 "dev": true,
6520 "optional": true,
6512 "requires": { 6521 "requires": {
6513 "brace-expansion": "^1.1.7" 6522 "brace-expansion": "^1.1.7"
6514 } 6523 }
...@@ -6516,12 +6525,14 @@ ...@@ -6516,12 +6525,14 @@
6516 "minimist": { 6525 "minimist": {
6517 "version": "0.0.8", 6526 "version": "0.0.8",
6518 "bundled": true, 6527 "bundled": true,
6519 "dev": true 6528 "dev": true,
6529 "optional": true
6520 }, 6530 },
6521 "minipass": { 6531 "minipass": {
6522 "version": "2.3.5", 6532 "version": "2.3.5",
6523 "bundled": true, 6533 "bundled": true,
6524 "dev": true, 6534 "dev": true,
6535 "optional": true,
6525 "requires": { 6536 "requires": {
6526 "safe-buffer": "^5.1.2", 6537 "safe-buffer": "^5.1.2",
6527 "yallist": "^3.0.0" 6538 "yallist": "^3.0.0"
...@@ -6540,6 +6551,7 @@ ...@@ -6540,6 +6551,7 @@
6540 "version": "0.5.1", 6551 "version": "0.5.1",
6541 "bundled": true, 6552 "bundled": true,
6542 "dev": true, 6553 "dev": true,
6554 "optional": true,
6543 "requires": { 6555 "requires": {
6544 "minimist": "0.0.8" 6556 "minimist": "0.0.8"
6545 } 6557 }
...@@ -6620,7 +6632,8 @@ ...@@ -6620,7 +6632,8 @@
6620 "number-is-nan": { 6632 "number-is-nan": {
6621 "version": "1.0.1", 6633 "version": "1.0.1",
6622 "bundled": true, 6634 "bundled": true,
6623 "dev": true 6635 "dev": true,
6636 "optional": true
6624 }, 6637 },
6625 "object-assign": { 6638 "object-assign": {
6626 "version": "4.1.1", 6639 "version": "4.1.1",
...@@ -6632,6 +6645,7 @@ ...@@ -6632,6 +6645,7 @@
6632 "version": "1.4.0", 6645 "version": "1.4.0",
6633 "bundled": true, 6646 "bundled": true,
6634 "dev": true, 6647 "dev": true,
6648 "optional": true,
6635 "requires": { 6649 "requires": {
6636 "wrappy": "1" 6650 "wrappy": "1"
6637 } 6651 }
...@@ -6717,7 +6731,8 @@ ...@@ -6717,7 +6731,8 @@
6717 "safe-buffer": { 6731 "safe-buffer": {
6718 "version": "5.1.2", 6732 "version": "5.1.2",
6719 "bundled": true, 6733 "bundled": true,
6720 "dev": true 6734 "dev": true,
6735 "optional": true
6721 }, 6736 },
6722 "safer-buffer": { 6737 "safer-buffer": {
6723 "version": "2.1.2", 6738 "version": "2.1.2",
...@@ -6753,6 +6768,7 @@ ...@@ -6753,6 +6768,7 @@
6753 "version": "1.0.2", 6768 "version": "1.0.2",
6754 "bundled": true, 6769 "bundled": true,
6755 "dev": true, 6770 "dev": true,
6771 "optional": true,
6756 "requires": { 6772 "requires": {
6757 "code-point-at": "^1.0.0", 6773 "code-point-at": "^1.0.0",
6758 "is-fullwidth-code-point": "^1.0.0", 6774 "is-fullwidth-code-point": "^1.0.0",
...@@ -6772,6 +6788,7 @@ ...@@ -6772,6 +6788,7 @@
6772 "version": "3.0.1", 6788 "version": "3.0.1",
6773 "bundled": true, 6789 "bundled": true,
6774 "dev": true, 6790 "dev": true,
6791 "optional": true,
6775 "requires": { 6792 "requires": {
6776 "ansi-regex": "^2.0.0" 6793 "ansi-regex": "^2.0.0"
6777 } 6794 }
...@@ -6815,12 +6832,14 @@ ...@@ -6815,12 +6832,14 @@
6815 "wrappy": { 6832 "wrappy": {
6816 "version": "1.0.2", 6833 "version": "1.0.2",
6817 "bundled": true, 6834 "bundled": true,
6818 "dev": true 6835 "dev": true,
6836 "optional": true
6819 }, 6837 },
6820 "yallist": { 6838 "yallist": {
6821 "version": "3.0.3", 6839 "version": "3.0.3",
6822 "bundled": true, 6840 "bundled": true,
6823 "dev": true 6841 "dev": true,
6842 "optional": true
6824 } 6843 }
6825 } 6844 }
6826 }, 6845 },
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
22 <script src="./js/spectrum.js"></script> 22 <script src="./js/spectrum.js"></script>
23 <link href="./css/pretty.css" rel="stylesheet"> 23 <link href="./css/pretty.css" rel="stylesheet">
24 <script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script> 24 <script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script>
25 <title>superglobevue</title> 25 <title>超图三维地图Demo</title>
26 <style type="text/css"> 26 <style type="text/css">
27 [v-cloak] { 27 [v-cloak] {
28 display: none; 28 display: none;
......
1 <!--
2 * 1、地图分屏效果
3 * @Author: jiangbotao
4 * @Date: 2019-12-03 22:52:56
5 * @LastEditors: jiangbotao
6 * @LastEditTime: 2019-12-04 22:23:44
7 * @FilePath: \superglobevue\src\components\viewer.vue
8 -->
9 <template>
10 <div>
11 <div id="cesiumContainer" v-bind:style="styleObject"></div>
12 <div id='loadingbar' class="spinner">
13 <div class="spinner-container container1">
14 <div class="circle1"></div>
15 <div class="circle2"></div>
16 <div class="circle3"></div>
17 <div class="circle4"></div>
18 </div>
19 <div class="spinner-container container2">
20 <div class="circle1"></div>
21 <div class="circle2"></div>
22 <div class="circle3"></div>
23 <div class="circle4"></div>
24 </div>
25 <div class="spinner-container container3">
26 <div class="circle1"></div>
27 <div class="circle2"></div>
28 <div class="circle3"></div>
29 <div class="circle4"></div>
30 </div>
31 </div>
32 <div id="toolbar" class="param-container tool-bar">
33 <div>
34 <button id="search" >查询</button>
35 </div>
36 </div>
37 </div>
38 </template>
39
40 <script>
41 import URL_CONFIG from "./../config/urlConfig.vue";
42 const Cesium = window.Cesium;
43 export default {
44 data: function() {
45 return {
46 styleObject: {
47 width: "100%",
48 position: "absolute",
49 top: "0px",
50 bottom: "0px",
51 left: "0px",
52 backgroundColor: "#000000"
53 },
54 smviewer: {}
55 };
56 },
57 mounted: function() {
58 var __this = this;
59 __this.viewer = new Cesium.Viewer('cesiumContainer', { animation: true });
60 var scene = __this.viewer.scene;
61 var widget = __this.viewer.cesiumWidget;
62 // 隐藏logo
63 $(".cesium-widget-credits")[0].style.visibility = "hidden";
64 // 隐藏导航工具
65 // $(".cesium-viewer-navigationContainer")[0].style.visibility="hidden";
66
67 // 添加OSM地图
68 let osm = Cesium.createOpenStreetMapImageryProvider({
69 url: "https://tile-a.openstreetmap.fr/hot",
70 fileExtension:"png"
71 });
72 __this.viewer.imageryLayers.addImageryProvider(osm);
73
74 try {
75 var groundPromise = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND1, {
76 name: 'ground'
77 });
78 var buildPromise = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_BUILD, {
79 name: 'build'
80 });
81 Cesium.when([groundPromise, buildPromise], function(layers) {
82 scene.camera.setView({
83 destination : Cesium.Cartesian3.fromDegrees(116.4566, 39.9149, 5323.445971240632),
84 orientation : {
85 heading : 3.1612,
86 pitch : -1.5188,
87 roll : 6.283185307179563
88 }
89 });
90 var positions = null;
91 // 绘制面
92 var handlerPolygon = new Cesium.DrawHandler(__this.viewer, Cesium.DrawMode.Polygon, 0);
93 handlerPolygon.drawEvt.addEventListener(function(polygon){
94 console.log(polygon.object.positions);
95 return polygon.object.positions;
96 });
97 $("#search").on("click", function(){
98 handlerPolygon.activeEvt.addEventListener(function(isActive){
99 if(isActive === true){
100 __this.viewer.enableCursorStyle = false;
101 __this.viewer._element.style.cursor = '';
102 $('body').removeClass('drawCur').addClass('drawCur');
103 }else{
104 __this.viewer.enableCursorStyle = true;
105 $('body').removeClass('drawCur');
106 }
107 });
108 handlerPolygon && handlerPolygon.deactivate();
109 handlerPolygon && handlerPolygon.activate();
110 });
111 }, function() {
112 var title = '加载SCP失败，请检查网络连接状态或者url地址是否正确？';
113 widget.showErrorPanel(title, undefined, e);
114 });
115 } catch (e) {
116 if (widget._showRenderLoopErrors) {
117 var title = '渲染时发生错误，已停止渲染。';
118 widget.showErrorPanel(title, undefined, e);
119 }
120 }
121
122 $("#loadingbar").remove();
123 }
124 };
125 </script>
126
127 <style>
128 .sm-compass {
129 pointer-events: auto;
130 position: absolute;
131 right: 10px;
132 top: 10px;
133 width: 128px;
134 height: 128px;
135 overflow: hidden;
136 }
137 .sm-zoom {
138 top: 130px;
139 }
140 .drawCur{
141 cursor: url(/images/cur/draw.cur), auto;
142 }
143 </style>
1 <!--
2 * 1、地图分屏效果
3 * @Author: jiangbotao
4 * @Date: 2019-12-03 22:52:56
5 * @LastEditors: jiangbotao
6 * @LastEditTime: 2019-12-04 22:23:44
7 * @FilePath: \superglobevue\src\components\viewer.vue
8 -->
9 <template>
10 <div>
11 <div id="cesiumContainer" v-bind:style="styleObject"></div>
12 <div id='loadingbar' class="spinner">
13 <div class="spinner-container container1">
14 <div class="circle1"></div>
15 <div class="circle2"></div>
16 <div class="circle3"></div>
17 <div class="circle4"></div>
18 </div>
19 <div class="spinner-container container2">
20 <div class="circle1"></div>
21 <div class="circle2"></div>
22 <div class="circle3"></div>
23 <div class="circle4"></div>
24 </div>
25 <div class="spinner-container container3">
26 <div class="circle1"></div>
27 <div class="circle2"></div>
28 <div class="circle3"></div>
29 <div class="circle4"></div>
30 </div>
31 </div>
32 <div id="toolbar" class="param-container tool-bar">
33 <div>
34 <button id="one" >无分屏</button>
35 <button id="two" >水平分屏</button>
36 </div>
37 </div>
38 <div id="split_up" style="display: none;"></div>
39 <div id="split_bottom" style="display: none;"></div>
40 <div id="split_left" style="display: none;"></div>
41 <div id="split_right" style="display: none;"></div>
42 <div id="split_vertical_trisection_left" style="display: none;"></div>
43 <div id="split_vertical_trisection_right" style="display: none;"></div>
44 </div>
45 </template>
46
47 <script>
48 import URL_CONFIG from "./../config/urlConfig.vue";
49 const Cesium = window.Cesium;
50 export default {
51 data: function() {
52 return {
53 styleObject: {
54 width: "100%",
55 position: "absolute",
56 top: "0px",
57 bottom: "0px",
58 left: "0px",
59 backgroundColor: "#000000"
60 },
61 smviewer: {}
62 };
63 },
64 mounted: function() {
65 this.viewer = new Cesium.Viewer("cesiumContainer", {});
66 // 隐藏logo
67 $(".cesium-widget-credits")[0].style.visibility = "hidden";
68 // 隐藏导航工具
69 // $(".cesium-viewer-navigationContainer")[0].style.visibility="hidden";
70
71 // 添加OSM地图
72 let osm = Cesium.createOpenStreetMapImageryProvider({
73 url: "https://tile-a.openstreetmap.fr/hot",
74 fileExtension:"png"
75 });
76 this.viewer.imageryLayers.addImageryProvider(osm);
77
78 var scene = this.viewer.scene;
79 var widget = this.viewer.cesiumWidget;
80 try {
81 var groundPromise = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND1, {
82 name: 'ground'
83 });
84 var ground2Promise = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND2, {
85 name: 'ground2'
86 });
87 var buildPromise = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_BUILD, {
88 name: 'build'
89 });
90 // 添加倾斜摄影模型图层
91 Cesium.when([groundPromise, ground2Promise, buildPromise], function(layers) {
92 var build = scene.layers.find("build");
93 var ground = scene.layers.find("ground");
94 var ground2 = scene.layers.find("ground2");
95 // 图层加载完成,设置相机位置
96 scene.camera.setView({
97 destination: Cesium.Cartesian3.fromDegrees(116.4563, 39.8969, 553),
98 orientation: {
99 heading: 5.901089214916513,
100 pitch: -0.40668579780875524,
101 roll: 6.281842456812987
102 }
103 });
104 $("#one").on("click", function(){
105 $("#split_up").css("display", "none");
106 $("#split_bottom").css("display", "none");
107 $("#split_left").css("display", "none");
108 $("#split_right").css("display", "none");
109 $("#split_vertical_trisection_left").css("display", "none");
110 $("#split_vertical_trisection_right").css("display", "none");
111 $('#pannel').hide();
112 scene.multiViewportMode = Cesium.MultiViewportMode["NONE"];
113 });
114 $("#two").on("click", function(){
115 $("#split_up").css("display", "block");
116 $("#split_bottom").css("display", "block");
117 $("#split_left").css("display", "none");
118 $("#split_right").css("display", "none");
119 $("#split_vertical_trisection_left").css("display", "none");
120 $("#split_vertical_trisection_right").css("display", "none");
121 $('#pannel').show();
122 $('#b_one,#b_two,#g_one,#g_two').show();
123 $('#b_three,#g_three,#b_four,#g_four').hide();
124 // ground2.setVisibleInViewport(1, false);
125 scene.multiViewportMode = Cesium.MultiViewportMode["HORIZONTAL"];
126 });
127 }, function() {
128 var title = '加载SCP失败，请检查网络连接状态或者url地址是否正确？';
129 widget.showErrorPanel(title, undefined, e);
130 });
131 } catch (e) {
132 if (widget._showRenderLoopErrors) {
133 var title = '渲染时发生错误，已停止渲染。';
134 widget.showErrorPanel(title, undefined, e);
135 }
136 }
137
138 $("#loadingbar").remove();
139 }
140 };
141 </script>
142
143 <style>
144 .sm-compass {
145 pointer-events: auto;
146 position: absolute;
147 right: 10px;
148 top: 10px;
149 width: 128px;
150 height: 128px;
151 overflow: hidden;
152 }
153 .sm-zoom {
154 top: 130px;
155 }
156 label {
157 display: inline-block;
158 margin-right: 1rem;
159 }
160
161 label>input,
162 label>span {
163 display: inline-block;
164 vertical-align: middle;
165 }
166
167 #split_up {
168 position: absolute;
169 background-color: white;
170 left: 50%;
171 bottom: 50%;
172 width: 2px;
173 height: 50%;
174 -webkit-transform: translate(-50%, 0);
175 }
176
177 #split_bottom {
178 position: absolute;
179 background-color: white;
180 left: 50%;
181 top: 50%;
182 width: 2px;
183 height: 50%;
184 -webkit-transform: translate(-50%, 0);
185 }
186
187 #split_left {
188 position: absolute;
189 background-color: white;
190 right: 50%;
191 bottom: 50%;
192 height: 2px;
193 width: 50%;
194 -webkit-transform: translate(0, -50%);
195 }
196
197 #split_right {
198 position: absolute;
199 background-color: white;
200 left: 50%;
201 bottom: 50%;
202 height: 2px;
203 width: 50%;
204 -webkit-transform: translate(0, -50%);
205 }
206 #split_vertical_trisection_left {
207 position: absolute;
208 background-color: white;
209 left: 33.33%;
210 top: 0;
211 height: 100%;
212 width: 2px;
213 }
214 #split_vertical_trisection_right {
215 position: absolute;
216 background-color: white;
217 right: 33.33%;
218 top: 0;
219 height: 100%;
220 width: 2px;
221 }
222 </style>
1 <!-- 1 <!--
2 * 矢量数据白模 2 * 地下管网挖掘及查看
3 * @Author: jiangbotao 3 * @Author: jiangbotao
4 * @Date: 2019-12-07 14:24:01 4 * @Date: 2019-12-07 14:24:01
5 * @LastEditors: jiangbotao 5 * @LastEditors: jiangbotao
...@@ -32,7 +32,8 @@ ...@@ -32,7 +32,8 @@
32 <div id="toolbar" class="param-container tool-bar"> 32 <div id="toolbar" class="param-container tool-bar">
33 <div> 33 <div>
34 <label style="color:#FFFFFF ">图层开挖:</label> 34 <label style="color:#FFFFFF ">图层开挖:</label>
35 <button id="excavation" >进行倾斜开挖</button> 35 <button id="excavation" >绘制挖掘面</button>
36 <button id="dig" >进行倾斜开挖</button>
36 </div> 37 </div>
37 </div> 38 </div>
38 </div> 39 </div>
...@@ -52,13 +53,14 @@ export default { ...@@ -52,13 +53,14 @@ export default {
52 left: '0px', 53 left: '0px',
53 backgroundColor: '#000000' 54 backgroundColor: '#000000'
54 }, 55 },
55 smviewer:{} 56 viewer:{}
56 } 57 }
57 }, 58 },
58 mounted: function(){ 59 mounted: function(){
59 this.smviewer=new Cesium.Viewer('cesiumContainer', { animation: true }); 60 var __this = this;
60 var scene = this.smviewer.scene; 61 __this.viewer = new Cesium.Viewer('cesiumContainer', { animation: true });
61 var widget = this.smviewer.cesiumWidget; 62 var scene = __this.viewer.scene;
63 var widget = __this.viewer.cesiumWidget;
62 var globe = scene.globe; 64 var globe = scene.globe;
63 // 隐藏logo 65 // 隐藏logo
64 $(".cesium-widget-credits")[0].style.visibility="hidden"; 66 $(".cesium-widget-credits")[0].style.visibility="hidden";
...@@ -66,9 +68,9 @@ export default { ...@@ -66,9 +68,9 @@ export default {
66 // 隐藏导航工具 68 // 隐藏导航工具
67 // $(".cesium-viewer-navigationContainer")[0].style.visibility="hidden"; 69 // $(".cesium-viewer-navigationContainer")[0].style.visibility="hidden";
68 70
69 this.smviewer.scene.undergroundMode = true; //设置开启地下场景 71 __this.viewer.scene.undergroundMode = true; //设置开启地下场景
70 this.smviewer.scene.screenSpaceCameraController.minimumZoomDistance = -500;//设置相机最小缩放距离,距离地表-1000米 72 __this.viewer.scene.screenSpaceCameraController.minimumZoomDistance = -500;//设置相机最小缩放距离,距离地表-1000米
71 this.smviewer.scene.terrainProvider.isCreateSkirt = false; // 关闭裙边 73 __this.viewer.scene.terrainProvider.isCreateSkirt = false; // 关闭裙边
72 74
73 var overGroundLayer = null; 75 var overGroundLayer = null;
74 try{ 76 try{
...@@ -86,6 +88,49 @@ export default { ...@@ -86,6 +88,49 @@ export default {
86 roll : 6.283185307176403 88 roll : 6.283185307176403
87 } 89 }
88 }); 90 });
91 var positions = null;
92 // 绘制面
93 var handlerPolygon = new Cesium.DrawHandler(__this.viewer, Cesium.DrawMode.Polygon, 0);
94 handlerPolygon.drawEvt.addEventListener(function(polygon){
95 var array = [].concat(polygon.object.positions);
96 positions = [];
97 for(var i = 0, len = array.length; i < len; i++){
98 var cartographic = Cesium.Cartographic.fromCartesian(array[i]);
99 var longitude = Cesium.Math.toDegrees(cartographic.longitude);
100 var latitude = Cesium.Math.toDegrees(cartographic.latitude);
101 var h=cartographic.height;
102 if(positions.indexOf(longitude)===-1&&positions.indexOf(latitude)===-1){
103 positions.push(longitude);
104 positions.push(latitude);
105 positions.push(h);
106 }
107 }
108 console.log(positions);
109 return positions;
110 });
111 $("#excavation").on("click", function(){
112 handlerPolygon.activeEvt.addEventListener(function(isActive){
113 if(isActive === true){
114 __this.viewer.enableCursorStyle = false;
115 __this.viewer._element.style.cursor = '';
116 $('body').removeClass('drawCur').addClass('drawCur');
117 }else{
118 __this.viewer.enableCursorStyle = true;
119 $('body').removeClass('drawCur');
120 }
121 });
122 handlerPolygon && handlerPolygon.deactivate();
123 handlerPolygon && handlerPolygon.activate();
124 });
125 $("#dig").on("click", function(){
126 //设置倾斜开挖参数
127 overGroundLayer.addExcavationRegion({
128 position : positions,
129 name : 'excavation_' + Math.random()
130 });
131 handlerPolygon.deactivate();
132 handlerPolygon && handlerPolygon.clear();
133 });
89 }, function(e){ 134 }, function(e){
90 if(widget._showRenderLoopErrors) { 135 if(widget._showRenderLoopErrors) {
91 var title = '加载SCP失败，请检查网络连接状态或者url地址是否正确？'; 136 var title = '加载SCP失败，请检查网络连接状态或者url地址是否正确？';
...@@ -98,39 +143,6 @@ export default { ...@@ -98,39 +143,6 @@ export default {
98 widget.showErrorPanel(title, undefined, e); 143 widget.showErrorPanel(title, undefined, e);
99 } 144 }
100 } 145 }
101
102 var positions = null;
103 // 绘制面
104 var handlerPolygon = new Cesium.DrawHandler(this.smviewer, Cesium.DrawMode.Polygon);
105 handlerPolygon.drawEvt.addEventListener(function(polygon){
106 var array = [].concat(polygon.object.positions);
107 positions = [];
108 for(var i = 0, len = array.length; i < len; i++){
109 var cartographic = Cesium.Cartographic.fromCartesian(array[i]);
110 var longitude = Cesium.Math.toDegrees(cartographic.longitude);
111 var latitude = Cesium.Math.toDegrees(cartographic.latitude);
112 var h=cartographic.height;
113 if(positions.indexOf(longitude)===-1&&positions.indexOf(latitude)===-1){
114 positions.push(longitude);
115 positions.push(latitude);
116 positions.push(h);
117 }
118 }
119 console.log(positions);
120 return positions;
121 });
122
123
124 $("#excavation").on("click", function(){
125 handlerPolygon && handlerPolygon.deactivate();
126 handlerPolygon && handlerPolygon.activate();
127 //设置倾斜开挖参数
128 overGroundLayer.addExcavationRegion({
129 position : positions,
130 name : 'excavation_' + Math.random()
131 });
132 handlerPolygon.deactivate();
133 });
134 146
135 $('#loadingbar').remove(); 147 $('#loadingbar').remove();
136 } 148 }
...@@ -138,6 +150,9 @@ export default { ...@@ -138,6 +150,9 @@ export default {
138 </script> 150 </script>
139 151
140 <style> 152 <style>
153 .drawCur{
154 cursor: url(/images/cur/draw.cur), auto;
155 }
141 .sm-compass { 156 .sm-compass {
142 pointer-events: auto; 157 pointer-events: auto;
143 position: absolute; 158 position: absolute;
......
...@@ -31,6 +31,10 @@ const SCENE_WZ_QD = 'http://localhost:8090/iserver/services/3D-wz_qidu_qx/rest/r ...@@ -31,6 +31,10 @@ const SCENE_WZ_QD = 'http://localhost:8090/iserver/services/3D-wz_qidu_qx/rest/r
31 const SCP_SRSB_WATER = "http://www.supermapol.com/realspace/services/3D-srsb/rest/realspace/datas/%E6%B0%B4%E9%9D%A2@vector/config"; 31 const SCP_SRSB_WATER = "http://www.supermapol.com/realspace/services/3D-srsb/rest/realspace/datas/%E6%B0%B4%E9%9D%A2@vector/config";
32 const SCENE_XGPARK = "http://www.supermapol.com/realspace/services/3D-yanmofenxi/rest/realspace"; 32 const SCENE_XGPARK = "http://www.supermapol.com/realspace/services/3D-yanmofenxi/rest/realspace";
33 const GZ_SCENE = 'http://www.supermapol.com/realspace/services/3D-GuangZhou/rest/realspace'; 33 const GZ_SCENE = 'http://www.supermapol.com/realspace/services/3D-GuangZhou/rest/realspace';
34 const SCENE_CBD = 'http://www.supermapol.com/realspace/services/3D-CBD/rest/realspace';
35 const SCP_CBD_GROUND1 = 'http://www.supermapol.com/realspace/services/3D-WebGLCBD/rest/realspace/datas/Ground_1@%E6%96%B0CBD/config';//CBD 地面1 SCP
36 const SCP_CBD_GROUND2 = 'http://www.supermapol.com/realspace/services/3D-WebGLCBD/rest/realspace/datas/Ground_2@%E6%96%B0CBD/config';//CBD 地面2 SCP
37 const SCP_CBD_BUILD = 'http://www.supermapol.com/realspace/services/3D-WebGLCBD/rest/realspace/datas/Building@%E6%96%B0CBD/config';//CBD 建筑物 SCP
34 export default 38 export default
35 { 39 {
36 TDT_IMG, 40 TDT_IMG,
...@@ -56,6 +60,9 @@ export default ...@@ -56,6 +60,9 @@ export default
56 SCENE_SY, 60 SCENE_SY,
57 TOKEN_TIANDITU, 61 TOKEN_TIANDITU,
58 SCENE_XGPARK, 62 SCENE_XGPARK,
59 GZ_SCENE 63 GZ_SCENE,
64 SCP_CBD_GROUND1,
65 SCP_CBD_GROUND2,
66 SCP_CBD_BUILD
60 }; 67 };
61 </script> 68 </script>
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
11 </template> 11 </template>
12 12
13 <script> 13 <script>
14 import viewer from "@/components/viewer_underground.vue"; 14 import viewer from "@/components/viewer_spatialquery.vue";
15 15
16 export default { 16 export default {
17 name: "home", 17 name: "home",
......
...@@ -16,17 +16,5 @@ module.exports = { ...@@ -16,17 +16,5 @@ module.exports = {
16 port:7000, 16 port:7000,
17 hot: true, 17 hot: true,
18 openPage: 'index.html' 18 openPage: 'index.html'
19 }, 19 }
20 css: {
21 loaderOptions: {
22 less: {
23 modifyVars: {
24 'primary-color': '#1DA57A',
25 'link-color': '#1DA57A',
26 'border-radius-base': '2px',
27 },
28 javascriptEnabled: true
29 }
30 }
31 }
32 } 20 }
...\ No newline at end of file ...\ No newline at end of file
......