Class Chart3DTooltipSettings

Gets or sets the options for customizing the tooltip in the SfChart3D.

Inheritance

System.Object

Chart3DSubComponent

Chart3DTooltipSettings

Namespace: Syncfusion.Blazor.Chart3D

Assembly: Syncfusion.Blazor.dll

Syntax

public class Chart3DTooltipSettings : Chart3DSubComponent, IChart3DSubcomponentTracker

Examples

<SfChart3D>
    <Chart3DSeriesCollection>
        <Chart3DSeries XName="Browser" YName="Users" DataSource="@StatisticsDetails">
        </Chart3DSeries>
    </Chart3DSeriesCollection>

    <Chart3DPrimaryXAxis ValueType="Syncfusion.Blazor.Chart3D.ValueType.Category">
    </Chart3DPrimaryXAxis>

   <Chart3DTooltipSettings Enable="true" Duration="400" EnableAnimation="true" EnableMarker="false" FadeOutDuration="2000" Fill="gray" Format="${point.x} : ${point.y} : ${series.name}"
   Header="Browser" Opacity="0.8">
       <Chart3DTooltipTemplate>
           @{
               var data = context as Chart3DDataPointInfo;
               <div>@data. Y</div>
            }
       </Chart3DTooltipTemplate>
       <Chart3DTooltipBorder Color="red" Width="1"></Chart3DTooltipBorder>
       <Chart3DTooltipTextStyle FontFamily="Arial" Color="Gray" FontStyle="Bold" FontWeight="600" FontSize="14px" Opacity="0.9" TextOverflow="TextOverflow.Trim"></Chart3DTooltipTextStyle>
   </Chart3DTooltipSettings>
</SfChart3D>
@code {
    public class Statistics
    {
        public string Browser { get; set; }
        public double Users { get; set; }
        public string Color { get; set; }
    }

    public List<Statistics> StatisticsDetails = new List<Statistics>
    {
        new Statistics { Browser = "Chrome", Users = 37, Color = "red" },
        new Statistics { Browser = "UC Browser", Users = 17, Color = "blue" },
        new Statistics { Browser = "iPhone", Users = 19, Color = "green" },
        new Statistics { Browser = "Others", Users = 4, Color = "orange"  },
        new Statistics { Browser = "Opera", Users = 11, Color = "yellow" },
        new Statistics { Browser = "Android", Users = 12, Color = "pink" },
    };
}

Constructors

Chart3DTooltipSettings()

Declaration

public Chart3DTooltipSettings()

Properties

Chart3DTooltipTemplate

Gets or sets a template used to display tooltip of the SfChart3D.

Declaration

public RenderFragment<object> Chart3DTooltipTemplate { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.RenderFragment<System.Object>	The template content.

Remarks

The Chart3DTooltipTemplate used to define custom template for SfChart3D tooltip. Use the template’s context parameter to access a Chart3DDataPointInfo and its fields.

Examples

@using Syncfusion.Blazor.Chart3D
<SfChart3D>
   <Chart3DTooltipSettings>
       <Chart3DTooltipTemplate>
           @{
               var data = context as Chart3DDataPointInfo;
               <div>@data. Y</div>
            }
       </Chart3DTooltipTemplate>
   </Chart3DTooltipSettings>
</SfChart3D>

Duration

Gets or sets the duration for the tooltip animation in milliseconds.

Declaration

public double Duration { get; set; }

Property Value

Type	Description
System.Double	The duration for the tooltip animation in milliseconds. The default value is 0.

Remarks

This property specifies the duration for the tooltip to animate from one point to the next when hovered on the point. It is not applicable when EnableAnimation is set to false.

Enable

Gets or sets a value indicating whether the tooltip is enabled.

Declaration

public bool Enable { get; set; }

Property Value

Type	Description
System.Boolean	true if the tooltip is enabled; otherwise, false. The default value is false.

Remarks

Use this property to enable or disable the tooltip in the SfChart3D.

EnableAnimation

Gets or sets a value indicating whether the tooltip animates while moving from one point to another.

Declaration

public bool EnableAnimation { get; set; }

Property Value

Type	Description
System.Boolean	true if tooltip animation is enabled; otherwise, false. The default value is true.

Remarks

Use this property to enable or disable the animation of the tooltip when moving from one point to another in the SfChart3D.

EnableMarker

Gets or sets a value indicating whether to display a marker in the tooltip.

Declaration

public bool EnableMarker { get; set; }

Property Value

Type	Description
System.Boolean	true if the marker should be displayed in the tooltip; otherwise, false. The default value is true.

Remarks

If set to true, the marker shape assigned for the series associated with the hovered point is applied for the tooltip marker. If the marker is not enabled, a circle-shaped marker will be rendered by default.

EnableTextWrap

To wrap the tooltip long text based on available space. This is only application for chart tooltip.

Declaration

public bool EnableTextWrap { get; set; }

Property Value

Type
System.Boolean

FadeOutDuration

Gets or sets the duration for fading out the tooltip.

Declaration

public double FadeOutDuration { get; set; }

Property Value

Type	Description
System.Double	The fade-out duration in milliseconds. The default value is 1000.

Remarks

This property determines the duration for the tooltip to fade out when the focus on the SfChart3D point is removed.

FadeOutMode

Fade out duration for the tooltip hide.

Declaration

public Chart3DFadeOutMode FadeOutMode { get; set; }

Property Value

Type
Chart3DFadeOutMode

Fill

Gets or sets the fill color of the tooltip background.

Declaration

public string Fill { get; set; }

Property Value

Type	Description
System.String	A string representing the fill color of the tooltip background. The default fill color is determined by the SfChart3D theme. By default, the theme is set to Bootstrap5 with a fill color of #212529.

Remarks

The fill color accepts values in hex and rgba as a valid CSS color string.

Format

Gets or sets the format for the tooltip content.

Declaration

public string Format { get; set; }

Property Value

Type	Description
System.String	A string that defines the format for the tooltip content. The default value is an empty string.

Remarks

The Format property allows customization of the tooltip content. By default, the tooltip displays information for the x and y values of a point. Additional information can be included in the tooltip using a format string.
For example, the format "$series.name: $point.x" displays the series name and x-value of the point in the tooltip.

Header

Gets or sets the header text for the tooltip.

Declaration

public string Header { get; set; }

Property Value

Type	Description
System.String	A string representing the tooltip header text. The default value is an empty string.

Remarks

This property can provide additional context or information related to the data point being displayed.

Opacity

Gets or sets the opacity of the tooltip.

Declaration

public double Opacity { get; set; }

Property Value

Type	Description
System.Double	A double value specifying the opacity of the tooltip. It ranges from 0 to 1. The default value is 0.75.

Remarks

Use this property to control the transparency of the tooltip.

TextStyle

Gets or sets an instance of Chart3DTooltipTextStyle which controls the customization of the text style of the tooltip.

Declaration

public Chart3DTooltipTextStyle TextStyle { get; set; }

Property Value

Type	Description
Chart3DTooltipTextStyle	An instance of Chart3DTooltipTextStyle.

Remarks

Use this property to customize specific styling attributes, such as color and font-properties, for the text displayed in the tooltip.