Question

我正在尝试使用CSV文件中的两个数据点绘制一个图表，该文件包含更多具有日期时间x轴的数据点。

最后，用户应该能够从整个数据集中比较他选择的两年。

从API文档中我知道我可以使用startRow和endRow从CSV中选择一系列数据点：

https://api.highcharts.com/highcharts/data.startRow

但是，这只会绘制一个特定点，正如您在my fiddle中看到的那样。有没有其他方式以编程方式显示特定点？

Highcharts.chart('container', {
    chart: {
        type: 'column',
        polar: false,
    },
    title: {
        text: ''
    },
    subtitle: {
        text: ''
    },
    data: {
        csv: document.getElementById('csv').innerHTML,
        startRow: 3,
        endRow: 4,
        googleSpreadsheetKey: false,
        googleSpreadsheetWorksheet: false
    },
    series: [{
            name: 'val'
    }],
    yAxis: [{
        title: {
            text: ''
        },
        opposite: true,
        labels: {
            align: 'right',
            reserveSpace: true            
        }
    }],
    xAxis: [{
        type: 'datetime',
        opposite: false
    }],
    pane: {
        background: []
    },
    responsive: {
        rules: []
    },
    legend: {
        title: ''
    },
    plotOptions: {
        series: {
            animation: false
        }
    }
});

编辑：

我忘了提一下，我只想加载一次CSV。之后，用户应该能够在不重新加载数据的情况下选择/更新数据点。为了动态显示值范围，我使用了Axis min和max设置，如下所示：

$(this).highcharts().update({
    xAxis:{
        min: Date.UTC(selectedStart,0,0),
        max: Date.UTC(selectedEnd,11,31)
    }
});

整个数据集加载一次，图表轴更新用户交互。现在我正在寻找类似的东西，不仅仅是一个范围，而是整个数据集的两个值的比较。

Answer 1

Highcharts数据模块提供了一个名为parsed的函数，允许您在应用于图表之前以编程方式修改所获取的数据。

来自Highcharts API （https://api.highcharts.com/highcharts/data.parsed）：

解析：功能
一个回调函数来访问已解析的列，二维输入数据直接在它们之前解释为系列数据和类别。返回false以停止完成，或调用this.complete（）继续异步。

现场演示：http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/data/parsed/

如何在Highcharts中显示表格数据中的两个特定数据点？

1 个答案: