更新数据时图表缩小

时间:2015-03-11 11:56:40

标签: javascript highcharts

我使用highchart有一种奇怪的行为。有一段时间,当我更新某些点时,我的图表缩小了,我在开头和结尾都有一些空值。请参见下图中的差异。

这只发生一次,我在控制台中没有错误日志。

Normal Shrinked

以下是我的图表的配置:

    container.highcharts({
        chart: {
            animation: false,
            type: 'column',
            spacingRight: 0
        },
        noData: { 
            position: {x: 10, y: 10},
            style: { color: "white" }
        },
        legend: {
            enabled: false
        },
        tooltip: {
            animation: false
        },
        credits: {
            enabled: false
        },
        title: {
            text: ''
        }, 
        xAxis: {
            type: 'datetime',
            minorGridLineWidth: 0,
            minorTickLength: 0,
            maxPadding: 0,
            minTickInterval: 60000,
            showFirstLabel: false,
            showLastLabel: false
        },
        yAxis: {
            minRange: 10,
            floor: 0,
            gridLineColor: "#000000",
            gridZIndex: 7,
            title: {
                text: widgetModel.title
            }
        },
        plotOptions: {
            column: {
                pointInterval: 0,
                pointPadding: 0,
                borderWidth: 1,
                borderColor: '#000000',
                groupPadding: 0,
                grouping: false,
                shadow: false
            },
            series: {
                pointInterval: 0,
                stacking: 'normal',
                events : {
                    click : function() {
                        var seriesArray = this.chart.series;
                        for (var i = 0; i < seriesArray.length; i++) {
                            var series = seriesArray[i];
                            if (series.name != this.name) {
                                if (series.visible) {
                                    series.setVisible(false, false);
                                } else {
                                    series.setVisible(true, false);
                                }
                            }
                        }
                        self.chart.redraw();
                    }
                }

            }

        },
        series: []
    });

更新要点的代码如下:

    addPointToSerie: function (serie, date, value) {
        var pointId = serie.name + "_" + date.getTime().toString();
        var point = undefined;
        var points = serie.points || [];

        // Allow fast access of point.
        if (this.pointMap.hasOwnProperty(pointId)) {
            point = this.pointMap[pointId];
        }
        else {
            for (var j = 0; j < points.length; j++) {
                if (points[j].id === pointId) {
                    point = points[j];
                    this.pointMap[pointId] = point;
                }
            }
        }

        if (point != undefined) {
            // Optimize to update only point that have change
            if (point.y != value) {
                point.update(value, false);
            }
        } else {
            serie.addPoint({x:date, y:value, id:pointId}, false, false, false);
        }
    },

在添加或更新所有要点之后我做了

this.chart.redraw();

有人知道图表缩小的原因吗?

0 个答案:

没有答案