加载后自动放大高图

Question

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

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

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

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

其他想法:

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

2)看看那个现在处于测试阶段的姊妹产品StockCharts.它似乎有一堆预设范围显示,也很酷.我不确定我现有的代码有多少我必须改变.

Answer 1

您可以使用setExtremes函数来更改缩放. 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()));

Answer 2

更新了解决方案的官方小提琴，伙计们：http : //jsfiddle.net/gh/get/jquery/1.7.2/highslide-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)
        );
    });
});