0

我已经在我正在处理的 highcharts 应用程序中添加了缩小功能,但我注意到在重新放大时出现了一些非常糟糕的行为。如果缩放窗口包含图形数据范围之外的区域,则生成的缩放级别不正确忽略该区域。抱歉,如果这有点不清楚,我不确定如何最好地解释它。

这是一个展示问题的小提琴:http: //jsfiddle.net/rnAEB/

$(function () {
    chart = new Highcharts.Chart({

        chart: {
            renderTo: "container",
            zoomType: "xy"
        },

        title: {
            text: 'Try zooming outside the data range'
        },

        tooltip: {
            headerFormat: '<b>{series.name}</b><br />',
            pointFormat: 'x = {point.x}, y = {point.y}'
        },

        series: [{            
            data: [1, 2, 4, 8, 16, 32, 64, 128, 256, 512],
            pointStart: 1
        }]
    });

    chart.xAxis[0].setExtremes(-10, 20, true);
    chart.yAxis[0].setExtremes(-500, 1000, true);
});

尝试放大从 (5, 1000) 到 (10, -500) 的矩形。生成的缩放区域在 (5, 600) 到 (10, -100) 之间......这显然不是缩放请求所要求的。

我已经尝试挂钩到轴的 setExtremes 事件,并且发生此问题时的界限是未定义的。但是,我不知道如何“劫持” setExtremes 请求以修复未定义的值。我也不能从该事件中递归调用 setExtremes。

这是预期的行为吗?我可以理解为什么您只想缩放数据所在的位置 - 但我真的很希望可以自由缩放到没有数据的位置以进行透视。

4

2 回答 2

2

看来这是预期的行为。在 highcharts 源代码中四处寻找使我找到了 Highcharts.Axis.prototype.zoom 方法,该方法具有以下条件:

    // Prevent pinch zooming out of range
    if (!this.allowZoomOutside) {
        if (newMin <= this.dataMin) {
            newMin = UNDEFINED;
        }
        if (newMax >= this.dataMax) {
            newMax = UNDEFINED;
        }
    }

我已经尝试使用配置选项设置“allowZoomOutside”选项,但不幸的是,我可以找出(或在源代码中找到)没有未记录的钩子。

根据源代码中的评论,缩放方法旨在被覆盖(他们特别提到了股票图表),我宁愿避免尝试从外部手动设置“allowZoomOutside”并希望它不会被某些内部擦除机制。覆盖缺少此检查的版本就像一个魅力。这是一个更新的小提琴作为示例:http: //jsfiddle.net/7XHMz/

如果有人能弄清楚如何正确设置“allowZoomOutside”选项,尽管这可能是最好的方法。

于 2013-05-29T14:38:52.453 回答
0

这与“开始图表”以自己的形式生成(两个axss中的最小值/最大值)的事实有关,然后你调用setExtrems,这是唯一的事件,被调用一次。所以图表不能“记住”新的极端。因此,您可以使用 setExtremes 形式的数字和有关事件来定义最小/最大值。

http://jsfiddle.net/rnAEB/1/

 xAxis:{
            min:-10,
            max:20
        },
        yAxis:{
            min:-500,
            max:1000
        },
于 2013-05-29T10:11:34.977 回答