score:2

Accepted answer

in the setextremes you can check which button is selected by code:

xaxis: {
    events: {
        setextremes: function(e) {
            console.log(this);
            if(typeof(e.rangeselectorbutton)!== 'undefined')
            {
              alert('count: '+e.rangeselectorbutton.count + 'text: ' +e.rangeselectorbutton.text + ' type:' + e.rangeselectorbutton.type);
            }
        }
    }
}

you can render your own buttons by:

normalstate = new object();
        normalstate.stroke_width = null;
        normalstate.stroke = null;
        normalstate.fill = null;
        normalstate.padding = null;
        //normalstate.r = null;
        normalstate.style = hash('text-decoration', 'underline');

        hoverstate = new object();
        hoverstate = normalstate;


        pressedstate = new object();
        pressedstate = normalstate;

chart_1mbutton = chart.renderer.button('1m', 96, 10, function() {
        chart.xaxis[0].setextremes(1344527940000, 1346342400000, true);
        unselectbuttons();
        chart_1mbutton.setstate(2);
    }, normalstate, hoverstate, pressedstate);

    chart_1mbutton.add();

 function unselectbuttons() {
            chart_1mbutton.setstate(0);
}

score:0

you can do something like the following:

var urls = {
    '1m': 'url1',
    '3m': 'url2',
    '6m': 'url3',
    'ytd': 'url4',
    '1y': 'url5',
    'all': 'url6'
};

$('.highcharts-button').on('click', function() {
    var selected = $(this).find('tspan').text()
    $.getjson(urls[selected], function(json) {
        // set new data
    });
});

this way you'll get the url according to the selected button.

demo


Related Query

More Query from same tag