根据项目需求,echarts地图点位图标要是动图,且可以设置不同图标,经过多方查找,找到解决方案,可以用svg使gif动起来
let myChartChina = echarts.init(document.getElementById("myChartChina"), "transparent", {
renderer: "svg"
});
其中transparent是地图背景色,可设置其他颜色
也可以设置多个不同图标
series: [
{
name: "数据",
type: "map",
mapType: "chinaJson",
roam: false, //可缩放、拖动
zoom: 1.2, //视觉比例大小,1.2即为原有大小的1.2倍
// aspectScale: 0.8, // 拉伸地图 值为0-1
label: {
normal: {
show: false //省份名称
},
emphasis: {
show: true,
color: "#fff"
}
},
itemStyle: {
normal: {
areaColor: "#272235",
borderColor: "#043C6A",
fontWeightL: 700,
borderWidth: 1
}
},
emphasis: {
show: true,
itemStyle: {
areaColor: "#457efa" // 鼠标hover省份颜色
}
},
data: regionsData //数据
},
{
type: "scatter", //类型:散点
coordinateSystem: "geo", //使用地理坐标系
geoIndex: 0,
symbol: "image://" + img1,
symbolSize: 40, //散点大小
encode: {
tooltip: 2
},
data: yiji,
zlevel: 1
},
{
type: "scatter", //类型:散点
coordinateSystem: "geo", //使用地理坐标系
geoIndex: 0,
symbol: "image://" + img2,
symbolSize: 40, //散点大小
encode: {
tooltip: 2
},
data: erji,
zlevel: 1
},
{
type: "scatter", //类型:散点
coordinateSystem: "geo", //使用地理坐标系
geoIndex: 0,
symbol: "image://" + img3,
symbolSize: 40, //散点大小
encode: {
tooltip: 2
},
data: sanji,
zlevel: 1
}
]