I need to add external function for highchart tooltip formatter and events something like code given below. How to add it externally.

 $(function(){
      var highchartObj = chart: {renderTo: 'rightBottomContainer'},xAxis: {categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']}, series: [{data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]}]} 
      rchart = new Highcharts.Chart(highchartObj);
        rchart.Point.prototype.tooltipFormatter = function (useHeader) {
        //var point = this, series = point.series;
        return "AAAAAA";
    };

});

I need to add external function for highchart tooltip formatter and events something like code given below. How to add it externally.

 $(function(){
      var highchartObj = chart: {renderTo: 'rightBottomContainer'},xAxis: {categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']}, series: [{data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]}]} 
      rchart = new Highcharts.Chart(highchartObj);
        rchart.Point.prototype.tooltipFormatter = function (useHeader) {
        //var point = this, series = point.series;
        return "AAAAAA";
    };

});

• javascript
• highcharts

Share Improve this question Follow asked May 28, 2012 at 7:49 Anup SinghAnup Singh 1,57333 gold badges1616 silver badges3232 bronze badges 4

• How do you mean externally? Your code seems good enough to put in an external file if that's what you mean. – primavera133 Commented May 28, 2012 at 7:53
• Externally means I don't want to put tooltip code inside the highchart object. Externally means after rendering the chart How can I assign tooltip function to the chart something like <pre><code> rchart.Point.prototype.tooltipFormatter = function (useHeader) { //var point = this, series = point.series; return "AAAAAA"; }; </code></pre> But that is not working. – Anup Singh Commented May 28, 2012 at 7:55
• @primavera133 - any solutions for this ?? – Anup Singh Commented May 28, 2012 at 11:28
• No sorry, but I'm not that familiar with highcharts. – primavera133 Commented May 28, 2012 at 13:44

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

You can define your function somewhere like

function tooltipFormatter(){
    //your format here
}

Then pass this function to Highcharts configuration object inside tooltip object as formatter:

var chart = new Highcharts.Chart(..., tooltip: { formatter: tooltipFormatter }, ...);

As a result you can have your code in a separate function that will be passed inside Highcharts object.

Demo: http://jsfiddle/NCnS5/

Docs for formatter parameter: http://www.highcharts./ref/#tooltip--formatter