Hello,
in my app I am using a stacked bar chart to show the utilization of a resource over time. When the user clicks on one column I would like to show him this order which are part of this column. For this purpose I have used the following posting: https://es.infragistics.com/community/forums/p/50226/264216.aspx#264216
1. It works fine, but raises some warnings about Series.Chart which should be replaced by SeriesViewer - but this one does not have a property Axes.
private void FilterPPAs(object sender, System.Windows.Input.MouseButtonEventArgs e) { var s = this.Auslastung.Series.FirstOrDefault(); if (s == null) { return; } var position = e.GetPosition(s); var x = s.Chart.Axes.OfType<CategoryXAxis>().First(); var y = s.Chart.Axes.OfType<NumericYAxis>().First(); var viewport = new Rect(0, 0, x.ActualWidth, y.ActualHeight); var window = s.Chart.WindowRect; var unscaledX = x.GetUnscaledValue(position.X, new ScalerParams(window, viewport, false)); int currentColumn = (int)Math.Floor(unscaledX);2. Is there already a better way to get the current selected column to the ViewModel in order to filter some data?3. How can I change the color of the selected column until the filter is cleared again? The Hover Interaction examples from the Infragistics Sample Browser are not meeting this requirment. I am looking for a kind color switching for two states:a) Not selected -> regular color b) Selected -> different color, to be set and changed in the ViewModelThanks in advanceNiko
Hi Nikolaus,
We marked that Chart property as obsolete which is why you see that warning. SeriesViewer should be the correct property to use although you will need to cast it to a XamDataChart if you want to access the Axis collection. Alternatively, and easier in my opinion, I would just use your Auslastung property which is the name of your XamDataChart right?
As far as a better way to find out which column was clicked, you can handle the SeriesMouseLeftButtonDown event and this will tell you what data item was clicked which you can then get the index of from your data. This index should correlate with the column in the chart.
For changing the column color based on selection, this is a bit tricky because the brush color of the Rectangle elements are set by the control every refresh so whatever you set it too it will be overridden on the next refresh. There is a RefreshCompleted event that fires after the refresh so it would be a good place to change the color but let me try and see if there is a way to make this work through the view model. I will update you with my findings when I have completed my investigation.
Hello Rob,
thanks for the info regarding SeriesMouseLeftButtonDown. I understand now why I did not see this event: In the XAML Designer its not in the list of events.
I am looking forward for your research about coloring the currently selected column bar.
Niko
Hi Niko,
I settled on overlaying another series on top of the stacked series and bound it to the same data so it would have the same shape. I then bound the Rectangles and their Visibility properties to properties in the data model that would control selection. So the idea is that when you click on a rectangle it will set the data model selection property and this would trigger the rectangle to display, covering the rectangle behind it making it look selected. I chose this approach because changing the existing color of the main stacked series Rectangles would be difficult as they are constantly reset during every refresh. This overlay approach is simpler and only requires initial setup of the Visibility binding during the Rectangle Loaded event. After which the binding handles the rest.
There is a sample attached to this post that demonstrates how all this works. In order to maintain MVVM I have moved my selection logic into a Behavior<T> which gets attached to the overlay series. The sample currently has two approaches towards selection as I wasn't sure whether you wanted to select individual rectangles in the stacked series or if you wanted to select the whole column. The default implementation is for selecting individual columns so that is the first thing you will see if you run the sample unmodified. If you look in MainWindow.xaml and uncomment the ColumnSeries code you will see how to do column selection.
Also, the sample might be named bar chart but it's really using a column chart. The idea is still the same if you want to use a bar chart instead. I think the axis code inside the behavior will need to change to look for a CategoryYAxis instead of CategoryXAxis. Also replace any mention of ColumnFragment with BarFragment.
Let me know if you have any questions.