This project is read-only.

Show additional data in tooltip

Feb 28, 2014 at 6:07 PM
Edited Feb 28, 2014 at 6:09 PM
I am trying to display additional data in tooltip. My underlying data contains all the necessary information but I am having trouble passing it to the chart. Here is my code:
        //list containing data
        mySum = mySum.OrderBy(x => x.Day).ToList();
        object[,] chartData = new object[mySum.Count, 3];

        int n = 0;
        foreach (PerformanceByClient item in mySum.OrderBy(x => x.Day))
        {
      //visible in chart        
            chartData.SetValue(item.Day, n, 0);
            //visible in chart
            chartData.SetValue(item.AverageSearchTime, n, 1);
      //not visible in chart    
            chartData.SetValue(item.AverageNumResults, n, 2);
            n++;
        }

        Highcharts testChart = new Highcharts("testChart")
            .InitChart(new Chart
            {
                DefaultSeriesType = ChartTypes.Line,
                MarginTop = 25,
                Height = 300,
            })
            .SetTitle(new Title
            {
                Text = "Search History"  
            })
            .SetXAxis(new XAxis
            {
                Title = new XAxisTitle { Text = "Date" },
                Type = AxisTypes.Datetime,
            })
            .SetLegend(new Legend
            {

                Layout = Layouts.Vertical,
                Align = HorizontalAligns.Right,
                VerticalAlign = VerticalAligns.Top,
                Y = 50,
            });


        testChart.SetSeries(new Series { Data = new Data(chartData) });

        testChart.SetYAxis(new YAxis
        {
            Title = new XAxisTitle { Text = "Search Time" },
            Min = 0,
            GridLineWidth = 1,
            Labels = new XAxisLabels
            {
                Enabled = true,
            },
            AllowDecimals = true
        });

        this.testChart.Text = testChart.ToHtmlString();
The problem is, I don’t have access to the third item in the series data, only the first 2. Is there a way of accomplishing this?

Thank you.
Apr 23, 2014 at 7:52 AM
It's a bit tricky. First you should construct your chart data like this:
            object[] chartData = mySum.Select(client => new
            {
                X = client.Day,
                Y = client.AverageSearchTime,
                client.AverageNumResults
            }).ToArray();

            testChart.SetSeries(new Series { Data = new Data(chartData) });
and then you should set the tooltip like this:
            .SetTooltip(new Tooltip { Formatter = "function() { return '<b>'+ new Date(this.point.options.x) +'</b><br />Average Search Time: '+ this.point.options.y + '<br />Average Num Results: '+ this.point.options.averageNumResults; }" })
Let us know if this works.
Marked as answer by Vangi on 5/22/2014 at 5:35 AM