Highchart:通过传递FROM DATE和TO DATE x轴标签应该设置

时间:2014-07-02 05:35:55

标签: javascript highcharts

我有两个下拉列表from_dateto_date。根据这两个dropdowns中的选定值,我想制作x轴标签。 目前 我使用以下代码。但它不起作用。请告诉我这是什么问题。

xAxis: {
                type: "datetime",
                dateTimeLabelFormats: {
                    day: '%m-%d'   
                },
                tickInterval: 24 * 3600 * 1000,
                min: Date.UTC(from_date),
                max: Date.UTC(to_date)
       },

修改

现在我得到了以下代码see fiidle。我很难对日期进行编码,如果它来自变量,它不起作用see fiiddle

 xAxis: {
                        type: 'datetime',
                        min: Date.UTC(2003, 8, 25),
                        max: Date.UTC(2003, 9, 8),
                        range: Date.UTC(2003, 9, 8) - Date.UTC(2003, 8, 25),
                        ordinal: false,
                        endOnTick: false,
                        startOnTick: false
                    },

2 个答案:

答案 0 :(得分:1)

问题是你如何使用Date.UTC()Date.UTC(year, month, day, .. )采用了几个参数,而不是一个字符串参数,如下所示:'2014,30,06'

请参阅示例应如何完成此操作:http://jsfiddle.net/LLExL/3049/

var from_date = '2014,30,06'.split(',');
var to_date = '2014,30,07'.split(',');
var min = Date.UTC(from_date[0], from_date[2], from_date[1]);
var max = Date.UTC(to_date[0], to_date[2], to_date[1]);
$('#container').highcharts({

  xAxis: {

     type: 'datetime',
     min: min,
     max: max,
     range: max - min,
     ordinal: false,
     endOnTick: false,
     startOnTick: false

  },

  series: [{
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
  }]

});

注意:Date.UTC()的第二个参数(月)从0(1月)开始,而不是从1(2月)开始。

答案 1 :(得分:1)

点击此处查看 DEMO

问题是您在日期初始化方面有误:

这是不正确的

var from_date='2014,30,06';
Date.UTC(from_date); //here variable value is passed as a single string with value : '2014,30,06' 

这是正确的

Date.UTC(2014,30,06);// This means that you are passing three different parameters "year", "month" and "day" for date initialization

所以要从字符串初始化日期,我们使用javascript split function分割字符串,如下所示

var from_date='2014,30,06';
var arr_from_date = from_date.split(","); 
//alert(arr_from_date[0]+" "+arr_from_date[1]+" "+arr_from_date[2]);
arr_from_date[0] //2014 has year value
arr_from_date[1] //30 has day value
arr_from_date[2] //06 has month value

所以最终的JS代码是:

var from_date='2014,30,06';
var arr_from_date = from_date.split(","); 
//alert(arr_from_date[0]+" "+arr_from_date[2]+" "+arr_from_date[1]);
var to_date='2014,30,07';
var arr_to_date = to_date.split(","); 

var new_from_date = Date.UTC(arr_from_date[0], arr_from_date[2], arr_from_date[1]);

var new_to_date = Date.UTC(arr_to_date[0], arr_to_date[2], arr_to_date[1]);
$('#container').highcharts({

    xAxis: {

                        type: 'datetime',
                        min: new_from_date,
                        max: new_to_date,
                        range: new_to_date - new_from_date,
                        ordinal: false,
                        endOnTick: false,
                        startOnTick: false

    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]

});