How to bind dynamic data in highcharts Tooltip

Question

Now I am using Highcharts. Can any one answer how to bind dynamic data in tooltip of highcharts. I already binded my data from database which I want to show in chart to data array of series.

    js.Append("series: [{name: 'Average Price',type: 'line',color: 'blue',");
    js.Append("data:[");
    for (int i = 0; i < dt.Rows.Count; i++)
   {
    js.Append("[" + Decimal.Parse(dt.Rows[i]["Test"].ToString().Trim()) + ],");
   }
    js.Append("]]}); ");

It was ok.

But I also want to show another data from database in tooltip as dynamic. I don't know how to pass data to tooltip.

Thanks in advance.

Ei Thae Ei Thae · Accepted Answer · 2014-08-14T08:45:51

Now I got solution using http://api.highcharts.com/highstock#series. In series of highcharts, we can add dynamic value more than two. If only one data in data array of series, it will be assumed as yaxis values, If two data in data array of series, it will be assumed as xaxis values and yaxis vales. But more than two data in data array of seres, we can customize that values which we want to add. And than we can use that values in tooltip as dynamically.

    js.Append("tooltip: {crosshairs: true,shared: true,formatter: function() {");
            js.Append("var s = '';$.each(this.points, function(i, point) {");
            js.Append("s += '<b>#' + this.point.name +': PSF -'+ this.point.y +' :'+ this.point.test+ '</b>';");
            js.Append("});return s;}")

 js.Append("series: [{name: 'Average Price',type: 'line',color: 'blue',");
    js.Append("data:[");
    for (int i = 0; i < dt.Rows.Count; i++)
   {
js.Append("{ name:'" + dt.Rows[i]["name"].ToString().Trim()+ "',test:'" + dt.Rows[i]["test"].ToString().Trim()+ "',y:" + dt.Rows[i]["value"].ToString().Trim()+ ",color:'#DC3811'},");

   }
    js.Append("]]}); ");

I hope it will be help to someone when using highcharts.

How to bind dynamic data in highcharts Tooltip

1 Answers