今天用highcharts做饼图和柱状图,显示一些简单信息,发现柱状图做出来有点不尽人意,还是请教同事才将线去掉。
data里面的是后台数据,就不显示出来了,主要就是yAxis中的gridLineWidth赋0,想了半天,看来还是请教比较方便。。。。
var Chart = new Highcharts.Chart({ chart: { type: 'column', renderTo: renderTo, margin: [0, -20, -15, -20], backgroundColor: 'rgba(255, 255, 255, 0)' }, title1: { text: Year + '年 ' + Entity.CantonName + ' 保有量统计', style: { color: 'white' } }, yAxis: { gridLineWidth: 0 }, tooltip: { formatter: function () { return this.point.name + ': <br/>' + this.y + '<br/>所占比例: <br/>' + Highcharts.numberFormat(TotalQuantity == 0 ? 0 : this.y / TotalQuantity * 100, 2, '.') + '%'; } }, plotOptions: { column: { stacking: 'percent', dataLabels: { enabled: true, verticalAlign: "middle", y1: -2, style: { fontWeight: 'bold' , color: 'white' }, formatter: function () { if (this.y != null) { return this.y; } else { return ""; }; } } } }, series: [{ name: Entity.CantonName, data: data }] });
highcharts花出来的图还是比较好看的,用的也是比较多的。http://www.highcharts.com/里面比较全,像我这种英文不是很好的,只能靠翻译软件来查看了。