DxSankeyLabelSettings Class

Contains settings for DxSankey node labels.

Assembly: DevExpress.Blazor.v24.2.dll

Declaration

public class DxSankeyLabelSettings :
    DxComplexSettingsComponent<DxSankeyLabelSettings, SankeyLabelSettingsModel>,
    IModelProvider<BorderSettingsModel>,
    IModelProvider<FontSettingsModel>,
    IModelProvider<ShadowSettingsModel>

Remarks

Use the DxSankeyLabelSettings component to configure node labels for the DxSankey component. Add a DxSankeyLabelSettings object to sankey markup to access label settings. To hide labels, set the Visible property to false.

Show Nested Component Structure

DxSankey
- DxSankeyLabelSettings

Component-Level Settings

The DxSankeyLabelSettings component allows you to specify the following properties at the component level:

Visible: Specifies whether node labels are visible.
HorizontalOffset | VerticalOffset: Specify the label position.
Overlap: Specifies how the component displays overlapped labels.
UseNodeColors: Specifies whether to apply the node color to the node label’s text.

Nested Objects

In addition to component-level settings, you can also add the following objects to DxSankeyLabelSettings markup:

DxFontSettings: Customizes label font settings
DxShadowSettings: Configures label shadows
DxBorderSettings: Shows and configures label text borders

Note

The DxBorderSettings.LineStyle property does not affect text borders of DxSankey labels.

Example

The following code snippet customizes DxSankey node labels:

DxSankey - Label Customization

Razor
DataSource

<DxSankey Data="@Data"
          Width="100%"
          Height="440px"
          SourceFieldName="Source"
          TargetFieldName="Target"
          WeightFieldName="Weight">
    <DxSankeyNodeSettings Width="8" Spacing="30" />
    <DxSankeyLabelSettings HorizontalOffset="20">
        <DxFontSettings Size="18" Color="white"/>
        <DxBorderSettings Visible="true" Color="black"/>
        <DxShadowSettings Blur="3" Color="black" VerticalOffset="5" />
    </DxSankeyLabelSettings>
    <DxSankeyLinkSettings ColorMode="SankeyLinkColorMode.Gradient" />
    <DxTitleSettings Text="Commodity Turnover" />
</DxSankey>

@code {
    IEnumerable<SankeyDataPoint> Data = Enumerable.Empty<SankeyDataPoint>();
    protected override void OnInitialized() {
        Data = GenerateData();
    }
}

public List<SankeyDataPoint> GenerateData() {
    return new List<SankeyDataPoint>() {
        new SankeyDataPoint("Spain", "United States of America", 2),
        new SankeyDataPoint("Germany", "United States of America", 8),
        new SankeyDataPoint("France", "United States of America", 4),
        new SankeyDataPoint("Germany", "Great Britain", 2),
        new SankeyDataPoint("France", "Great Britain", 4),
        new SankeyDataPoint("United States of America", "Australia", 6),
        new SankeyDataPoint("United States of America", "New Zealand", 5),
        new SankeyDataPoint("United States of America", "Japan", 3),
        new SankeyDataPoint("Great Britain", "New Zealand", 4),
        new SankeyDataPoint("Great Britain", "Japan", 1),
    };
}
public class SankeyDataPoint {
    public string Source { get; set; }
    public string Target { get; set; }
    public int Weight { get; set; }
    public SankeyDataPoint(string source, string target, int weight) {
        Source = source;
        Target = target;
        Weight = weight;
    }
}