ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

maptalks 开发GIS地图(6)maptalks 介绍

2021-04-30 10:05:25  阅读:424  来源: 互联网

标签:map GIS true maptalks 地图 marker var type


51.  geoJson to geometry

 1   var json = {
 2     'type': 'Feature',
 3     'geometry': {
 4       'type': 'Point',
 5       'coordinates': [-0.113049,51.498568]
 6     },
 7     'properties': {
 8       'name': 'point marker'
 9     }
10   };
11   var marker = maptalks.GeoJSON.toGeometry(json).addTo(map.getLayer('v'));

 

52. marker to geojson

1  var marker = new maptalks.Marker([-0.113049,51.498568], {
2     'properties': {
3       'name': 'point marker'
4     }
5   }).addTo(map.getLayer('v'));
6 
7   document.getElementById('info').innerHTML = JSON.stringify(marker.toGeoJSON());

 

53. map to json

1   var mapJSON = map.toJSON();
2 
3   document.getElementById('json').innerHTML = JSON.stringify(mapJSON);

 

54. map from json

 1 var mapJSON = {
 2     "version":"1.0",
 3     "options":{
 4       "center":{ "x":-0.113049,"y":51.49856800000001 },
 5       "zoom":13
 6     },
 7     "baseLayer":{
 8       "type":"TileLayer",
 9       "id":"base",
10       "options":{
11         "urlTemplate":"http://{s}.tile.osm.org/{z}/{x}/{y}.png",
12         "subdomains":["a","b","c"]
13       }
14     },
15     "layers":[
16       {
17         "type":"VectorLayer",
18         "id":"v",
19         "geometries":[
20           {
21             "feature":{
22               "type":"Feature",
23               "geometry":{
24                 "type":"Point",
25                 "coordinates":[-0.113049,51.498568]
26               }
27             }
28           }
29         ]
30       }
31     ]
32   };
33 
34   maptalks.Map.fromJSON('map', mapJSON);

 

55. echart3-bus

 1   var ecOption = {
 2                 'series': [ {
 3                     'type': 'lines',
 4                     'polyline': true,
 5                     'data': busLines,
 6                     'lineStyle': {
 7                         'normal': {
 8                             'width': 0
 9                         }
10                     },
11                     'effect': {
12                         'constantSpeed': 20,
13                         'show': true,
14                         'trailLength': 0.5,
15                         'symbolSize': 1.5
16                     },
17                     'zlevel': 1
18                 }]
19             };
20             var e3Layer = new maptalks.E3Layer('e3', ecOption, { hideOnZooming : true, hideOnRotating : true, hideOnMoving : true })
21             .addTo(map);

 

56.point-cluster

 1 var clusterLayer = new maptalks.ClusterLayer('cluster', markers, {
 2         'noClusterWithOneMarker' : false,
 3         'maxClusterZoom' : 18,
 4         //"count" is an internal variable: marker count in the cluster.
 5         'symbol': {
 6             'markerType' : 'ellipse',
 7             'markerFill' : { property:'count', type:'interval', stops: [[0, 'rgb(135, 196, 240)'], [9, '#1bbc9b'], [99, 'rgb(216, 115, 149)']] },
 8             'markerFillOpacity' : 0.7,
 9             'markerLineOpacity' : 1,
10             'markerLineWidth' : 3,
11             'markerLineColor' : '#fff',
12             'markerWidth' : { property:'count', type:'interval', stops: [[0, 40], [9, 60], [99, 80]] },
13             'markerHeight' : { property:'count', type:'interval', stops: [[0, 40], [9, 60], [99, 80]] }
14         },
15         'drawClusterText': true,
16         'geometryEvents' : true,
17         'single': true
18     });
19 
20     map.addLayer(clusterLayer);

 

57. fly-echart3

1 var e3Layer = new maptalks.E3Layer('e3', getECOption())
2     .addTo(map);

 

58.heatmap

1   var data = addressPoints.map(function (p) { return [p[1], p[0]]; });
2   var heatlayer = new maptalks.HeatLayer('heat', data, {
3     'heatValueScale': 0.7,
4     'forceRenderOnRotating' : true,
5     'forceRenderOnMoving' : true
6   }).addTo(map);

 

标签:map,GIS,true,maptalks,地图,marker,var,type
来源: https://www.cnblogs.com/googlegis/p/14720892.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有