echarts 4.0.5 版本上自动轮播 showTip ,不能正常显示
配置项如下
function chartCarousel(echarts, option) {
var app = {
currentIndex: -1
},
timer = null,
timerTime = null,
_ecData = option.series[0].data;
function start() {
clearInterval(timer);
var dataLen = _ecData.length;
timer = setInterval(function() {
// 取消之前高亮的图形
echarts.dispatchAction({
type: 'mapUnSelect',
seriesIndex: 0,
dataIndex: app.currentIndex
});
app.currentIndex = (app.currentIndex + 1) % dataLen;
// 高亮当前图形
echarts.dispatchAction({
type: 'mapSelect',
seriesIndex: 0,
dataIndex: app.currentIndex
});
// 显示 tooltip
echarts.dispatchAction({
type: 'hideTip',
seriesIndex: 0,
dataIndex: app.currentIndex - 1
});
echarts.dispatchAction({
type: 'showTip',
seriesIndex: 0,
dataIndex: app.currentIndex
});
}, 5000);
}
//停止
function stop() {
clearTimeout(timerTime);
clearInterval(timer);
}
//鼠标移上停止
echarts.on("mouseover", function() {
stop();
echarts.dispatchAction({
type: 'downplay',
seriesIndex: 0,
dataIndex: app.currentIndex
});
})
//鼠标移开启动
echarts.on("mouseout", function() {
//防止多次移入移出调用多次
clearTimeout(timerTime);
timerTime = setTimeout(function() {
start();
}, 1000)
})
// 返回
return {
currentIndex: app.currentIndex,
start: start
}
}
option = {
tooltip: {
trigger: 'item',
triggerOn:'none'
},
series: [{
map: '福建',
name: '福建省商务数据分析',
type: 'map',
zoom: 1.1,
aspectScale: 0.8, //参数用于 scale 地图的长宽比。
layoutCenter: ['55%', '46%'],
layoutSize: '80%',
label: {
normal: {
show: true,
fontSize: 16,
color: '#fff'
},
emphasis: {
show: false,
color: '#fff'
}
},
itemStyle: {
normal: {
borderColor: '#2eb4ff',
areaColor: 'rgba(1, 45, 117, 0.6)',
},
emphasis: {
areaColor: 'rgba(255, 203, 68, 1)',
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowBlur: 8,
shadowOffsetX: -8,
shadowOffsetY: 0
}
},
data: [{
name: '福州市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
}, {
name: '平潭综合试验区',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
},
{
name: '莆田市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
},
{
name: '泉州市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
},
{
name: '厦门市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
},
{
name: '漳州市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 1000), Math.round(Math.random() * 1000)]
},
{
name: '龙岩市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
}, {
name: '三明市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
},
{
name: '南平市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
},
{
name: '宁德市',
value: Math.round(Math.random() * 10000),
moneyData: [Math.round(Math.random() * 10000), Math.round(Math.random() * 1000), Math.round(Math.random() * 10000), Math.round(Math.random() * 1000)]
}
]
}]
}
var _chartCarousel = chartCarousel(myChart, option);
_chartCarousel.start();