Xceed Logo
Shop
Xceed Chart for WinForms v4.4 Documentation
Welcome to Xceed Chart for WinForms v4.4 / User Guide / Interactivity / Drag Operations / Tooltips

In This Topic
    Tooltips
    In This Topic

    Tooltips are displayed by adding a TooltipInteractivityOperation object to InteractivityOperationsCollection:

    VB.NET  
    chartControl.InteractivityOperations.Add(New TooltipInteractivityOperation())
    C#  
    chartControl.InteractivityOperations.Add(new TooltipInteractivityOperation());

    You must also tell the chart which tooltips you want to display. This is done by properly modifying the Interactivity and SeriesInteractivity objects assigned to almost all chart elements. The following code creates a bar chart and assigns tooltips to all chart elements:

    VB.NET  
    ' Instruct the control to display tooltips
    chartControl1.InteractivityOperations.Add(New TooltipInteractivityOperation())
    Dim chart As Chart =   chartControl1.Charts(0)
     
    ' Create a bar series
    Dim bar As BarSeries = CType(chart.Series.Add(SeriesType.Bar), BarSeries)
    bar.BarStyle = BarStyle.CutEdgeBar
    bar.Legend.Mode = SeriesLegendMode.DataPoints
    bar.Values.Add(20.0)
    bar.Values.Add(60.0)
    bar.Values.Add(50.0)
    bar.Values.Add(80.0)
    bar.Values.Add(60.0)
    bar.Appearance.FillMode = AppearanceFillMode.DataPoints
    bar.Interactivity.TooltipMode = SeriesTooltipMode.DataPoints
    bar.Interactivity.Tooltips.Add("Data item 0")
    bar.Interactivity.Tooltips.Add("Data item 1")
    bar.Interactivity.Tooltips.Add("Data item 2")
    bar.Interactivity.Tooltips.Add("Data item 3")
    bar.Interactivity.Tooltips.Add("Data item 4")
     
    ' set some fill effects in the collection.
    Dim fillEffect As FillEffect =  New FillEffect(Color.Red)
    bar.Appearance.FillEffects.Add(fillEffect)
    fillEffect = New FillEffect()
    fillEffect.SetGradient(GradientStyle.DiagonalUp, GradientVariant.Variant2,
    Color.BlueViolet, Color.Honeydew)
    bar.Appearance.FillEffects.Add(fillEffect)
    fillEffect = New FillEffect()
    fillEffect.SetPattern(HatchStyle.Divot, Color.DarkOrchid, Color.Aqua)
    bar.Appearance.FillEffects.Add(fillEffect)
    fillEffect = New FillEffect()
    fillEffect.SetPredefinedAdvancedGradient(AdvancedGradientScheme.CalmWater1, 4)
    bar.Appearance.FillEffects.Add(fillEffect)
    fillEffect = New FillEffect()
    fillEffect.SetSolidColor(Color.BlanchedAlmond)
    bar.Appearance.FillEffects.Add(fillEffect)
     
    ' Add stripes for the left and the bottom axes
    Dim s1 As AxisStripe =   chart.Axis(StandardAxis.PrimaryY).Stripes.Add(50,60)
    Dim s2 As AxisStripe =   chart.Axis(StandardAxis.PrimaryX).Stripes.Add(2,3)
     
    ' assign tooltips to all chart elements
    ' Background
    m_Form.chartControl1.Background.Interactivity.Tooltip = "Background"
     
    ' Back chart wall
    chart.Wall(ChartWallType.Back).Interactivity.Tooltip = "Back chart wall"
     
    ' Left chart wall
    chart.Wall(ChartWallType.Left).Interactivity.Tooltip = "Left chart wall"
     
    ' Floor chart wall
    chart.Wall(ChartWallType.Floor).Interactivity.Tooltip = "Floor chart wall"
     
    ' Primary Y axis
    chart.Axis(StandardAxis.PrimaryY).Interactivity.Tooltip = "Primary Y axis"
     
    ' Primary X axis
    chart.Axis(StandardAxis.PrimaryX).Interactivity.Tooltip = "Primary X axis"
     
    ' Horizontal stripe
    (CType(chart.Axis(StandardAxis.PrimaryY).Stripes(0), AxisStripe)).Interactivity.Tooltip = "Horizontal stripe"
     
    ' Vertical stripe
    (CType(chart.Axis(StandardAxis.PrimaryX).Stripes(0), AxisStripe)).Interactivity.Tooltip = "Vertical stripe"
     
    ' Legend
    (CType(m_Form.nChartControl1.Legends(0), Legend)).Interactivity.Tooltip = "Legend"
     
    m_Form.chartControl1.Refresh()
    C#  
    // Instruct the control to display tooltips
    chartControl1.InteractivityOperations.Add(new TooltipInteractivityOperation());

    Chart chart = (Chart)(chartControl1.Charts[0]);

    // Create a bar series
    BarSeries bar = (BarSeries)chart.Series.Add(SeriesType.Bar);
    bar.BarStyle = BarStyle.CutEdgeBar;
    bar.Legend.Mode = SeriesLegendMode.DataPoints;

    bar.Values.Add(20.0);
    bar.Values.Add(60.0);
    bar.Values.Add(50.0);
    bar.Values.Add(80.0);
    bar.Values.Add(60.0);

    bar.Appearance.FillMode = AppearanceFillMode.DataPoints;
    bar.Interactivity.TooltipMode = SeriesTooltipMode.DataPoints;

    bar.Interactivity.Tooltips.Add("Data item 0");
    bar.Interactivity.Tooltips.Add("Data item 1");
    bar.Interactivity.Tooltips.Add("Data item 2");
    bar.Interactivity.Tooltips.Add("Data item 3");
    bar.Interactivity.Tooltips.Add("Data item 4");

    // set some fill effects in the collection.
    FillEffect fillEffect = new FillEffect(Color.Red);
    bar.Appearance.FillEffects.Add(fillEffect);

    fillEffect = new FillEffect();
    fillEffect.SetGradient(GradientStyle.DiagonalUp, GradientVariant.Variant2, Color.BlueViolet, Color.Honeydew);
    bar.Appearance.FillEffects.Add(fillEffect);

    fillEffect = new FillEffect();
    fillEffect.SetPattern(HatchStyle.Divot, Color.DarkOrchid, Color.Aqua);
    bar.Appearance.FillEffects.Add(fillEffect);
     
    fillEffect = new FillEffect();
    fillEffect.SetPredefinedAdvancedGradient(AdvancedGradientScheme.CalmWater1, 4);
    bar.Appearance.FillEffects.Add(fillEffect);

    fillEffect = new FillEffect();
    fillEffect.SetSolidColor(Color.BlanchedAlmond);
    bar.Appearance.FillEffects.Add(fillEffect);

    // Add stripes for the left and the bottom axes
    AxisStripe s1 = chart.Axis(StandardAxis.PrimaryY).Stripes.Add(50, 60);
    AxisStripe s2 = chart.Axis(StandardAxis.PrimaryX).Stripes.Add(2, 3);

    // assign tooltips to all chart elements
    // Background
    m_Form.chartControl1.Background.Interactivity.Tooltip = "Background";

    // Back chart wall
    chart.Wall(ChartWallType.Back).Interactivity.Tooltip = "Back chart wall";

    // Left chart wall
    chart.Wall(ChartWallType.Left).Interactivity.Tooltip = "Left chart wall";

    /// Floor chart wall
    chart.Wall(ChartWallType.Floor).Interactivity.Tooltip = "Floor chart wall";

    // Primary Y axis
    chart.Axis(StandardAxis.PrimaryY).Interactivity.Tooltip = "Primary Y axis";

    // Primary X axis
    chart.Axis(StandardAxis.PrimaryX).Interactivity.Tooltip = "Primary X axis";

    // Horizontal stripe
    ((AxisStripe)(chart.Axis(StandardAxis.PrimaryY).Stripes[0])).Interactivity.Tooltip = "Horizontal stripe";

    // Vertical stripe
    ((AxisStripe)(chart.Axis(StandardAxis.PrimaryX).Stripes[0])).Interactivity.Tooltip = "Vertical stripe";

    // Legend
    ((Legend)(m_Form.chartControl1.Legends[0])).Interactivity.Tooltip = "Legend";

    m_Form.chartControl1.Refresh();

    It is obvious in this code that the tooltips displayed by all chart elements except the data items in the series are controlled by the Interactivity object attached to them. This provides a very consistent way for working with all interactivity features, and tooltips in particular. 

    To add tooltips to data items, you need to use a slightly different programming technique. This is because it is not realistic to attach an Interactivity object to each data item, as this will increase the memory usage of the component, especially when you have many data points. Instead, each series has an attached SeriesInteractivity object, which exposes collections for the same properties as the Interactivity object. For example, the Tooltip property becomes a Tooltips collection. The SeriesInteractivity object also exposes several properties that define how to map the entries in the collections to the different data items. For example, in DataPoints mode the control assigns tooltips to the data items by cycling over the Tooltips collection. This model is much more flexible than assigning an Interactivity object for each data item. For example, let's say that you have to use the same tooltip for all data items. In this case all you have to do is to add the tooltip to the Tooltips collection and set the TooltipMode to SeriesTooltipMode.DataPoints:

    VB.NET  
    bar.Interactivity.TooltipMode = SeriesTooltipMode.DataPoints
    bar.Interactivity.Tooltips.Add("This tooltip is common for all data items")
    C#  
    bar.Interactivity.TooltipMode = SeriesTooltipMode.DataPoints;
    bar.Interactivity.Tooltips.Add("This tooltip is common for all data items");

    Note that we can also modify some properties of the TooltipInteractivityOperation, such as AutoPopDelay and InitialDelay, which control the delays for showing and hiding tooltips.

    Related Examples

    Windows Forms: Interactivity\Tooltips and Cursors 

    Web forms: Getting started\HTML image map, Getting started\HTML image map postback

    See Also

    ChartControl | SeriesInteractivity | Interactivity | HTML Image Map | HTML Image Map with Postback

     

     

    Copyright Xceed Software Inc

    Send Feedback