Skip to main content Skip to footer

Display Rich Tooltips on C1Chart

Tooltips are a very effective and straight forward way to extend the charts and add more information to them, without overloading the user. When you hover over the points in the data series on the chart area at runtime, the tooltips appear for each point.

ComponentOne Chart controls support basic, plain looking tooltips. But you can display rich tooltips that can include additional text formats (bold text, colored text, etc) as well as images or hyperlinks using C1SuperTooltip in WinForms.

Show Tooltips in the MouseMove event of C1Chart

In order to display the Tooltips until the user moves the mouse, you can use the Show method of C1SuperTooltip in the MouseMove event of C1Chart. This method shows the tooltip with the specified text, for the specified control, at the specified position, for a specified amount of time.

void c1Chart1_MouseMove(object sender, MouseEventArgs e)  
        {  
            Point mp = e.Location;  
            double x =0, y = 0;  
            chart.ChartGroups[0].CoordToDataCoord(mp.X, mp.Y, ref x, ref y);  
            ChartDataSeries ds = chart.ChartGroups[0].ChartData.SeriesList[0];  
            int di = XValueToIndex(ds, x);  
            c1SuperTooltip1.Show(chart.ChartGroups[0].ChartData.SeriesList[0].PointData[di].ToString(), chart, e.Location);  
        }  

int XValueToIndex(ChartDataSeries ds, double xval)  
        {  
            double[] dates = (double[])ds.X.CopyDataOut(typeof(double[]));  
            if (dates == null)  
                return 0;  
            int len = dates.Length;  
            double x1 = dates[0];  
            double x2 = dates[len - 1];  
            double index = (len - 1) * (xval - x1) / (x2 - x1);  
            if (index < 0)                 index = 0;             else if (index > len - 1)  
                index = len - 1;  
            return (int)Math.Round(index);  
        }  

Hide Tooltips in the MouseLeave event of C1Chart

Since the requirement is to display the Tooltips until the mouse is moved, use the Hide method of C1SuperTooltip to hide the tooltips in the MouseLeave event of the chart.

void chart_MouseLeave(object sender, EventArgs e)  
        {  
            c1SuperTooltip1.Hide();  
        }  

Finished. C1SuperTooltip can also be used for such endless customizations in other controls of the suite.

Hunter Haaf