Binding Command (MVVM) To RadCartesianChart

[Paul]

I have a RelayCommand in my ViewModel that I would like to bind to a left mouse click on any part of the ENTIRE chart area.  

I have tried using an interaction and an EventToCommandBehavior, but I can't get any of them to fire.

The chart renders fine but the command (which is used in another ViewModel and works there) never fires (I set a breakpoint in the command body)

Here is the code for the chart and the relevant code of the ViewModel...Any help is appreciated.

protected DataPointMeasurementsViewModel()
{
    GoToDetailsCommand = new RelayCommand(() => GoToDetails());
}

public RelayCommand GoToDetailsCommand { get; set; }

private void GoToDetails()
{
    var viewModel = new DataPointDetailsChartPageViewModel(DataPointID);
    IoC.Application.GoToPage(ApplicationPage.DataPointDetailsChartPage, viewModel);
}

<telerik:RadCartesianChart x:Name="radChart" Margin="0,0,0,0" Height="340">
                <telerik:RadCartesianChart x:Name="radChart" Margin="0,0,0,0" Height="340">
    <telerik:EventToCommandBehavior.EventBindings>
        <telerik:EventBinding Command="{Binding GoToDetailsCommand}"
                 EventName="MouseLeftButtonDown" RaiseOnHandledEvents="True"  />
    </telerik:EventToCommandBehavior.EventBindings>
    <telerik:RadCartesianChart.HorizontalAxis>
        <telerik:DateTimeContinuousAxis
            LabelInterval="{Binding ChartSettingsViewModel.LabelInterval}"
            LabelFormat="{Binding ChartSettingsViewModel.LabelFormat}"
                                    PlotMode="OnTicksPadded" >
        </telerik:DateTimeContinuousAxis>
    </telerik:RadCartesianChart.HorizontalAxis>
    <telerik:RadCartesianChart.VerticalAxis>
        <telerik:LinearAxis Title="{Binding SeriesTitle}">
        </telerik:LinearAxis>
    </telerik:RadCartesianChart.VerticalAxis>
    <telerik:RadCartesianChart.Grid>
        <telerik:CartesianChartGrid MajorLinesVisibility="Y" MajorYLineDashArray="3,4" />
    </telerik:RadCartesianChart.Grid>
    <telerik:RadCartesianChart.Series>
        <chartView:LineSeries ItemsSource="{Binding Measurements}" Stroke="{Binding LineColor}">
            <chartView:LineSeries.ValueBinding>
                <telerik:PropertyNameDataPointBinding PropertyName="Value"/>
            </chartView:LineSeries.ValueBinding>
            <chartView:LineSeries.CategoryBinding>
                <telerik:PropertyNameDataPointBinding PropertyName="LocalDateTime"/>
            </chartView:LineSeries.CategoryBinding>
        </chartView:LineSeries>
    </telerik:RadCartesianChart.Series>
</telerik:RadCartesianChart>

[Dilyan Traykov]

Hello Paul,

I tested the issue you described with the Area Series demo from our SDK Samples Browser, but the custom command is executed as expected at my end. I've attached the modified project to my reply for your reference.

 

Could you please have a look and let me know how this setup differs from the one you have at your end?  If possible, please let me know how I can modify this project to reproduce the issue so that I can further assist you.

Can you also check whether there are any binding errors in the Output window of Visual Studio? If that is the case, you can try to explicitly set the source of the binding to your viewmodel instance.

I look forward to your reply.

Regards,
Dilyan Traykov
Progress Telerik