DxRangeSelectorScaleMarker Class

Contains settings for scale markers.

Assembly : DevExpress.Blazor.v25.2.dll

Declaration

csharp

public class DxRangeSelectorScaleMarker :
    DxComplexSettingsComponent<DxRangeSelectorScaleMarker, RangeSelectorScaleMarkerModel>,
    IModelProvider<RangeSelectorScaleMarkerLabelModel>

Remarks

Scale markers accompany the scale axis that displays DateTime values. A scale marker consists of a separator and label.

Add a DxRangeSelectorScaleMarker object to the DxRangeSelectorScale component markup to configure settings of scale markers in DxRangeSelector.

Show Nested Component Structure

DxRangeSelector
- DxRangeSelectorScale
  - DxRangeSelectorScaleMarker
    - DxRangeSelectorScaleMarkerLabel
      - DxTextFormatSettings

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

VisibleSpecifies whether scale markers are visible. Set this property to false to hide scale markers.SeparatorHeightSpecifies the height of scale marker separators.IndentFromScaleLabelSpecifies the vertical indent between scale markers and scale labels.LabelLeftIndent | LabelTopIndentPosition scale marker labels relative to corresponding separators.

You can also add a DxRangeSelectorScaleMarkerLabel object to the DxRangeSelectorScaleMarker component markup to customize format settings of scale marker labels.

Example

The following code snippet configures scale markers and their labels:

razor

<DxRangeSelector Width="1000px"
                 Height="400px"
                 SelectedRangeStartValue="@(new DateTime(2024, 2, 1))"
                 SelectedRangeEndValue="@(new DateTime(2024, 2, 14))">
    <DxRangeSelectorScale StartValue="@(new DateTime(2024, 1, 1))"
                          EndValue="@(new DateTime(2024, 6, 1))"
                          MinorTickInterval="ChartAxisInterval.Day"
                          TickInterval="ChartAxisInterval.Week"
                          MaxRange="ChartAxisInterval.Month"
                          MinRange="ChartAxisInterval.Week"
                          ValueType="ChartAxisDataType.DateTime">
        <DxRangeSelectorScaleMarker IndentFromScaleLabel="0"
                                    LabelLeftIndent="25"
                                    LabelTopIndent="20"
                                    SeparatorHeight="50">
            <DxRangeSelectorScaleMarkerLabel>
                <DxTextFormatSettings Type="TextFormat.MonthAndYear" />
            </DxRangeSelectorScaleMarkerLabel>
        </DxRangeSelectorScaleMarker>
    </DxRangeSelectorScale>
    <DxRangeSelectorSliderMarker>
        <DxTextFormatSettings Type="TextFormat.MonthAndDay" />
    </DxRangeSelectorSliderMarker>
</DxRangeSelector>

Implements

Inheritance

Object ComponentBase DxSettingsComponent<DevExpress.Blazor.Internal.RangeSelectorScaleMarkerModel> DxComplexSettingsComponent<DxRangeSelectorScaleMarker, DevExpress.Blazor.Internal.RangeSelectorScaleMarkerModel> DxRangeSelectorScaleMarker