1

我正在尝试使用 HighCharts 的 HTML-table-to-chart 脚本从表格中创建折线图。

我想要一个datetimex轴,所以这就是我所做的:

  • 用于Date.parse(this.innerHTML)将行标题转换为日期字符串。
  • 在我的 xAxis 选项对象中设置type为。datetime

日期转换工作正常,并在默认工具提示中正确显示,但图表本身将 x 值视为类别,而不是日期时间。我假设它与点对象的设置方式有关,但我不确定如何解决它。

Highcharts.visualize = function(table, options) {

    // the categories
    options.xAxis.categories = [];

    $('tbody th', table).each(function(i) {
        var date = Date.parse(this.innerHTML);
        options.xAxis.categories.push(date);
    });

    // the data series
    options.series = [];
    $('tr', table).each(function(i) {
        var tr = this;
        $('th, td', tr).each(function(j) {
            if (j > 0) { // skip first column
                if (i === 0) { // get the name and init the series
                    options.series[j - 1] = {
                        name: this.innerHTML,
                        data: []
                    };
                } else { // add values
                    options.series[j - 1].data.push(parseFloat(this.innerHTML));
                }
            }
        });
    });

    charts[charts.length] = new Highcharts.Chart(options);
};

有什么建议么?

这是一个小提琴:http: //jsfiddle.net/supertrue/et2Vy/

4

3 回答 3

1

Highcharts 将 xAxis 视为类别,因为您告诉它这样做。
这里:options.xAxis.categories.push(date);

您必须使用{ x: xval, y: yval }(或[xval,yval])作为您的系列的数据类型。

于 2012-06-13T20:16:31.920 回答
1

您可能已将 xAxis 设置为 datetime,但您正在设置类别列表 ( options.xAxis.categories = [];)。您需要做的是将 x,y 值作为一个“点”发送到您的 data.push 中。

于 2012-06-13T20:18:09.627 回答
0

dateTimeLabelFormats : Object 对于日期时间轴,刻度会自动调整到适当的单位。该成员给出了用于每个单元的默认字符串表示。有关替换代码的概述,请参阅 dateFormat。默认为:{ 秒:'%H:%M:%S',分钟:'%H:%M',小时:'%H:%M',天:'%e。%b',周:'%e. %b', month: '%b \'%y', year: '%Y' } highcharts 参考示例

无论如何这可能不是正确的答案,希望这会有所帮助:)

于 2012-06-14T07:08:28.590 回答