Skip to content

Commit 6306b16

Browse files
liqian7liqian7
committed
【范例】 新增 webmap-vue 范例 review by zhurc
1 parent 15ef7f3 commit 6306b16

File tree

4 files changed

+104
-9
lines changed

4 files changed

+104
-9
lines changed

‎examples/locales/en-US/resources.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -522,7 +522,7 @@ window.examplesResources = {
522522
"title_ChinaEarthquakeHeat": 'China Earthquake',
523523
"title_ChinaEarthquakeHeatWGS84": 'China Earthquake WGS84',
524524
"title_ChinaEarthquakeHeatClient": 'China Earthquake(Classic) WGS84',
525-
525+
"title_webMap_Vue": 'WebMap(Vue)',
526526

527527
"text_code": "Forward Match",
528528
"text_decode": "Reverse Match",

‎examples/locales/zh-CN/resources.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -470,7 +470,8 @@ window.examplesResources = {
470470
"title_ChinaEarthquakeHeat": '中国地震数据',
471471
"title_ChinaEarthquakeHeatWGS84": '中国地震数据_WGS84',
472472
"title_ChinaEarthquakeHeatClient": '中国地震数据（Classic）_WGS84',
473-
473+
"title_webMap_Vue": 'WebMap(Vue)',
474+
474475
"text_code": "正向匹配",
475476
"text_decode": "反向匹配",
476477
"text_address": "地址　　　",

‎examples/mapboxgl/config.js‎

Lines changed: 18 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -292,44 +292,44 @@ var exampleConfig = {
292292
"iPortal": {
293293
name: "iPortal",
294294
name_en: "iPortal",
295-
version: "9.1.1",
295+
version: "10.x.x",
296296
content: {
297297
"ip_map": {
298298
name: "地图",
299299
name_en: "iPortal Web map",
300-
version: "9.1.1",
300+
version: "10.x.x",
301301
content: [{
302302
name: "分段专题图",
303303
name_en: "Range",
304-
version: "9.1.1",
304+
version: "10.x.x",
305305
thumbnail: "iPortalWebmap_range.png",
306306
fileName: "iPortalWebmap_range"
307307
},
308308
{
309309
name: "单值专题图",
310310
name_en: "Unique",
311-
version: "9.1.1",
311+
version: "10.x.x",
312312
thumbnail: "iPortalWebmap_unique.png",
313313
fileName: "iPortalWebmap_unique"
314314
},
315315
{
316316
name: "标签专题图",
317317
name_en: "Label",
318-
version: "9.1.1",
318+
version: "10.x.x",
319319
thumbnail: "iPortalWebmap_label.png",
320320
fileName: "iPortalWebmap_label"
321321
},
322322
{
323323
name: "热力图",
324324
name_en: "Heat map",
325-
version: "9.1.1",
325+
version: "10.x.x",
326326
thumbnail: "iPortalWebmap_heat.png",
327327
fileName: "iPortalWebmap_heat"
328328
},
329329
{
330330
name: "点样式",
331331
name_en: "Point style",
332-
version: "9.1.1",
332+
version: "10.x.x",
333333
thumbnail: "iPortalWebmap_unicode.png",
334334
fileName: "iPortalWebmap_unicode"
335335
}]
@@ -1062,6 +1062,17 @@ var exampleConfig = {
10621062
fileName: "widgets_chart_iptl"
10631063
}
10641064
]
1065+
},
1066+
"widgetsAdvanced": {
1067+
name: "扩展",
1068+
name_en: "Advanced",
1069+
content: [{
1070+
name: "WebMap(Vue)",
1071+
name_en: "WebMap(Vue)",
1072+
version: "10.X.X",
1073+
thumbnail: "iPortalWebmap_unique.png",
1074+
fileName: "iportalWebMap_vue"
1075+
}]
10651076
}
10661077
}
10671078
},

‎examples/mapboxgl/iportalWebMap_vue.html‎

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
<!--********************************************************************
2+
* Copyright© 2000 - 2018 SuperMap Software Co.Ltd. All rights reserved.
3+
*********************************************************************-->
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<meta charset="UTF-8">
8+
<title data-i18n="resources.title_webMap_Vue"></title>
9+
<script type="text/javascript" include="vue" src="../js/include-web.js"></script>
10+
<script type="text/javascript" include='mapbox-gl-enhance' src="../../dist/mapboxgl/include-mapboxgl.js"></script>
11+
</head>
12+
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
13+
<div id='app' style="margin:0 auto;width: 100%;height: 100%">
14+
<div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
15+
<webmap server-id='1649097980' :web-map-options="webMapOptions" @add-layers-succeed="addLayersSucceeded"></webmap>
16+
</div>
17+
<script>
18+
19+
var webMapComponent = {
20+
props: {
21+
serverId: {
22+
type: String,
23+
required: true
24+
},
25+
webMapOptions: {
26+
type: Object
27+
}
28+
},
29+
template: `<div v-if="!webMapOptions.target" id="map"></div>`,
30+
mounted() {
31+
var webmap = this.initializeWebMap();
32+
this.webmap = webmap;
33+
this.registerEvents(webmap);
34+
},
35+
methods: {
36+
initializeWebMap() {
37+
var webmap = new mapboxgl.supermap.WebMap(this.serverId, this.webMapOptions);
38+
return webmap;
39+
},
40+
registerEvents(webmap) {
41+
var _this = this;
42+
webmap.on("getmapfailed", function (e) {
43+
_this.$emit("get-map-failed", e);
44+
});
45+
webmap.on("getwmtsfailed", function (e) {
46+
_this.$emit("get-wmts-failed", e);
47+
});
48+
webmap.on("getlayersfailed", function (e) {
49+
_this.$emit("get-layers-failed", e);
50+
});
51+
webmap.on("getfeaturesfailed", function (e) {
52+
_this.$emit("get-features-failed", e);
53+
});
54+
webmap.on("addlayerssucceeded", function (e) {
55+
_this.$emit("add-layers-succeed", e);
56+
});
57+
},
58+
beforeDestroy() {
59+
this.webmap = null;
60+
}
61+
}
62+
}
63+
64+
Vue.component('webmap', webMapComponent);
65+
66+
new Vue({
67+
el: '#app',
68+
data: {
69+
webMapOptions: {
70+
target: 'map',
71+
server: 'http://support.supermap.com.cn:8092'
72+
},
73+
},
74+
methods: {
75+
addLayersSucceeded(e) {
76+
return e.layers;
77+
}
78+
}
79+
});
80+
</script>
81+
</body>
82+
83+
</html>

0 commit comments

Comments
 (0)