1

我创建了一个图表，其中添加了图像。现在，当我单击此图像时，我想将 yAxis 最大值设置为特定点，然后再次单击它以将 yAxis 重置为原始值。这是它的 jsfiddle：http: //jsfiddle.net/inadcod/TynwP/ 我已经设法添加图像，向图像添加点击事件，但就我所知。谁能帮我解决这个问题？谢谢！

4

1 回答 1

3

有两种方法可以做你想做的事。

第一种方式：

问题是不可能更新图表选项然后redraw更新它，您必须destroy然后再次创建它，如下所示。

因此，为此，您可以将图表存储options到 var 中，然后作为参数传递。

// inside options
    load: function() {
        this.renderer.image('http://inadcod.com/img/zoom.png', 70, 10, 28, 28)
        .on('click', function() {
            if(options.yAxis.max) {
                delete options.yAxis.max; // return to default
            } else {
                options.yAxis.max = 25;
            }
            chart = new Highcharts.Chart(options);                        
        })
        .css({
            cursor: 'pointer',
            position: 'relative',
            "margin-left": "-90px",
            opacity: 0.75
        }).attr({
            id: 'myImage',
            zIndex: -100
        }).add();
    }

演示

第二种方式：

redraw如果您只是更新axis如下数据，则不会调用。
chart.yAxis[0].max = 25;，这就是为什么我建议上面的方式。
但是，如果您设置chart.yAxis[0].isDisty = true;并调用chart.redraw();，它将起作用。你可以在下面看到我的演示。

// inside chart options
    load: function() {
        this.renderer.image('http://inadcod.com/img/zoom.png', 70, 10, 28, 28)
        .on('click', function() {
            var axis = chart.yAxis[0];
            axis.max = 25;
            axis.isDirty = true;
            chart.redraw();
        })
        .css({
            cursor: 'pointer',
            position: 'relative',
            "margin-left": "-90px",
            opacity: 0.75
        }).attr({
            id: 'myImage', // your image id
            zIndex: -100
        }).add();
    }

演示

于 2012-09-04T21:14:23.920 回答