Skip to content

蒋波涛 / super_mapboxgl_vue

Go to a project
Toggle navigation
Toggle navigation pinning
5989e6e5 by unknown
Options

20191215

1 parent 115e7f99
Inline Side-by-side
Showing 2 changed files with 37 additions and 18 deletions
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
2 * @Author: jiangbotao 2 * @Author: jiangbotao
3 * @Date: 2019-12-09 23:17:48 3 * @Date: 2019-12-09 23:17:48
4 * @LastEditors: jiangbotao 4 * @LastEditors: jiangbotao
5 * @LastEditTime: 2019-12-15 18:51:41 5 * @LastEditTime: 2019-12-15 23:19:53
6 * @FilePath: \mymapbox\src\components\Map3857.vue 6 * @FilePath: \mymapbox\src\components\Map3857.vue
7 --> 7 -->
8 <template> 8 <template>
...@@ -90,8 +90,8 @@ export default { ...@@ -90,8 +90,8 @@ export default {
90 ] 90 ]
91 }, 91 },
92 'circle-color': { 92 'circle-color': {
93 property:'SMID', 93 'property':'SMID',
94 stops: [ 94 'stops': [
95 [min,'#6879FB'], 95 [min,'#6879FB'],
96 [min + 1/3*range,'#68FB75'], 96 [min + 1/3*range,'#68FB75'],
97 [min + 2/3*range, '#F94B18'], 97 [min + 2/3*range, '#F94B18'],
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
2 * @Author: jiangbotao 2 * @Author: jiangbotao
3 * @Date: 2019-12-10 22:15:53 3 * @Date: 2019-12-10 22:15:53
4 * @LastEditors: jiangbotao 4 * @LastEditors: jiangbotao
5 * @LastEditTime: 2019-12-15 21:21:43 5 * @LastEditTime: 2019-12-15 22:59:50
6 * @FilePath: \supermapvue\src\components\vt\Map_wz.vue 6 * @FilePath: \supermapvue\src\components\vt\Map_wz.vue
7 --> 7 -->
8 <template> 8 <template>
...@@ -44,12 +44,11 @@ export default { ...@@ -44,12 +44,11 @@ export default {
44 var dataUrl = 'http://127.0.0.1:8090/iserver/services/data-China/rest/data/'; 44 var dataUrl = 'http://127.0.0.1:8090/iserver/services/data-China/rest/data/';
45 var sqlParam = new SuperMap.GetFeaturesBySQLParameters({ 45 var sqlParam = new SuperMap.GetFeaturesBySQLParameters({
46 queryParameter: { 46 queryParameter: {
47 name: "poi", 47 name: "point2",
48 attributeFilter: "SMID > 0", 48 attributeFilter: "SMID > 0",
49 }, 49 },
50 datasetNames: ["China:poi"], 50 datasetNames: ["China:point2"],
51 targetEpsgCode:4326, 51 maxFeatures: 1000,
52 maxFeatures: 1500,
53 toIndex: -1 52 toIndex: -1
54 }); 53 });
55 var featureService = new mapboxgl.supermap.FeatureService(dataUrl); 54 var featureService = new mapboxgl.supermap.FeatureService(dataUrl);
...@@ -69,22 +68,42 @@ export default { ...@@ -69,22 +68,42 @@ export default {
69 "type": "circle", 68 "type": "circle",
70 "source": "queryDatas", 69 "source": "queryDatas",
71 "paint": { 70 "paint": {
72 'circle-radius': 2, 71 'circle-radius': 4,
73 'circle-color': '#6879FB', 72 'circle-color': [
74 // property:'value', 73 'match',
75 // stops: [ 74 ['get', 'TYPE'],
76 // [min,'#6879FB'], 75 'A',
77 // [min + 1/3*range,'#68FB75'], 76 '#fbb03b',
78 // [min + 2/3*range, '#F94B18'], 77 'B',
79 // [max, '#F92918'] 78 '#223b53',
80 // ] 79 'C',
81 // }, 80 '#e55e5e',
81 'D',
82 '#3bb2d0',
83 /* other */ '#ccc'
84 ],
82 'circle-opacity': 1.0, 85 'circle-opacity': 1.0,
83 "circle-stroke-width": 2, 86 "circle-stroke-width": 2,
84 "circle-stroke-color": "#007cbf", 87 "circle-stroke-color": "#007cbf",
85 "circle-stroke-opacity": 0.7 88 "circle-stroke-opacity": 0.7
86 } 89 }
87 }); 90 });
91 var popup = new mapboxgl.Popup({
92 anchor: 'bottom',
93 closeButton: false,
94 offset: {
95 'bottom': [0, -20],
96 }
97 });
98 __this.map.on('mousemove', "queryDatasLayer", function (e) {
99 popup.setLngLat(e.lngLat).setHTML(e.features[0].properties.NAME+':'+ e.features[0].properties.VALUE).addTo(__this.map);
100 __this.map.getCanvas().style.cursor = 'pointer';
101
102 });
103 __this.map.on('mouseout', "queryDatasLayer", function () {
104 __this.map.getCanvas().style.cursor = '';
105 popup.remove();
106 })
88 }); 107 });
89 }); 108 });
90 } 109 }
......