Back to Devexpress

DxRangeSelectorChart.TopIndent Property

blazor-devexpress-dot-blazor-dot-dxrangeselectorchart-5b69346e.md

latest3.1 KB
Original Source

DxRangeSelectorChart.TopIndent Property

Specifies the vertical indent between the Range Selector background‘s top edge and the topmost series point.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[Parameter]
public double TopIndent { get; set; }

Property Value

TypeDescription
Double

A value between 0 and 1.

|

Remarks

Use TopIndent and BottomIndent properties to configure indents for the Range Selector’s DxRangeSelectorChart component.

razor
<DxRangeSelector Width="500px"
                 Height="200px"
                 Data="@Data">
    <DxTitleSettings Text="Population by Country, 2023" />
    <DxRangeSelectorChart TopIndent="0.5" BottomIndent="0.5">
        <DxChartBarSeries ArgumentField="@((PopulationPoint s) => s.Country)"
                          ValueField="@((PopulationPoint s) => s.Value)" />
    </DxRangeSelectorChart>
    <DxRangeSelectorBackground Color="#ebf9fa" />
</DxRangeSelector>

@code {
    List<PopulationPoint> Data;
    protected override void OnInitialized() {
        Data = GetData();
    }
}
csharp
public List<PopulationPoint> GetData() {
    var result = new List<PopulationPoint>(14);
    result.Add(new PopulationPoint("India", 1428627663));
    result.Add(new PopulationPoint("China", 1425671352));
    result.Add(new PopulationPoint("United States", 339996563));
    result.Add(new PopulationPoint("Indonesia", 277534122));
    result.Add(new PopulationPoint("Pakistan", 240485658));
    result.Add(new PopulationPoint("Nigeria", 223804632));
    result.Add(new PopulationPoint("Brazil", 216422446));
    result.Add(new PopulationPoint("Bangladesh", 172954319));
    result.Add(new PopulationPoint("Russia", 144444359));
    result.Add(new PopulationPoint("Mexico", 128455567));
    result.Add(new PopulationPoint("Ethiopia", 126527060));
    result.Add(new PopulationPoint("Japan", 123294513));
    result.Add(new PopulationPoint("Philippines", 117337368));
    result.Add(new PopulationPoint("Egypt", 112716598));
    return result;
}

public class PopulationPoint {
    public string Country { get; set; }
    public long Value { get; set; }
    public PopulationPoint(string country, long value) {
        Country = country;
        Value = value;
    }
}

See Also

DxRangeSelectorChart Class

DxRangeSelectorChart Members

DevExpress.Blazor Namespace