Skip to content

Commit 124993d

Browse files
author
潘卓然Y7000P
committed
【站点】【新增】【补充Vue栅格以及WMTS的组件示例】
1 parent a94fc87 commit 124993d

5 files changed

Lines changed: 115 additions & 8 deletions

File tree

‎website/public/static/demo/cesium/example/vue/raster/raster.htm‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
6+
<title>Vue-地图瓦片</title>
7+
<script include="vue" exclude="plugin" src="./static/libs/include-cesium-local.js"></script>
8+
<style type="text/css">
9+
#app {
10+
height: 100vh;
11+
width: 100vw;
12+
}
13+
</style>
14+
</head>
15+
16+
<body>
17+
<div id="app">
18+
<cesium-web-globe
19+
v-bind:ref="webgloberef"
20+
v-bind:animation="false"
21+
v-bind:timeline="false"
22+
v-on:load="handleLoad"
23+
libPath="./static/libs/cdn/cesium/Cesium.js"
24+
pluginPath="./static/libs/cdn/cesium/webclient-cesium-plugin.js"
25+
>
26+
<cesium-raster-layer v-bind:url="url"> </cesium-raster-layer>
27+
</cesium-web-globe>
28+
</div>
29+
<script>
30+
let draw = new Vue({
31+
el: '#app',
32+
data() {
33+
return {
34+
webgloberef: 'webgloberef' + Math.random(),
35+
url: 'http://mt0.google.cn/vt/lyrs=m&hl=zh-CN&x={x}&y={y}&z={z}'
36+
};
37+
},
38+
methods: {
39+
handleLoad(e) {
40+
console.log('地图加初始化完毕！', e);
41+
}
42+
}
43+
});
44+
</script>
45+
</body>
46+
</html>

‎website/public/static/demo/cesium/example/vue/raster/wmts.htm‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
6+
<title>Vue-WMTS</title>
7+
<script include="vue" exclude="plugin" src="./static/libs/include-cesium-local.js"></script>
8+
<style type="text/css">
9+
#app {
10+
height: 100vh;
11+
width: 100vw;
12+
}
13+
</style>
14+
</head>
15+
16+
<body>
17+
<div id="app">
18+
<cesium-web-globe
19+
v-bind:ref="webgloberef"
20+
v-bind:animation="false"
21+
v-bind:timeline="false"
22+
v-on:load="handleLoad"
23+
libPath="./static/libs/cdn/cesium/Cesium.js"
24+
pluginPath="./static/libs/cdn/cesium/webclient-cesium-plugin.js"
25+
>
26+
<cesium-ogc-wmts-layer v-bind:url="url" v-bind:options="options"></cesium-ogc-wmts-layer>
27+
</cesium-web-globe>
28+
</div>
29+
<script>
30+
let draw = new Vue({
31+
el: '#app',
32+
data() {
33+
return {
34+
webgloberef: 'webgloberef' + Math.random(),
35+
url:
36+
'http://t0.tianditu.com/DataServer?T=vec_c' +
37+
'&L={TileMatrix}&Y={TileRow}&X={TileCol}' +
38+
'&tk=9c157e9585486c02edf817d2ecbc7752',
39+
options: {
40+
tilingScheme: 'EPSG:4490',
41+
tileMatrixLabels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10']
42+
}
43+
};
44+
},
45+
methods: {
46+
handleLoad(e) {
47+
console.log('地图加初始化完毕！', e);
48+
}
49+
}
50+
});
51+
</script>
52+
</body>
53+
</html>

‎website/public/static/demo/cesium/gallery/vue/raster/raster.png‎

258 KB
Loading

‎website/public/static/demo/cesium/gallery/vue/raster/wmts.png‎

189 KB
Loading

‎website/public/static/demo/config/config-cesium.json‎

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -224,14 +224,6 @@
224224
"detail": "加载MapGIS-IgServer上传的矢量瓦片样式",
225225
"icon": "mapgis-vectortile-4326.png",
226226
"update": "最后更新时间：2020-10-12"
227-
},
228-
{
229-
"name": "矢量瓦片-行业符号",
230-
"file": "mapgis-vectortile-symbol",
231-
"diffcult": "1",
232-
"detail": "加载MapGIS-IgServer上传的矢量瓦片样式",
233-
"icon": "mapgis-vectortile-symbol.png",
234-
"update": "最后更新时间：2020-10-12"
235227
}
236228
]
237229
},
@@ -1135,6 +1127,22 @@
11351127
"detail": "",
11361128
"icon": "tile.png",
11371129
"update": "最后更新时间：2020-11-23"
1130+
},
1131+
{
1132+
"name": "通用瓦片",
1133+
"file": "raster",
1134+
"diffcult": "2",
1135+
"detail": "",
1136+
"icon": "raster.png",
1137+
"update": "最后更新时间：2020-11-23"
1138+
},
1139+
{
1140+
"name": "WMTS瓦片",
1141+
"file": "wmts",
1142+
"diffcult": "2",
1143+
"detail": "",
1144+
"icon": "wmts.png",
1145+
"update": "最后更新时间：2020-11-23"
11381146
}
11391147
]
11401148
}

0 commit comments

Comments
 (0)