highcharts常遇问题总结_midas常遇问题总结

highcharts常遇问题总结由刀豆文库小编整理，希望给你工作、学习、生活带来方便，猜你可能喜欢“midas常遇问题总结”。

Highcharts常用问题总结

1，设置标题不显示：title:false

用法：

title: {

text: false

},2.时间格式的转换

用法：

xAxis: {

type: 'datetime',labels: {

formatter: function(){

return Highcharts.dateFormat('%Y-%b-%e %H:%M:%S', this.value);}

},具体时间格式结合API使用.3.y轴默认一个最大值，超过该最大值成倍增长：tickInterval:200

用法：

yAxis: {

title: {

text: 'Temperature(°C)'

},tickInterval:200

},4.饼形图中设置小数位数最多两位处理函数：Highcharts.numberFormat

用法：

plotOptions: {

pie: {

allowPointSelect: true,cursor: 'pointer',dataLabels: {

enabled: true,color: '#000000',connectorColor: '#000000',formatter: function(){

return ''+ this.point.name +':

Highcharts.numberFormat(this.percentage)+' %';

}

}'+

}

}，5.图像下面标签的位置：

legend: {

align: 'left',verticalAlign: 'top',y: 20,floating: true,borderWidth: 0

//该处是顶部靠左可根据自己的需求更改位置

},6.X轴或Y轴部分数据省略显示

xAxis: {

categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],labels: {

step: 3

}

//包括本身隔三个显示一个X轴坐标

},7.Y轴最左边显示一条实线：

yAxis: {

title: {

text: 'Temperature(°C)'

},lineWidth: 2(y轴显示实线，数字代表实现粗度)

},8.去掉右下角的。com信息

credits : {

enabled : true,text : “”

},9.通过点击某个按钮删除某条线的数据

$('#button').click(function(){

chart.series[0].remove();

this.disabled = true;

//series[0]是代表第一条线

});

10.设置柱形图的宽度，默认会很宽

column: {pointPadding: 0.2,borderWidth: 0,pointWidth: 40//根据这个值变化

}

11.拖动图形的点可以放大

chart: {

renderTo: 'container',zoomType: 'xy'

},完整javaHighchars例子请参考本人博客，后续请大家将所遇到的问题进行分享！