Skip to main content

DxChart<T>.SynchronizeAxes Property

Indicates whether to synchronize value axes when they are displayed on a single pane.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(true)]
[Parameter]
public bool SynchronizeAxes { get; set; }

Property Value

Type Default Description
Boolean true

true to synchronize axes; otherwise, false.

Remarks

For example, when the Chart synchronizes two axes, it does the following:

  • Divides the second axis into intervals. The number of intervals is equal to the number of intervals of the first axis. The intervals are marked by ticks.
  • Aligns the ticks of both axes.

Charts with different SynchronizeAxes

The default behavior automatically selects axis values for axis synchronization.

Use the SynchronizedValue property to align axes at specific values.

Example

The following example synchronizes the Precipitation axis with the Temperature axis at values 2 and 10, respectively:

Synchronized values are set for value axes

<DxChart SynchronizeAxes=true>
    <DxChartValueAxis SynchronizedValue=2>
        <DxChartAxisTitle Text="Precipitation, mm" />
    </DxChartValueAxis>
    <DxChartValueAxis Name="Temperature" 
                      Alignment="ChartAxisAlignment.Far" 
                      SynchronizedValue=10>
        <DxChartAxisTitle Text="Temperature, C" />
    </DxChartValueAxis>
    <DxChartBarSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                      ValueField="@((WeatherForecast i) => i.Precipitation)"
                      Name="Precipitation">
    </DxChartBarSeries>
    <DxChartBarSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                      ValueField="@((WeatherForecast i) => i.TemperatureC)"
                      Name="Temperature"
                      Axis="Temperature">
    </DxChartBarSeries>
</DxChart>
See Also