Highcharts - 使用setSize向下钻取会导致图表损坏

时间:2015-04-09 18:24:41

标签: jquery highcharts

当我深入查看数据时,我需要能够调整图表的大小,因为例如,我的顶级可能只说,一系列3,我的下钻可能是一系列10,反之亦然。但是,我遇到了这个问题。

使用这个小提琴,我能够重现错误:http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-drilldown/

  type: 'bar',
  events: {
            drilldown: function(e) {
           this.setSize( this.chartWidth, ( e.seriesOptions.data.length * 50 ) + 150 );

            },
            drillup: function(e) {
           this.setSize( this.chartWidth, ( e.seriesOptions.data.length * 50 ) + 150 );
        }
     }                 
  },

注意:如果您深入到Internet Explorer,底部将显示“Proprietary或Undetectable”,这将从顶级“Brands”图表中遗留下来。

如果删除this.setSize内容,图表将正常工作。

以下是我的图表,其中包含上述更改。

http://jsfiddle.net/7oatr7xe/

问题图片:http://i.imgur.com/RrjvLRI.png

2 个答案:

答案 0 :(得分:1)

不知道这是不是一个错误,但是如果你用超时调用setSize(即使1ms似乎工作),你似乎也可以解决它。

        drilldown: function(e) {
            setTimeout(function () {
                    this.setSize( this.chartWidth, ( e.seriesOptions.data.length * 50 ) + 150 );
            }, 1);
        }

http://jsfiddle.net/7oatr7xe/1/

答案 1 :(得分:0)

问题是在drillDown中重绘图表并在setSize中尝试相同。解决方案是将标记重绘(在setSize中)设置为false。

            drilldown: function(e) {
                this.setSize( this.chartWidth, ( e.seriesOptions.data.length * 50 ) + 150,false );

            },
            drillup: function(e) {
                this.setSize( this.chartWidth, ( e.seriesOptions.data.length * 50 ) + 150,false );
            }

示例:http://jsfiddle.net/7oatr7xe/3/