Back to Devexpress

DxSankey.WeightFieldName Property

blazor-devexpress-dot-blazor-dot-dxsankey-3df3c01a.md

latest3.1 KB
Original Source

DxSankey.WeightFieldName Property

Specifies the data source field that populates links with weights.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[DefaultValue("weight")]
[Parameter]
public string WeightFieldName { get; set; }

Property Value

TypeDefaultDescription
String"weight"

The name of the data source field.

|

Remarks

The <DxSankey> component displays data source values as nodes that have weights. Source and target nodes are connected with links that illustrate the weight flow between nodes.

Use the Data property to bind the Sankey component to a data source. To create nodes and links, specify the component’s SourceFieldName, TargetFieldName, and WeightFieldName properties.

razor
<DxSankey Data="@Data"
          Width="100%"
          Height="440px"
          SourceFieldName="Source"
          TargetFieldName="Target"
          WeightFieldName="Weight">
    <DxSankeyNodeSettings Width="8" Spacing="30" />
    <DxSankeyLinkSettings ColorMode="SankeyLinkColorMode.Gradient" />
    <DxTitleSettings Text="Commodity Turnover" />
</DxSankey>

@code {
    IEnumerable<SankeyDataPoint> Data = Enumerable.Empty<SankeyDataPoint>();
    protected override void OnInitialized() {
        Data = GenerateData();
    }
}
csharp
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;
    }
}

See Also

DxSankey Class

DxSankey Members

DevExpress.Blazor Namespace