多语言展示
当前在线:1990今日阅读:31今日分享:25

echarts2如何自定义地图添加任意区域信息呢?

项目里面使用了echarts2工具,这个工具很方便强大,但是官方又出来了echarts3,尝试升级到echarts3,发现项目里面原有的图表无法正常显示了,各种报错。暂时不能升级。那么产品里面碰到一个需求,有些客户的订单是海外的,需要在china地图的基础上添加海外地图区域。而且不需要具体坐标,只是一个类似‘海南诸岛’一样预览窗口。很久没得收益了,小编又来撸一篇技术类的经验+1,耶
工具/原料

echarts2

方法/步骤
1

我们先来欣赏一下echarts强大的功能,如何快捷的加载出china地图吧

2

把订单数据显示出来,如下

3

好了,需求来了,我们需要在china的基础上增加其它国家或地区的显示。charts2好像是不支持的,echarts3有介绍(可以自行搜索)。小编主要是针对echart2做讨论。

4

直接看效果,添加南、北韩、马来西亚后的效果

5

具体实现细节:思路:1、由于echarts2并不支持自定义添加区域,因此需要根据源码改写方法。2、分析地图的生成原理,其实china地图也是由很多个区域组成的,且每个区域都是有独立的地图数据包组成,其实都是一个json串。3、既然如此,我想到的就是动态的往默认的(china地图)json串里面,append其他区域的json串进去根据这个思路,尝试了一下加了接口(注入方法),果然有效。

推荐信息