加载后自动放大高图

Automatically zooming in on highcharts after loading

本文关键字:放大 高图 加载      更新时间:2023-09-26

有人知道如何在完成加载后自动放大图表的一部分吗?我有很多时间序列数据,但最重要的信息是在右边。我仍然希望所有的数据都是可用的,但只有最近7天的数据才能放大。

我想模拟的是用户在我的图表上拖动最近7天的点击。因此,如果有人知道如何手动触发该事件,这可能是我想做的。

下面是一个来自jsfiddle的示例图表,它具有正常的缩放功能:http://jsfiddle.net/Y5q8H/50/

关于如何做到这一点,我有一些其他的想法,但我认为我想要的是最好的方法。

其他想法:

1)只加载最近7天,放一个假的"重置缩放"按钮,然后加载整个数据系列

查看一下姊妹产品StockCharts,它现在正处于测试阶段。它似乎有一堆预设的范围显示,这也会很酷。我不确定有多少现有的代码我必须改变,虽然

您可以使用setextrees函数来更改缩放。http://jsfiddle.net/quVda/382/

对于包含每日信息的时间序列图表,您需要使用UTC表示的日期:

var d = new Date();
chart.xAxis[0].setExtremes(
    Date.UTC(d.getFullYear(), d.getMonth(), d.getDate() - 7),
    Date.UTC(d.getFullYear(), d.getMonth(), d.getDate()));

更新官方提琴解决方案,伙计们:http://jsfiddle.net/gh/get/jquery/1.7.2/hililide-software/highcharts.com/tree/master/samples/stock/members/axis-setextremes/

$(function() {
    $('#container').highcharts('StockChart', {
        rangeSelector: {
            selected: 1
        },
        series: [{
            name: 'USD to EUR',
            data: usdeur
        }]
    });
    $('#button').click(function() {
        var chart = $('#container').highcharts();
        chart.xAxis[0].setExtremes(
            Date.UTC(2007, 0, 1),
            Date.UTC(2007, 11, 31)
        );
    });
});

如果您尝试

var max_in = 100; //the highest y value you have in your series data;
var min_in = 41 ;//the lowest y value you have in your series data;
yaxis=this.yAxis[0];
yaxis.options.max = max_in;
yaxis.options.min = min_in;