Links in Tooltip | Highchart & Highstock | Jugal Thakkar

http://stackoverflow.com/questions/22427025/link-inside-of-a-highcharts-tooltip Jugal Thakkar http://jugal.me/

by Jugal Thakkar

HTML

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script type="text/javascript" src="http://code.jugal.me/js/jugalsLib.js"></script>
<script type="text/javascript" src="http://code.highcharts.com/stock/highstock.src.js"></script>
<script type="text/javascript" src="http://code.highcharts.com/stock/modules/exporting.src.js"></script>
<div id="container"></div>

CSS

button.btnAsLink {
    background:none!important;
    border:none;
    padding:0!important;
    /*border is optional*/
    border-bottom:1px solid #444;
}

JavaScript

var chartingOptions = {};

chartingOptions = $.extend({}, jugalsLib.getBasicChartOptions(), chartingOptions);
var samples = 10;
var serie = jugalsLib.createSeries({
    sampleCount: samples
});
serie.id = 'serie';
chartingOptions.series = [serie,{
    type: 'flags',
    data: [{
        x: serie.data[samples - 5][0],
        title: 'Flag',
        text: '<a href="http://www.google.com"> google </a>'
    }],
    onSeries: serie.id,
    shape: 'circlepin',
    width: 16
}];
chartingOptions.tooltip={
    useHTML:true
};
var chart = new Highcharts.StockChart(chartingOptions);