Class SankeyLegendSettings

Represents the legend settings for the Sankey.

Inheritance
object
ComponentBase
OwningComponentBase
SfOwningComponentBase
SankeyComponentBase
SankeyLegendSettings
Implements
Inherited Members
Namespace: Syncfusion.Blazor.Sankey
Assembly: Syncfusion.Blazor.dll
Syntax
public class SankeyLegendSettings : SankeyComponentBase, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
Remarks

Use this class to customize the legend in the Sankey to enhance the visual appearance.

Examples
<SfSankey Width="600px" Height="400px" Nodes=@Nodes Links=@Links Title="Device Usage" SubTitle="-2023">
    <SankeyLegendSettings Visible="true" Position="SankeyLegendPosition.Bottom" Height="10" Width="10">
        <SankeyLegendMargin Left="10" Right="10" Top="10" Bottom="10"> </SankeyLegendMargin>
        <SankeyLegendTextStyle FontSize="10px" FontFamily="Roboto" FontWeight="600" Color="Black" FontStyle="italic">
        </SankeyLegendTextStyle>
        <SankeyLegendTitleStyle FontSize="14px" FontFamily="Roboto" FontWeight="800" Color="Black" FontStyle="italic">
        </SankeyLegendTitleStyle>
    </SankeyLegendSettings>
</SfSankey>
@code {

    public List<SankeyDataNode> Nodes = new List<SankeyDataNode>();
    public List<SankeyDataLink> Links = new List<SankeyDataLink>();

    protected override void OnInitialized()
    {
        base.OnInitialized();
        Nodes = new List<SankeyDataNode>()
        {
            new SankeyDataNode() { Id = "Female", Label = new SankeyDataLabel() { Text = "Female (58%)" } },
            new SankeyDataNode() { Id = "Male", Label = new SankeyDataLabel() { Text = "Male (42%)" } },
            new SankeyDataNode() { Id = "Tablet", Label = new SankeyDataLabel() { Text = "Tablet (12%)" } },
            new SankeyDataNode() { Id = "Mobile", Label = new SankeyDataLabel() { Text = "Mobile (40%)" } },
            new SankeyDataNode() { Id = "Desktop", Label = new SankeyDataLabel() { Text = "Desktop (48%)" } },
            new SankeyDataNode() { Id = "< 18", Label = new SankeyDataLabel() { Text = "< 18 years (8%)" } },
            new SankeyDataNode() { Id = "18-26", Label = new SankeyDataLabel() { Text = "18-26 years (35%)" } },
            new SankeyDataNode() { Id = "27-40", Label = new SankeyDataLabel() { Text = "27-40 years (38%)" } },
            new SankeyDataNode() { Id = "> 40", Label = new SankeyDataLabel() { Text = "> 40 years (19%)" } }
        };
        Links = new List<SankeyDataLink>()
        {
            new SankeyDataLink() { SourceId = "Female", TargetId = "Tablet", Value = 12 },
            new SankeyDataLink() { SourceId = "Female", TargetId = "Mobile", Value = 14 },
            new SankeyDataLink() { SourceId = "Female", TargetId = "Desktop", Value = 32 },
            new SankeyDataLink() { SourceId = "Male", TargetId = "Mobile", Value = 26 },
            new SankeyDataLink() { SourceId = "Male", TargetId = "Desktop", Value = 16 },
            new SankeyDataLink() { SourceId = "Tablet", TargetId = "< 18", Value = 4 },
            new SankeyDataLink() { SourceId = "Tablet", TargetId = "> 40", Value = 8 },
            new SankeyDataLink() { SourceId = "Mobile", TargetId = "< 18", Value = 4 },
            new SankeyDataLink() { SourceId = "Mobile", TargetId = "18-26", Value = 24 },
            new SankeyDataLink() { SourceId = "Mobile", TargetId = "27-40", Value = 10 },
            new SankeyDataLink() { SourceId = "Mobile", TargetId = "> 40", Value = 2 },
            new SankeyDataLink() { SourceId = "Desktop", TargetId = "18-26", Value = 11 },
            new SankeyDataLink() { SourceId = "Desktop", TargetId = "27-40", Value = 28 },
            new SankeyDataLink() { SourceId = "Desktop", TargetId = "> 40", Value = 9 }
        };
    }
}

Constructors

SankeyLegendSettings()

Declaration
public SankeyLegendSettings()

Properties

Background

Gets or sets the background color of the Sankey legend area.

Declaration
[Parameter]
public string Background { get; set; }
Property Value
Type Description
string

A string value specifying the background color of the Sankey legend area. The default value is "transparent".
Remarks

The value can be specified in hex or rgba format, following valid CSS color string conventions.

BorderColor

Sets and gets the color of the border that accepts value in hex and rgba as a valid CSS color string.

Declaration
[Parameter]
public string BorderColor { get; set; }
Property Value
Type Description
string

Accepts the valid CSS color string. The default value is null.
Remarks

Set this property to customize the border color of the Sankey elements. Valid CSS colors can be used such as hex, rgba, and color names.

BorderWidth

Sets and gets the width of the border in pixels.

Declaration
[Parameter]
public double BorderWidth { get; set; }
Property Value
Type Description
double

Accepts the value in pixels. The default value is 1.
Remarks

If the border width is set to 0, then the border will not be visible in the Sankey elements.

EnableHighlight

Gets or sets a value indicating whether to enable highlighting when hovered over the legend element.

Declaration
[Parameter]
public bool EnableHighlight { get; set; }
Property Value
Type Description
bool

true if highlight options are enabled; otherwise, false. The default value is true.
Remarks

If set to true, when hovered over the legend element, the respective series will be highlighted.

Height

Gets or sets the height for the legend.

Declaration
[Parameter]
public string Height { get; set; }
Property Value
Type Description
string

A string representing the height of the legend element. The default value is null. Based on the legend position, the height of the legend will be calculated.
Remarks

Accepts values in either pixels or percentage.

IsInversed

Gets or sets a value indicating whether to inverse legend item content (image and text).

Declaration
[Parameter]
public bool IsInversed { get; set; }
Property Value
Type Description
bool

true if the legend content should be inversed; otherwise, false. The default value is false.
Remarks

When set to true, the legend element will display the text before the associated shape. This is different from the default, where the shape is shown first, followed by the text.

ItemPadding

Gets or sets the padding between legend items.

Declaration
[Parameter]
public double ItemPadding { get; set; }
Property Value
Type Description
double

A double representing the padding between legend items. The default value is 8.
Remarks

Use this property to increase or decrease the padding between legend items.

Opacity

Gets or sets the opacity of the legend background.

Declaration
[Parameter]
public double Opacity { get; set; }
Property Value
Type Description
double

A double representing the opacity of the legend background. The default value is 1.
Remarks

The provided background color will be rendered with the applied opacity value.

Padding

Gets or sets the padding around the legend collection.

Declaration
[Parameter]
public double Padding { get; set; }
Property Value
Type Description
double

A double representing the padding around the legend collection. The default value is 8.
Remarks

Use this property to increase or decrease the padding around the legend collection.

Position

Gets or sets the position of the legend in the SfSankey.

Declaration
[Parameter]
public SankeyLegendPosition Position { get; set; }
Property Value
Type Description
SankeyLegendPosition

One of the SankeyLegendPosition enumerations that specifies the position of the legend. Options include:

  • Auto: Places the legend based on the width and height of the chart.
  • Top: Displays the legend at the top of the chart.
  • Left: Displays the legend at the left of the chart.
  • Bottom: Displays the legend at the bottom of the chart.
  • Right: Displays the legend at the right of the chart.
The default mode is Auto.
Remarks

Use this property to position the legend at the top, left, bottom, or right of the Sankey. By default, the legend will be placed at the bottom of the Sankey.

Reverse

Gets or sets a value indicating whether to reverse the order of legend items.

Declaration
[Parameter]
public bool Reverse { get; set; }
Property Value
Type Description
bool

true if the legend items should be reversed; otherwise, false. The default value is false.
Remarks

If set to true, the last series in the collection will be placed first.

ShapeHeight

Gets or sets the height of the legend shape.

Declaration
[Parameter]
public double ShapeHeight { get; set; }
Property Value
Type Description
double

A double representing the height of the legend shape. The default value is 10.
Remarks

Use this property to customize the height of the legend shape.

ShapePadding

Gets or sets the padding between the legend shape and legend text.

Declaration
[Parameter]
public double ShapePadding { get; set; }
Property Value
Type Description
double

A double representing the padding between the legend shape and legend text. The default value is 8.
Remarks

Set this property to increase or decrease the padding between the legend shape and legend text to enhance the visual appearance.

ShapeWidth

Gets or sets the width of the legend shape.

Declaration
[Parameter]
public double ShapeWidth { get; set; }
Property Value
Type Description
double

A double representing the width of the legend shape. The default value is 10.
Remarks

Use this property to customize the width of the legend shape.

Title

Gets or sets the title for the Sankey legend.

Declaration
[Parameter]
public string Title { get; set; }
Property Value
Type Description
string

Accepts a string value representing the title of the legend. The default value is an empty string.
Remarks

33 Use this property to provide brief information about the legend content.

TitleStyle

Gets or sets the font style for the legend title in the Sankey.

Declaration
public SankeyLegendTitleStyle TitleStyle { get; set; }
Property Value
Type Description
SankeyLegendTitleStyle

Accepts an instance of SankeyLegendTitleStyle class. The default value is an instance of SankeyLegendTitleStyle.
Remarks

Use this class to customize the font style of the legend title in the Sankey to enhance the visual appearance. It is only applicable when the Title property is set.

Visible

Gets or sets a value indicating the visibility of the legend.

Declaration
[Parameter]
public bool Visible { get; set; }
Property Value
Type Description
bool

true if the legend is visible; otherwise, false. The default value is true.
Remarks

When the Label has been set, the legend will be visible by default.

Width

Gets or sets the width for the legend.

Declaration
[Parameter]
public string Width { get; set; }
Property Value
Type Description
string

A string representing the width of the legend. Based on the legend position, the width will be calculated. The default value is null.
Remarks

Accepts values in either pixels or percentage.

Implements