0
Under review
Clickability between oxyplot and helix
Hi all,
Me and a classmate are doing a school assignment where we're asked to develop av visualizing program for tomography data. For parts of this project we are using Helix and Oxyplot. Helix to model the pipes in question with Pipe3D, and Oxyplot to plot an intensity chart for the data set.
The data set is several 2D matrices, one for each measurement. This is processed into a bitmap which is displayed onto the 3D model.
We are using MVVM as our design pattern.
We want to introduce clickability and interactivity between these two parts. When a point or a field is marked with the pointer in the oxyplot, the same area should also be marked on the Helix model, or vice versa. The question is which is the best way to do this, and how does one do it? (bear in mind we are not experienced programmers)
Please feel free to ask any questions!
Me and a classmate are doing a school assignment where we're asked to develop av visualizing program for tomography data. For parts of this project we are using Helix and Oxyplot. Helix to model the pipes in question with Pipe3D, and Oxyplot to plot an intensity chart for the data set.
The data set is several 2D matrices, one for each measurement. This is processed into a bitmap which is displayed onto the 3D model.
We are using MVVM as our design pattern.
We want to introduce clickability and interactivity between these two parts. When a point or a field is marked with the pointer in the oxyplot, the same area should also be marked on the Helix model, or vice versa. The question is which is the best way to do this, and how does one do it? (bear in mind we are not experienced programmers)
Please feel free to ask any questions!
Customer support service by UserEcho
What it sounds like you want is called "Hit Testing". https://msdn.microsoft.com/en-us/library/ms752097.aspx
Fortunately, it is baked into WPF, including WPF 3D. This will mean that you have to use Helix/WPF rather than Helix/SharpDX. You will need to develop your own linear interpolations to interpret the results you get back from the HitTest() methods so that you can program the functionality you want against the click methods.
As design patterns go, MVVM is relatively advanced. You will very steadily become experienced programmers this way.
I've now read the link you sent me. I recently purchased a book called WPF 4.5 Unleashed, which has been very helpful and also touches on this topic. This seems like what we need.
I understand that we will be using hit testing to recognize where the clicks are performed, and if it is of importance regarding our program layout. We are, by the way, strictly using Helix/WPF for 3D-purposes, as well as Oxyplot for the charting bit.
I do not understand what you mean by creating a linear interpolation to interpret the hit test results.
If I were to click the 2D bitmap, and wanted the same point to be marked on the 3D model corresponding with the .bmp, is this where the interpolation is necessary?
Beneath is an early version (before MVVM) where you can see the 2D and 3D representation. The 2D is a Image object/BitmapSource, and the 3D model is a Pipe3D (Helix) with the bitmap wrapped around it, in a HelixViewport3D.
That's right. But, you're the only one who knows what that correspondence looks like. MVVM architecture models will help you choose a place in your code for that kind of computation, but, again, the decision process is yours to make. Under MVVM, the interpolation probably goes best in the ViewModel.
But your solution using a bitmap may be slightly easier when you want to transfer 3D hit results (given as vertex index/weights) - then you can calculate the 2D coordinate from the texture coordinates and the hit test vertex weights.
ps. I like "AltMuligKnappen"!
One thing I did not mention before was that the data set we receive is processed with bilinear interpolation, to give a nicer view.
We are not familiar with the term hit test. To get the 3D-coordinate on a MouseDown we used this event:
Is this hit testing, or is there a better way?
A lot of questions appear for me, some of which may not be fitting, but please know that all help is very much appreciated!
Below is an example picture from a bitmap representation of one measurement, after and before interpolation (the matrix is about 12 times the size of the original):
ps, that button can do all kinds of things!
First you need to subscribe to mouse events, either on the viewport or on an UIElement3D. Here is an example: The code-behind (sorry no MVVM in this example) creates the geometry for the second visual, and uses the FindHits method to calculate the texture coordinates of the hit points: I am sure this example can be improved/simplified a lot, but it was the first I could think of :-)
See the SurfacePlot demo for an example on how to use a linear gradient brush and texture coordinates to create a color coded mesh! https://github.com/helix-toolkit/helix-toolkit/tree/master/Source/Examples/WPF/ExampleBrowser/Examples/SurfacePlot
After some testing with your example, and reading up on texture coordinates, we are now more familiar with what your example does.
When hit testing we can get the texture coordinates from the point that has been clicked. The question now is how to map these coordinates on the model so that they correspond to actual "pixels" and values from the measurement matrices, and how to build the pipemodel correctly.
The next thing is to map all the "pixels" color values onto the pipemodel, giving a good visual representation of the data.
After looking at the SurfacePlot example we can get an idea of how this is done, but we are unsure how to translate this to fit in with our task. We want to implement this functionality in our program, and also the meshgrid lines, which can be a helpful visual in our case. Do you know of any simpler examples on how to do this, or is this already a simple example?
So, to clarify:
Thinking about it, what we're actually asking is how do we combine the functionality between the two examples you've mentioned?
Ideally, we would have to get the hits from two triangles, that specify one pixel/measurement value. I think we should be able to figure this one out.
Again, please ask should anything be unclear.