Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to open credits url of highcharts in new tab

How can I make the highcharts credits url to open in new tab?

credits: {
    enabled: true,
    text: 'text',
    href: 'url'
},
like image 968
Suraj Avatar asked May 29 '13 09:05

Suraj


3 Answers

You could redefine the credits click handler after the plot is drawn in the charts load event:

    chart: {
        events:{
            load: function() {
                this.credits.element.onclick = function() {
                    window.open(
                      'http://www.example.com',
                      '_blank'
                    );
                 }
            }
        }                
    },

Fiddle here.

like image 55
Mark Avatar answered Nov 11 '22 17:11

Mark


Here is solution that worked for me.

credits: {
    enabled: true,
    text: 'text',
    href: 'javascript:window.open("http://www.example.com/", "_blank")'
},
like image 43
Mikhail Erofeev Avatar answered Nov 11 '22 15:11

Mikhail Erofeev


http://jsfiddle.net/ptasdfmk/

// Plugin to add support for credits.target in Highcharts.
Highcharts.wrap(Highcharts.Chart.prototype, 'showCredits', function (proceed, credits) {
    proceed.call(this, credits);

    if (credits.enabled && this.credits) {
        this.credits.element.onclick = function () {

            // dynamically create an anchor element and click it
            // use the settings defined in highcharts (credits.target)

            var link = document.createElement('a');
            link.href = credits.href;
            link.target = credits.target;
            link.click();

        }
    }
});

$('#container').highcharts({

    credits: {
        enabled: true,
        text: 'CREDITS',
        href: 'http://example.com',
        target: '_blank'
    },  

});

Using the Highcharts configuration (credits section with target) a new link element is created on the fly and clicked, when you click "CREDITS". Chained events. This allows to reuse the code and act based on the configuration.

like image 32
Jens A. Koch Avatar answered Nov 11 '22 16:11

Jens A. Koch