Highcharts 是一个用纯JavaScript编写的一个图表库， 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表，并且免费提供给个人学习、个人网站和非商业用途使用。HighCharts支持的图表类型有曲线图、区域图、柱状图、饼状图、散状点图和综合图表。
现有一个需求，用条形图的方式，同时显示数据和百分比
highcharts条形图中没有提供显示百分比的API，只有百分比堆叠柱状图和饼图可以显示，调用的接口是this.percentage，普通的柱状图和条形图想要显示百分比需要调用formatter格式化输出百分比。
$(function () { $('#container').highcharts({ chart: { type: 'bar' }, title: { text: '各洲不同时间的新生婴儿数量与本洲总人数占比条形图' }, xAxis: { categories: ['非洲', '美洲', '亚洲', '欧洲'], title: { text: null } }, yAxis: { min: 0, title: { text: '人口总量 (百万)', align: 'high' }, labels: { overflow: 'justify' } }, tooltip: { valueSuffix: ' 百万' }, plotOptions: { bar: { dataLabels: { enabled: true, //显示数量提示 color: '#000000', formatter : function() { a = this.y/this.total*100; //a为当前柱状图y轴值除以总数然后乘以100 return this.y+"百万<br/>"+a.toFixed(2) + "%"; //返回百分比和个数 } } } }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'top', x: -40, y: 100, floating: true, borderWidth: 1, backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'), shadow: true }, credits: { enabled: false }, series: [{ name: '1900 年', data: [ { y:20,total:100 }, { y:29,total:802 }, { y:10,total:900 }, { y:33,total:195 } ] },{ name: '2000 年', data: [ { y:56,total:300 }, { y:35,total:340 }, { y:48,total:900 }, { y:66,total:255 } ] }] }); });