效果图:
实现:
用的是map3D,之前试了下geo3d因为版本问题不好控制(地图上字体颜色都没法设置)
只需要在series的data中加上你要标色的区域名称和颜色即可。此效果实现的是无图例着色。
series: [
{
type: "map3D", // 系列类型
name: "map3D", // 系列名称
map: "yuhang", // 地图类型。
data: [
{ name: "鸬鸟镇", itemStyle: { color: "#fef436" } },
{ name: "仁和街道", itemStyle: { color: "#fc0d1b" } },
{ name: "余杭街道", itemStyle: { color: "#188dfb" } }
]
}
]
附官方api,路径:GL配置=>series=>type:map3D=>data
若想实现左侧图例标注的效果,可以尝试下data中的label属性。之前参考2d地图试了下在data中设value,然后在option中(也就是跟series平级)写如下代码,将start和end改成data中的value,再设颜色,这样是会有图例的。仅提供思路,若需要可自行尝试。
dataRange: {
splitList: [{ start: 1, end: 1, color: "#fef436" }]
}