This project is read-only.

Crop graph

Mar 2, 2011 at 7:50 PM


I used this lib to write an app that produces "live" graphs of the readings from a Marposs measuring device. It produces really nice graphs but I have a question:


Say I have 1000 samples from the device and want to trim the first houndred. Could this be done with two vertical bars with "draghandles". 

I´m looking for the kind of feel that photoshop has when cropping an image. The reason I need to trim the data and not just zoom in the graph is that it would be nice to trim it before saving to file.


I should also add that I am a noob programmer.


Mar 3, 2011 at 6:52 AM


What do you need to save to file? The image, or the data? If it's the image, you can use the Ctrl-MouseDrag select zoom, and that will work for you with save screenshot.

If it's the data you want to crop, you can do something like this:

Add 2 draggablePoints with 2 Vertical lines, and the "Value" property of the Vertical lines bound to the "Position.X" property of the DraggablePoints, like this:

 <d3:ChartPlotter Name="plotter">
        <d3:DraggablePoint x:Name="FirstPoint" Position="10, 0"/>
        <d3:DraggablePoint x:Name="SecondPoint" Position="90, 0"/>
        <d3:VerticalLine Value="{Binding ElementName=FirstPoint, Path=Position.X}" />
        <d3:VerticalLine Value="{Binding ElementName=SecondPoint, Path=Position.X}" />
        <Button Content="Crop" Width="70" Height="50" VerticalAlignment="Bottom"Click="CropData"/>

The user can position the points, and generate an event (i.e. button click) to crop the data, and then call a function to cut the points below the lower draggablePoint, and above the higher draggablePoint, something like this:

 private void CropData(object sender, RoutedEventArgs e)
            double xMin = FirstPoint.Position.X;
            double xMax = SecondPoint.Position.X;
            // in case the drag points "crossed"     
            if (xMin > xMax)
                double temp = xMin;
                xMin = xMax;
                xMax = temp;
            // make a function to throw away points below xMin and above xMax
            CropDataSource(xMin, xMax);

Mar 3, 2011 at 11:22 AM

Thank you. This looks exactly like what I want, very nice of you to provide sample code.

For your question, I want to save the data to file. I think it will be a nice feature to be able to trim the data in the graph view, prior to saving it.

If anyone is interested I can upload the app.

Mar 3, 2011 at 12:07 PM

Hi Johan,

I am interested - thank you for sharing.


Mar 3, 2011 at 5:29 PM

Two things:

  1.  I´m going to have to go by the book and ask my employer if this is ok to share. I guess it is will get back to you on this.
  2. How do I share it, I am extremely noob. Where can I find the steps of how to do this? How do I get access.

This could actually turn out to something really nice if we can agree on interfaces. We are planning to make a wrapper that samples siemens powerline to get axispositions etc.

If the graphing part is a well written MVVM it would be nice to use MEF to expose devices that can be used as datasources, for example make the graph configurable so the X axis could be axisposittion from siemens and the Y axis readings from the Marposs device.


Sidenote: I´m planning to write an FFT view of the data, we have purchased Extreme Numerics at our company but if this is going to be open source it is probably not a good idea to use proprietary code in it.