HighChart和HighStock显示相同图表的x轴和y轴长度不同

时间:2017-04-27 13:27:43

标签: javascript highcharts highstock

我在两个不同的地方使用相同的图表,数据正在动态加载。 在我正在使用HighChart的地方之一和其他我使用HighStock获得Navigator,Scrollbar工厂。

我想要实现的是我异步加载数据,图表显示加载文本/加载器,直到从服务器获取数据。这对HighChart来说非常好。但是当谈到HighStock时,事情并没有奏效。它显示的数据与我期望的数据不同。

让我解释一下,图表首先被初始化,当它从服务器获取数据时我试图在这里记录xAxis的值,它为HighChart显示1是正确的但是对于HighStock,语句显示为2 xAxis。

// HighChart

var MyChart = {
    initHighcharts: function() {
        this.chart = new Highcharts.Chart({
             // Chart related configuration
            },
            series: []
        });
        this.chart.showLoading();
    },        

    updateChart: function(data) {

        console.log('x axis', this.chart.xAxis);// Here i get 1 xAxis

        // Load data here

        this.chart.redraw();
        this.chart.hideLoading();
    },
};

MyChart.initHighcharts();
setTimeout(function() {
    var data = someData;      
    MyChart.updateChart(data);
}, 2000);

当我将HighChart更改为HighStock时,我不明白这里出了什么问题。我在这里更改的唯一信息是 this.chart = new Highcharts.StockChart({

 //HighStock chart

    var MyChart = {
        initHighcharts: function() {
            this.chart = new Highcharts.StockChart({
                 // Chart related configuration
                },
                series: []
            });
            this.chart.showLoading();
        },        

        updateChart: function(data) {

            console.log('x axis', this.chart.xAxis);// Here i get 2 xAxis

            // Load data here

            this.chart.redraw();
            this.chart.hideLoading();
        },
    };

    MyChart.initHighcharts();
    setTimeout(function() {
        var data = someData;      
        MyChart.updateChart(data);
    }, 2000)

这是表示我所面临的错误的两个小提琴,

  1. HighChart Fiddle
  2. HighStock Fiddle
  3. 我已经记录了xAxis的长度,请打开控制台窗口以查看xAxis值。我在这里做错了吗?

    非常感谢任何帮助!! 感谢

0 个答案:

没有答案