menu

Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class SankeyLegendMargin - Blazor API Reference | Syncfusion

    Show / Hide Table of Contents

    Class SankeyLegendMargin

    Gets or sets the options for customizing the bottom, left, right, top margin of the legend in the Sankey Chart.

    Inheritance
    System.Object
    SankeyComponentBase
    SankeyBaseMargin
    SankeyLegendMargin
    Inherited Members
    SankeyBaseMargin.Bottom
    SankeyBaseMargin.Left
    SankeyBaseMargin.Right
    SankeyBaseMargin.Top
    Namespace: Syncfusion.Blazor.Sankey
    Assembly: Syncfusion.Blazor.dll
    Syntax
    public class SankeyLegendMargin : SankeyBaseMargin
    Remarks

    Use this class to customize the margin of the legend in the SfSankey 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

    SankeyLegendMargin()

    Declaration
    public SankeyLegendMargin()
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved