Question

我正在使用HighCharts库来绘制非常大的数据集（即约18,000个点）。我在后端使用量化来将点数减少到合理的大小（小于200）。当用户选择图表的一部分时，它向服务器发出ajax请求并接收具有更高采样频率的新集合。但是，当更改plotOptions中的pointInterval时，它实际上不会更改显示图表上的间隔。

这些是我用来制作图表的选项：

options = {
    chart: {
        renderTo: settings.highchartId,
        zoomType: 'x',
        spacingRight: 20,
        events: {
            load: getChartData,
            selection: zoomChart,
        }   
    },
    title: {
        text: Drupal.settings.openfitcharts.title
    },
    subtitle: {
        text: document.ontouchstart === undefined ? 
                'Click and drag in the plot area to zoom in' :
                'Drag your finger over the plot to zoom in'
    },
    xAxis: {
        allowDecimals: false,
        title: {
            text: Drupal.settings.openfitcharts.xAxisTitle
        }
    },
    yAxis: {
        title: {
            text: Drupal.settings.openfitcharts.yAxisTitle
        },
        startOnTick: false,
        showFirstLabel: false
    },
    tooltip: {
        shared: true                    
    },
    legend: {
        enabled: false
    },
    series: [{
        type: "line",
        data: [],
    }],
    plotOptions: {
        line: {
            marker: {
                enabled: false,
                states: {
                    hover: {
                        enabled: true,
                        radius: 5
                    }
                }
            },
            pointInterval: 1,
            pointStart: 0,
        }
    }
};

这是我用来获取数据的函数：

function getChartData() {
    activityId = settings.seriesData.activityId;
    trackType = settings.seriesData.type;

    jQuery.getJSON(OPENFIT_DATA_URL, {op: 'TrackHandler.getTrackData', actid: activityId, type: trackType}, function(returnData) {
        console.log(returnData);
        console.log(chart);
        if (returnData != null) {
            chart.options.plotOptions.line.pointInterval = returnData.interval;
            chart.options.plotOptions.line.pointStart = returnData.start;
            chart.xAxis[0].adjustTickAmount();
            chart.series[0].setData(returnData.data, true);
        }
    });
}

Answer 1

您也可以使用series.update()一次更新所有选项，请参阅：http://jsfiddle.net/7XcMn/

    chart.series[0].update({
        pointInterval: 100,
        data: [100, 200, 300]
    });

Answer 2

更改系列对象的pointInterval而不是plotOptions：

chart.series[0].pointInterval = 24 * 3600 * 1000;
chart.series[0].setData([29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],true);

See this fiddle.

创建图表后更改HighCharts pointInterval

2 个答案: