Q: Include links in Highcharts tooltip and make the point clickable so that the links can be clicked I have a graph which contains spline charts and scatter charts. Now on each scatter graph, there is a tooltip which has a link. Whenever i try to go on that link, the tooltip shifts off. I want that the tooltip should remain there once i click the scatter graph so that i can click the link.
$(function () {
$('#barChart').highcharts({
     chart: {
    title: {
        text: '',
        style: {
            color: '#cc0000',
            fontWeight: 'bold'
        }
    },
    xAxis: {
        categories: [{{{timeZoneTime}}}]
    },
     yAxis: [{ /* Primary yAxis */
        labels: {
            format: '{value}%',
            style: {
                color: '#cc0000'
            }
        },
        title: {
            text: 'Failure Percentage',
            style: {
                color: '#cc0000'
            }
        }
    }, { /* Secondary yAxis */
        title: {
            text: 'Success Percentage',
            style: {
                color: '#009900'
            }
        },
        max: 100, 
        labels: {
            format: '{value} %',
            style: {
                color: '#009900'
            }
        },
        opposite: true
    }],
    labels: {
        items: [{
            html: '',
            style: {
                left: '2px',
                top: '18px',
                color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'
            }
        }]
    },
    credits: {
      enabled: false
    },
    series: [{
        type: 'column',
        name: 'Success',
        color: '#7deda2',
        yAxis: 1,
        tooltip: {
            pointFormatter: function(){
              return "Success: " + this.y + "%" + "<br />" + "Success docs: " + toolTipSuccess[this.series.data.indexOf( this )] + "<br />";
            }
        },
        data: [{{barSuccess}}]
    }, 
    {
      type: 'scatter',
      name: 'incidents',
      yAxis: 1,
      data: [[0,100],[1,100],[2,100],[3,100],[4,100],[5,100],[6,100],[7,100],[8,100],[9,100],[10,100],[11,100],[12,100],[13,100],[14,100],[15,100],[16,100],[17,100],[18,100],[19,100],[20,100],[21,100],[22,100],[23,100],[24,100]],
      tooltip: {
        pointFormatter: function(){
              return "<a href="#">" + toolTip[this.series.data.indexOf( this )] + "</a>";
            }
      }
    },
    {
        type: 'spline',
        name: 'Failure',
        tooltip: {
            pointFormatter: function(){
              return "Failure: " + this.y + "%" + "<br />" + "Failure docs: " + toolTipFailure[this.series.data.indexOf( this )] + "<br />";
            }
        },
        data: [{{barFailure}}],
        marker: {
            lineWidth: 3,
            lineColor: Highcharts.getOptions().colors[8],
            fillColor: 'red'
        }
    },
    {{#if lu}}
       {
        type: 'spline',
        name: 'Unknown',
        tooltip: {
            pointFormatter: function(){
              return "Unknown: " + this.y + "%" + "<br />" + "Unknown docs: " + toolTipUnknown[this.series.data.indexOf( this )] + "<br />";
            }
        },
        data: [{{barUnknown}}],
        marker: {
            lineWidth: 3,
            lineColor: 'blue',
            fillColor: '#87CEFA'
        }
    }
    {{/if}}
    ]
});

});
Now for keeping the tooltip fixed after clicking the scatter chart, there was a code on stackoverflow. BUt i don't know where to place this to make it work. I tried everywhere but it wasn't working. I just want this feature for the scatter graph. This is the code.
 plotOptions: {
        series: {
            cursor: 'pointer',
            point: {
                events: {
                    click: function() { 
                        if (cloneToolTip)
                        {
                            chart.container.firstChild.removeChild(cloneToolTip);
                        }
                        cloneToolTip = this.series.chart.tooltip.label.element.cloneNode(true);
                        chart.container.firstChild.appendChild(cloneToolTip);
                    }
                }
            }
        }
    },

I also wanted to put some links in the tooltip of the scatter chart. I tried doing it like this but this did not work.
{
  type: 'scatter',
  name: 'incidents',
  yAxis: 1,
  data: [[0,100],[1,100],[2,100],[3,100],[4,100],[5,100],[6,100],[7,100],[8,100],[9,100],[10,100],[11,100],[12,100],[13,100],[14,100],[15,100],[16,100],[17,100],[18,100],[19,100],[20,100],[21,100],[22,100],[23,100],[24,100]],
  tooltip: {
    pointFormatter: function(){
          return "<a href="#">" + toolTip[this.series.data.indexOf( this )] + "</a>";
        }
  }
},

Can anyone help me out in this? Been stuck at this for a long time now. Thanks. 
