1. 怎么让Highcharts的提示框tooltip自动轮播?
个人Highcharts的颜值感觉比ECharts高那么一点点，比如3D饼图、3D环形图就很酷炫，ECharts就没有或者说做出来效果很一般。
但是，如果是公司的项目的话，先问问你们老板愿不愿意花钱购买授权，Highcharts对于个人网站，学校网站和非盈利机构免费，其他都是要收费的。之前做公司的项目，UI设计了个酷炫的3D饼图，用Highcharts做完才发现是收费的。。。
如果是个人网站或者公司购买了授权，那可以放心使用。那怎么让tooltip自动轮播呢？可以利用tooltip.refresh方法、给chart.events加上load事件来实现。
2. 代码怎么写呢？
我们直接上代码：
<div id="container" style="height: 400px"></div> <script src="https://code.highcharts.com.cn/highcharts/highcharts.js"></script> <script src="https://code.highcharts.com.cn/highcharts/highcharts-3d.js"></script> <script type="text/javascript"> var timer = null; var chart = Highcharts.chart('container', { chart: { type: 'pie', options3d: { enabled: true, alpha: 45, beta: 0 }, events: { // load，图表加载完成时触发 load: function () { var chart = this; var points = chart.series[0].points; var len = points.length; var i = 0; timer && clearInterval(timer); timer = setInterval(function () { autoTooltip(points[i]); i++; if (i === len) { i = 0; } }, 1000); } } }, title: { text: null }, tooltip: { pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' }, plotOptions: { pie: { allowPointSelect: true, cursor: 'pointer', depth: 35, dataLabels: { enabled: true, format: '{point.name}' } } }, series: [{ type: 'pie', name: '浏览器占比', data: [ ['Firefox', 45.0], ['IE', 26.8], { name: 'Chrome', y: 12.8, sliced: true, selected: true }, ['Safari', 8.5], ['Opera', 6.2], ['Others', 0.7] ] }] }); function autoTooltip(point) { chart.tooltip.refresh(point); } </script> <script src="https://code.highcharts.com.cn/highcharts/highcharts.js"></script> <script src="https://code.highcharts.com.cn/highcharts/highcharts-3d.js"></script> <script type="text/javascript"> var timer = null; var chart = Highcharts.chart('container', { chart: { type: 'pie', options3d: { enabled: true, alpha: 45, beta: 0 }, events: { // load，图表加载完成时触发 load: function () { var chart = this; var points = chart.series[0].points; var len = points.length; var i = 0; timer && clearInterval(timer); timer = setInterval(function () { autoTooltip(points[i]); i++; if (i === len) { i = 0; } }, 1000); } } }, title: { text: null }, tooltip: { pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' }, plotOptions: { pie: { allowPointSelect: true, cursor: 'pointer', depth: 35, dataLabels: { enabled: true, format: '{point.name}' } } }, series: [{ type: 'pie', name: '浏览器占比', data: [ ['Firefox', 45.0], ['IE', 26.8], { name: 'Chrome', y: 12.8, sliced: true, selected: true }, ['Safari', 8.5], ['Opera', 6.2], ['Others', 0.7] ] }] }); function autoTooltip(point) { chart.tooltip.refresh(point); } </script>tooltip.refresh(points, e)是在论坛里面看到有人提到源码里面有这个方法，但是官方文档里面并没有提到，不知道是出于什么样的考虑。
3. 示例代码下载
可以复制以上代码运行查看使用效果，也可以到GitHub: https://github.com/Jackyyans/code123下载，更多示例将会持续更新，欢迎关注。