Class SankeyLinks
Represents the link settings in the SfSankey.
Inheritance
Namespace: Syncfusion.Blazor.Sankey
Assembly: Syncfusion.Blazor.dll
Syntax
public class SankeyLinks : SankeyComponentBase
Examples
<SfSankey Width="600px" Height="400px" DataSource="@SankeyData">
<SankeyNodes Width="30" Alignment="SankeyNodeAlign.Left" Offset="10" Padding="10">
</SankeyNodes>
<SankeyLinks Color="blue" ColorType="ColorType.Static" HighlightOpacity="1" InactiveOpacity="0.3" Opacity="0.7"> </SankeyLinks>
<SankeyLabels Visible="true" FontSize="12" Color="black" FontFamily="Arial" FontWeight="400" Padding="8"></SankeyLabels>
</SfSankey>
@code {
public SankeyData SankeyData = new SankeyData()
{
Nodes = new List<SankeyDataNode>(),
Links = new List<SankeyDataLink>()
};
protected override void OnInitialized()
{
base.OnInitialized();
SankeyData.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%)" } }
};
SankeyData.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
SankeyLinks()
Declaration
public SankeyLinks()
Properties
Color
Gets or sets the color of the links in the Sankey chart.
Declaration
public string Color { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string value specifying the color of the links. This value can be defined in hex or rgba format. The default value is null. |
Remarks
If not specified, the links will use the default color of the chart.
ColorType
Gets or sets the type of color used for the links.
Declaration
public Nullable<ColorType> ColorType { get; set; }
Property Value
Type | Description |
---|---|
System.Nullable<ColorType> | A value from the ColorType enum that specifies how the color is applied to the links. The default value is Blend. |
Remarks
HighlightOpacity
Gets or sets the highlight opacity of the links when they are hovered over.
Declaration
public double HighlightOpacity { get; set; }
Property Value
Type | Description |
---|---|
System.Double | A double value between 0.0 (fully transparent) and 1.0 (fully opaque) representing the highlight opacity. The default value is 0.8. |
Remarks
This property is useful for improving user experience by making the links more visible when hovered over.
InactiveOpacity
Gets or sets the opacity of the links when they are inactive.
Declaration
public double InactiveOpacity { get; set; }
Property Value
Type | Description |
---|---|
System.Double | A double value between 0.0 (fully transparent) and 1.0 (fully opaque) representing the inactive opacity of the links. The default value is 0.2. |
Remarks
This can help visually distinguish inactive links from active ones in the chart.
Opacity
Gets or sets the opacity of the links.
Declaration
public double Opacity { get; set; }
Property Value
Type | Description |
---|---|
System.Double | A double value between 0.0 (fully transparent) and 1.0 (fully opaque) representing the opacity of the links. The default value is 0.8. |
Remarks
Adjusting this property affects the visibility of the links. A value of 0.0 will make the links invisible.