How do you utilize RectangleSelector?

Jan 13, 2010 at 5:21 AM

Hi,

I am trying to use RectangleSelector just like it is in the RectSelectorSample project.  I am using the ClickAndDragSelect mode and I'd like to use my own custom control template to control the look and the interaction.  I added the snippet below to the ChartPlotter and it works very nicely - the selected rectangle updates as I drag; however, I would like to detect when the Rectangle has done drawing, or at least, when the user released the mouse button, in order to process the selection in my code behind - e.g. grab the points within the resulting DataRect.  Adding a MouseLeftButtonUp event listener on the RectangleSelector or the rectangle in the control template does not work.  What should I be listening to?

            <d3:RectangleSelector Name="selector" Mode="ClickAndDragSelect"  >
                <d3:RectangleSelector.RectangleTemplate>
                    <ControlTemplate TargetType="{x:Type Control}">
                        <Rectangle RadiusX="2" RadiusY="2" Fill="#33AAAAAA" Stroke="Gray" StrokeThickness="2" />
                    </ControlTemplate>
                </d3:RectangleSelector.RectangleTemplate>
            </d3:RectangleSelector>
	    <TextBlock >
		  <Run Text="Selected rectangle:"/>
		  <TextBlock Text="{Binding SelectedRectangle, ElementName=selector}"/>
	    </TextBlock>

Thanks very much,

E.

 

 

Jan 13, 2010 at 7:12 AM

Well, digging around a bit: in ClickAndDragHandler, the MouseLeftButtonUp event is wired as follows:

 

Plotter.CentralGrid.MouseLeftButtonUp += OnMouseLeftButtonUp;

I did the same in my ChartPlotter so that my event handler has:

 

DataRect selectedRect = selector.SelectedRectangle;
...

Please let me know if you see a problem with this approach - specifically, using the ClickAndDragSelect mode.

Thanks.