0

在这里，我在 highcharts 中有一个要求，例如具有1d、1w、1m、3m、6m之类的范围选择器，当我单击任何范围选择器时，我必须从服务器获取响应数据，这意味着 ajax 调用 onclick 范围选择器。我有下面的小提琴文件有我的代码。这有问题，就像我通过使用添加数据一样

$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {

    if(data != null) {
        chart.addSeries({
            name : 'Energy consumption',
            id   : 'energyConsumption',
            data : data
        },{
            name : 'Outdoor Temperature',
            id   : 'outdoorData',
            data : data
        }
        );       
    }

});

上面的代码正在工作如果我将数据更改为静态或 JQuery 回调响应它不起作用。我的小提琴文件低于 http://jsfiddle.net/UegzK/4/

请帮助我提前谢谢，

4

2 回答 2

0

两个变化：

  • reset_all_buttons应该是这样的：
function reset_all_buttons() {
    $.each(chart.rangeSelector.buttons, function(index, value) {
        console.debug("index value is "+index);
        console.debug("value value is : "+ value);
        value.setState(0); 
    });

    series = chart.get('energyConsumption');
    series.remove(); 
    series = chart.get('outdoorData');
    series.remove(); 
}

因为您不想仅删除一个系列（从您的示例中）删除 10 次。

  • addSeries 一次只能添加一个系列，你应该设置pointStart和pointInterval作为开始系列：
if(data.length > 0) {
    console.log(chart,data);
    chart.addSeries({
        name : 'Energy consumption',
        id   : 'energyConsumption',
        pointStart: Date.UTC(2013, 03, 08,00,00),
        pointInterval: 1 * 3600 * 1000,
        data : [26.5, 23.3, 18.3, 13.9, 9.6,21.5, 25.2,49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6]
    });

    chart.addSeries({
        name : 'Outdoor Temperature',
        id   : 'outdoorData',
        pointStart: Date.UTC(2013, 03, 08,00,00),
        pointInterval: 1 * 3600 * 1000,
        data : [26.5, 23.3, 18.3, 13.9, 9.6,21.5, 25.2]
    });       
}

和你的例子：http: //jsfiddle.net/UegzK/5/（仅适用于1w，只是为了展示这应该是什么样子）。

于 2013-05-23T13:59:16.723 回答
0

而不是你的 reset_all_buttons 函数，调用 chart.rangeSelector.clickButton(index) 将应用 highstock 的默认行为。我有一个用例，我在每日和盘中股票价格之间切换。当我切换到 3 天视图时，我想要具有等距数据点的更精细的盘中价格。在远程视图上，我想要一个带有 ordinal:true 的 xAxis，因此这些点是基于时间的。这是我的加载事件（打字稿）

chart: {
    events: {
        load: function() {
            var chart: HighchartsChartObject = <HighchartsChartObject>this;
            var replaceSeries = (serieses: HighchartsSeriesOptions[]): void => {
                while(chart.series.length > 0) {
                    chart.series[0].remove(false);
                }
                _.each(serieses, (series: HighchartsSeriesOptions) => {
                    chart.addSeries(series, false);
                });
                chart.redraw();
            }
            var buttons = chart.rangeSelector.buttons;
            buttons[0].on("click", function(e) {
                if (chart.rangeSelector.selected !== 0) {
                    _.each(this.xAxis, (xAxis: any): void => {
                        xAxis.options.ordinal = false;
                        xAxis.options.minRange = undefined;
                    });
                    replaceSeries(chartDataService.buildDataSeries(true));
                }
                chart.rangeSelector.clickButton(0);
            });
            _.each(buttons, (button, index: number): void => {
                if (index !== 0) {
                    button.on("click", function(e) {
                        if (chart.rangeSelector.selected === 0) {
                            _.each(this.xAxis, (xAxis: any): void => {
                                xAxis.options.ordinal = true;
                                xAxis.options.minRange = 1000 * 60 * 60 * 24 * 7; // 1wk for daily data
                            });
                            replaceSeries(chartDataService.buildDataSeries(false));
                        }
                        chart.rangeSelector.clickButton(index);
                    });
                }
            })
        }
    }
}
于 2014-10-03T21:27:31.660 回答