${name}

tooltip${count}

`; return res; }, }, itemStyle: { normal: { label: { show: true, color: '#fff', }, color: '#fff', borderColor: '#32CBE0', borderWidth: 1.5, areaColor: { type: 'linear-gradient', x: 0, y: 1000, x2: 0, y2: 0, colorStops: [ { offset: 0.5, color: '#0D59C1', // 0% 处的颜色 }, { offset: 1, color: '#53C9C7', // 100% 处的颜色 }, ], global: true, // 缺省为 false }, }, emphasis: { label: { show: true, color: '#fff', }, borderWidth: 3, borderColor: 'rgba(255, 230, 175,0.8)', shadowColor: 'rgba(255, 230, 175,0.5)', shadowBlur: 30, textStyle: { color: '#fff', fontSize: 12, backgroundColor: 'transparent', }, areaColor: new echarts.graphic.LinearGradient( 0, 0, 0, 1, [ { offset: 0, color: '#1cfbfe', }, { offset: 1, color: '#3348e7', }, ], false ), }, }, data: data, }, { type: 'effectScatter', coordinateSystem: 'geo', rippleEffect: { brushType: 'fill', }, label: { show: true, color: '#fff', formatter: function (obj) { return obj.name; }, }, symbolSize: function (val) { var value = val[2]; if (value < max) { return 15; } return 20; }, showEffectOn: 'render', //加载完毕显示特效 itemStyle: { normal: { color: '#FEBE13', // 圆点的颜色 shadowBlur: 10, shadowColor: '#333', }, }, zlevel: 6, data: pointData, }, { type: 'custom', coordinateSystem: 'geo', renderItem: function (params, api) { //具体实现自定义图标的方法 return { type: 'image', style: { image: uploadedDataURL, // 自定义的图片地址 x: api.coord([pointData[params.dataIndex].value[0], pointData[params.dataIndex].value[1]])[0] - 6, // 数据的设置 y: api.coord([pointData[params.dataIndex].value[0], pointData[params.dataIndex].value[1]])[1] - 34, }, }; }, zlevel: 10, data: pointData, }, ], }; var count = 0; var timer = null; var dataLength = option.series[0].data.length; timer && clearInterval(timer); timer = setInterval(() => { myChart.dispatchAction({ type: 'downplay', seriesIndex: 0, }); myChart.dispatchAction({ type: 'highlight', seriesIndex: 0, dataIndex: count % dataLength, }); myChart.dispatchAction({ type: 'showTip', seriesIndex: 0, dataIndex: count % dataLength, }); count++; }, 3000); myChart.on('mouseover', function (params) { clearInterval(timer); myChart.dispatchAction({ type: 'downplay', seriesIndex: 0, }); myChart.dispatchAction({ type: 'highlight', seriesIndex: 0, dataIndex: params.dataIndex, }); myChart.dispatchAction({ type: 'showTip', seriesIndex: 0, dataIndex: params.dataIndex, }); }); myChart.on('mouseout', function (params) { timer && clearInterval(timer); timer = setInterval(function () { myChart.dispatchAction({ type: 'downplay', seriesIndex: 0, }); myChart.dispatchAction({ type: 'highlight', seriesIndex: 0, dataIndex: count % dataLength, }); myChart.dispatchAction({ type: 'showTip', seriesIndex: 0, dataIndex: count % dataLength, }); count++; }, 3000); });

地图阴影,tooltip轮播,触摸不同颜色设置