How to get the exported image without moving from

Question

I'm using Highcharts to draw data as diverse graphs.

As you already know, if I add the exporting.js file in the HTML document,

then it will display a small button on your top-right area within Highcharts' canvas

The current problem happens when I use a smartphone.

When I try to export the current graph, the current browser window is closed.

I can download the file, but the previous window is gone.

How can I modify Highcharts?

I want to open the new window when I click one of the export options.

Thanks in advance.

Answer 1

Since Highcharts 3.0.8 (2014-01-09) you can set the target as an option, so you don't need the drop-in fix.

Specify the target as part of the exporting.formAttributes like so:

    exporting: {
        formAttributes: {
            target: '_blank'
        }
    }

Live demo at http://jsfiddle.net/highcharts/dWfv5/4/

Answer 2

I noticed this issue on iOS devices. However there's a quite simple workaround. By default highcharts creates hidden <form> element and submits data to the exporting server. What we can do here is specifying form's target attribute.

So, here's a drop-in fix that overrides default Highcharts exporting module (just put it after exporting.js)

Highcharts.post = function (url, data) {
    var createElement = Highcharts.createElement,
        discardElement = Highcharts.discardElement,
        name,
        form;

    // create the form
    form = createElement('form', {
        method: 'post',
        action: url,
        enctype: 'multipart/form-data',
        target: '_blank'
    }, {
        display: 'none'
    }, document.body);

    // add the data
    for (name in data) {
        createElement('input', {
            type: 'hidden',
            name: name,
            value: data[name]
        }, null, form);
    }

    // submit
    form.submit();

    // clean up
    discardElement(form);
};

Here you can find a working demo: http://jsfiddle.net/dWfv5/