highchar的x轴数据自动生成

最新推荐文章于 2021-02-10 04:13:55 发布

咸鱼老罗

最新推荐文章于 2021-02-10 04:13:55 发布

阅读量1.8k

点赞数

分类专栏： JQ相关文章标签： Highchars 曲线 x轴自动

本文链接：https://blog.csdn.net/luo4105/article/details/51831209

版权

本文介绍了如何在Highcharts图表中让x轴数据自动根据数据生成，并展示了如何自定义x轴数据的显示格式，包括日期的格式化方法。通过设置xAxis.type为'datetime'和使用labels.formatter函数，可以实现x轴日期的定制化显示。同时，还演示了tooltip的formatter函数用法，以展示选中点的具体日期和值。

摘要由CSDN通过智能技术生成

highchars的x轴是可以根据数据自动生成的，不过数据类型就和以前不一样了
官网详细的例子：http://www.hcharts.cn/test/index.php?from=demo&p=16
其中x轴可以自定义格式

xAxis: {
    type: 'datetime',
    labels: {  
        formatter: function() {
        	//自定义显示格式
        	return (new Date(this.value)).Format("yyyy-MM-dd"); 
        }  
    }
},

最后选中的点的显示

tooltip: {
	enabled: true,
	formatter: function() {
		return '<b>'+ this.series.name +'</b><br/>'+(new Date(this.x)).Format("yyyy-MM-dd") +': '+ this.y +'';
	}
},

这是date加上Format的方法

Date.prototype.Format = function (fmt) { //author: meizz 
    var o = {
        "M+": this.getMonth() + 1, //月份 
        "d+": this.getDate(), //日 
        "h+"