eCharts二三维地图总结

文章版权由做者李晓晖和博客园共有，若转载请于明显处标明出处：http://www.cnblogs.com/naaoveGIS/

1.背景

最近多个项目中的登陆页面陆续提出了很多地图需求，主要围绕地图的立体感、交互等设计。业主爸爸，即便登陆页也要整出花样，但愿有眼前一亮的感受，好比：

 

搞GIS的同窗遇到地图问题，习惯性的就是引入地图引擎，可是仔细分析这类页面，它真的须要引入一个庞大的地图引擎来解决吗？

a.地图引擎太大，不利于登陆页加载效率。

b.该地图并不强调坐标系等等，也不强调地图的精细度，发挥不了地图引擎方案（加上配图）的优点。

c.以上交互不多，仅仅是打点、和图层选中交互。

d.通常的二维地图引擎实现不了以上地图倾斜立体的需求（即便实现，也比较麻烦，请查看《基于图片实现酷炫地图展现和交互的方案》http://www.javashuo.com/article/p-utlqgeai-gm.html），须要基于三维引擎。

针对这些问题，最近让ysj同窗分别对echarts和echarts-gl地图作了一下方案总结。针对SHP处理成geojson格式不作累述，这里主要记录一下总结和效果。

2.echarts地图

Echarts地图能够实现：

1. 自定义地图数据，可是须要为经纬度坐标系的geojson格式数据。
2. 可与echarts热力集成。
3. 能够经过设定symbol的type，实现打点，有交互事件。
4. 能够经过设定symbol的type，实现聚类圆饼，模拟聚类效果。
5. 能够经过设置双层地图的思想，分别对总体地图和各要素分别设置不一样的样式，实现地图总体轮廓边框和内部要素边框展现不一样样式的效果。
6. 能够经过增长阴影和偏移，实现立体的效果。

总体展现以下：

 

3.echarts-gl地图

用echarts二维地图模拟的立体效果并非真正的三维，也没法真正的倾斜，只是一种视觉效果而已。Echarts的三维地图中，其属性略有不一样，可是思路大同小异，这里直接给出最后总体效果：

 

 

　　

　　　　　　　　　　　　　　　　　　　　     -----欢迎转载，但保留版权，请于明显处标明出处：http://www.cnblogs.com/naaoveGIS/

                                                                       若是您以为本文确实帮助了您，能够微信扫一扫，进行小额的打赏和鼓励，谢谢 ^_^