我想在某些事件中更新数据时在Highmap中添加一些动画。在下面的代码段中,我已经设置了一个演示。
我尝试了chart.redraw()
,但地图上仍然没有动画。
chart = Highcharts.mapChart('map', {
chart: {
map: 'countries/in/custom/in-all-disputed'
},
title: {
text: false
},
exporting: {
enabled: false
},
subtitle: {
text: false
},
mapNavigation: {
enabled: true,
buttonOptions: {
verticalAlign: 'bottom'
}
},
credits: {
enabled: false
},
colorAxis: {
min: 0
},
series: [{
animation: true,
data: [
['in-or', 489],
['in-jh', 973]
],
name: 'Household',
states: {
hover: {
color: '#3C3F4B'
}
},
dataLabels: {
enabled: false,
format: '{point.name}'
}
}]
});
$("#update").on('click', function(){
chart.series[0].update({name:'new title'});
chart.series[0].setData([
['in-or', 1200],
['in-jh', 1200]
]);
})
#map{
height:500px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/maps/highmaps.js"></script>
<script src="https://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="https://code.highcharts.com/mapdata/countries/in/custom/in-all-disputed.js"></script>
<button id="update"> UPDATE </button>
<div id="map">