2018-08-0108:33:19作者:danielinbiti
前言
本来想写echarts初始化函数的,但最近因为要写一个地图与柱状图的混合方式,也就是每个省的地图上要有柱状图显示。于是仔细使用了一下地图。
1、地图的一些基本属性就不介绍了,还是那些style
2、地图数据的获取以及Series的加载和其他没有什么大的差异。地图数据都在map.js中,都可以自己看,也可以自己根据格式获取响应的数据。
这里主要想处理的是图例颜色与地图底图颜色怎么设置的问题。
1、图例的颜色代码
{name:'iphone3',type:'map',mapType:'china',selectedMode:'single',roam:true,showLegendSymbol:true,itemStyle:{normal:{label:{show:true},areaStyle:{color:'green'}//设置地图背景色的颜色设置,color:'rgba(255,0,255,0.8)'//刚才说的图例颜色设置},emphasis:{label:{show:true}}},data:[{name:'北京',value:Math.round(Math.random()*1000)},{name:'天津',value:Math.round(Math.random()*1000)},{name:'上海',value:Math.round(Math.random()*1000)}]}3、这么设置有问题吗?我设置了一下发现有问题。图例颜色是对了,但是地图背景色不对,变成和第一个设置color的坐标系颜色一致了
于是查看地图源码(map.js)发现有这么一行代码
4、然后再想怎么解决。
看图例的颜色设置机制,实际上和坐标系的什么图形,什么类型都没关系,只要是坐标系的格式就行。那是不是可以欺骗一下。
在series中,设置成这样
{name:'iphone3',//addbydanielinbiti,注意这里名称必须和坐标系的名称要一致type:'',//设置为'',所有图形都不会读取itemStyle:{normal:{color:'rgba(255,0,255,0.8)'}},mapType:'none',data:[]},{name:'iphone3',type:'map',mapType:'china',selectedMode:'single',roam:true,showLegendSymbol:true,itemStyle:{normal:{label:{show:true},areaStyle:{color:'green'}},emphasis:{label:{show:true}}},data:[{name:'北京',value:Math.round(Math.random()*1000)},{name:'天津',value:Math.round(Math.random()*1000)},{name:'上海',value:Math.round(Math.random()*1000)}]}总结:
或许没有发现其他隐形设置,但根据map中的代码,似乎也没有其他途径。希望echarts能够修正一下这个问题。把or的时候顺序换一下就行了。举手之劳。