echarts地图样式整理
echarts地图样式整理
在车上在路上
这个作者很懒,什么都没留下…
展开
-
Echarts地图之——如何让地图显示出3d感
上面几个是常用的地图配置,其他的配置如label、itemstyle、emphasis(高亮)、select(选中)则和其他的图表类似可以看文档,根据需要来修改配置。然后我们给地图添加阴影的效果,与其说是阴影不如说是地图下的错位图层,多加了几层所形成的效果。这里我们通过geo给地图添加其他图层,geo和我们刚才说的series内的配置基本一样。这样我们在原有图层的基础上添加了几层阴影效果,这样就会有3d的感觉了。当我们把该option配置完成时就能看到一个基础的地图了。然后地图的基本配置我们也是知道通过。原创 2023-10-24 15:31:35 · 9876 阅读 · 3 评论 -
Echarts地图之——如何给地图添加背景图片
我们这里把背景加到了和原地图相同位置的底部(top,left,zoom等设置相同,geo的被上层覆盖),同时把原本的地图itemstyle背景设置为了transparent,这样做的目的是:保证原本的地图可以设置高亮、选中等的时候背景不会受到影响。因为如果给整张地图加一个背景是会有错位的情况的,所以这种做法不推荐,只是提供一种如何这么做的方式,而且我们这里的这张背景图片正好颜色比较相似就把边界的横线模糊掉了,没那么明显。是不是感觉并没有上面的红线错位的感觉,只能说我的这张地图颜色深边界感不明显。原创 2024-03-21 11:31:52 · 4582 阅读 · 5 评论 -
Echarts地图之——如何给省份名称添加背景图片背景色
这样就默认给了所有的省份设置了rich为a的样式,要设置的背景图就放到backgroundColor的image里面就行。如果我们需要根据后端返回数据给对应的省份设置rich为b的样式,则只需要对label的formatter重新设置即可。上次添加的背景是给整张地图添加的,如果想要给省份名称设置背景图,我们就要在label配置里面去添加设置。同样,如果要根据省份的数据来给省份添加背景色,则通过visualMap来设置。最后我们看到的配置了对应条件的省份就会是下面这样的。原创 2024-03-21 15:22:39 · 1531 阅读 · 0 评论 -
Echarts地图之——如何给地图添加外边框轮廓
这就需要我们把echarts registerMap的全国省份json和国界边框json的坐标相一致。但实际情况中,我们需要把国界的边框和各个省份属于国界的边框相吻合,否则就会造成两者看起来是错位的感觉。然后我们的地图展示用china命名,国界边框展示用chinaOutline命名即可。只要两个的位置,缩放大小一样,页面上就不会有错位的问题了。而且省份的边界正好处于边框的中心位置,看起来也很舒服。分别下载包含子区域和 不包含子区域的就可以了。在series内创建两个type为map的项。原创 2024-03-29 15:44:18 · 2282 阅读 · 1 评论