my task is to draw a flexible number of digital signal realtime-data in SciChart.
Due to the nature of this signals they are between 0..1. I want to have them stacked as in the SciChart example found at https://www.scichart.com/example/wpf-chart-example-vertically-stacked-yaxis/.
But with a dynamic grid template inside the YAxesPanelTemplate. What ever I try, there are no YAxes drawn.
I'm using a GridExtension which is very close to the one found here:
https://rachel53461.wordpress.com/2011/09/17/wpf-grids-rowcolumn-count-properties/
refernced from this answer
https://rachel53461.wordpress.com/2011/09/17/wpf-grids-rowcolumn-count-properties/
Any help is highly appreciated
Cheers
Martin
my solution might not be ideal, but it is almost working for me.
Since I’m developing the code for a customer, I’m not allowed to post code by NDA, but I can give my theoretical approach.
specify the number of YAxes in VM
use this to build the grid inside ItemPanelTemplate and bind with DynamicResource (see example in link below)
to do so, use class from this blog and adopt as needed. I build
a specialized class for my use-case
bind to the SizeChangedEvent of RenderSurface Iterate the axes from
YAxes,calculate height per axis and set it.
inside the same loop don’t forget to set the row by using
Grid.SetRow(axis, rowIndex)
This approach is from my point of view not the most performing, but the only I was able to discover from the SciChart docs.
The last task which I’m facing, is to get the height of the chart portion of the RenderSurface, as the height given in SizeChanged is of the full height including YAxis and other stuff drawn.
Maybe someone from SciChart (#Dr. ABT - just maybe) can help out on this last task?
Hope this helps someone else too.
Cheers
Martin
Related
I am working with Visual Studio 2010 ReportViewer WinForms.
I have been unable to figure out how to fix the rectangle height in a report. I've tried using a table within the rectangle, also a table in a sub report that is placed in the rectangle of the main report with no success.
Basically, I am setting up an invoice-type report that must keep its' form and should not be allowed to grow so that elements are pushed onto a second page.
Both rectangle and tables will always grow vertically based on the content. There is no way to really stop this.
There are a couple of properties that might be able to help you get the correct page breaking in place:
KeepTogether indicates whether to keep all sections of the data region together on pane page.
When set on true and the region is to large to fit the page, this will add a page-break before the start of the region to try and fit as much as possible on a single page.
So if you wish for the region to start at the initial location but break afterwards, make sure this is to false.
PageBreak has the parameter BreakLocation which can be used to determine a fixed place to add a page-break. You can set it on Start, End, StartAndEnd or Between.
You could split your report in fixed pages and use these to add standard page-breaks in the desired (fixed) locations.
These properties alone might not be enough to get your desired result. Especially when working with tables it is hard to add a page-break after a fixed amount of rows.
It is hard to give you a detailed description of a possible approach with the amount of information you gave me, but here is some general advice.
You should split your data in the correct intervals before sending the datasource to the reporter. You can for example use grouping to place them in the correct intervals and add page-breaks based on the grouping.
Another solution is to add them in separate containers, this will require you to have enough spare data regions at your disposal. If there are too many you can always hide the empty ones based on an expression set for the Hidden property.
It won't be easy to set this up correctly so that it can dynamically grow. It takes a lot of puzzling from your end but pretty much any layout should be possible to achieve.
I wish I could give you a more specific solution to your problem and am willing to help you further if you give me an example to work with. But ultimately this is something you should be able to achieve on your own.
I'm working on a LineGraph control which consists many DependencyProperties that affect how the control should display its data. For example, the control contains the following properties to affect its axes:
AxisStroke - Color of the axes.
AxisThickness - Stroke thickness of the axes.
It also contains properties for display numbers & tick marks
VerticalTicks - True/False to indicate whether or not ticks appear along the vertical axis
HorizontalTicks - True/False to indicate whether or not ticks appear along the horizontal axis
VerticalMin - Minimum value on the vertical axis (numeric)
VerticalStep - The distance in between each vertical tick
VerticalMax - Maximum value on the vertical axis (numeric)
HorizontalMin - Minimum value on the horizontal axis (numeric)
HorizontalStep - The distance in between each horizontal tick
HorizontalMax - Maximum value on the horizontal axis (numeric)
And many more properties exist to allow for different line styles on a single graph (LineColor, LineThickness, DataPointShape, and DataPointIcon to name a few).
My goal is to be able to call out my LineGraph in XAML to insert it into a Window. I would like to be able to specify each of these settings inside the XAML as well, and see the new rendered image of the control in the WPF designer.
Now, given there is a lot of geometric shapes to render on the LineGraph, I though using a Canvas would be a good choice to render the data. Unfortunately, when I'm working in XAML, I cannot perform computations for the locations of shapes based on the control's width & height.
And yes, the shapes' locations must be computed because the data points for the graph are dynamic and the tick-related information is dynamic. Not to mention, I would like to display the actual values along each axis of the LineGraph.
So, I thought I might be able to display this control as if I was doing the rendering in C# code. Other windowing frameworks sometimes provide a Render method that can be used for laying out all of the sub-components.
Doing this, however, doesn't seem possible since WPF relies heavily on XAML for the visual appearance of controls. Also, requiring that the WPF designer must display the LineGraph based on the properties and data specified, it doesn't seem like C# code would solve the problem.
I suppose my questions are these:
How can I render data dynamically inside of a WPF control?
Am I able to specify in C# how my control is rendered, allowing the WPF designer to reflect it?
Side Note:
I've done quite a bit of research, but I am only finding information on how to implement more simple types of controls. If you know of any references that contain information on this topic, please feel free to post them in addition to your answers. I will be more than happy to learn how to do this completely.
EDIT:
I've created a graph using Excel to elaborate what the LineGraph control might look like if it has correct data and properties.
I will answer this based on my experience on implementing custom built graphing libraries in WIN32, WinForm, WPF, WinCE, WP8+WinRT, ....and even on a FPGA :)
It's extremely difficult to implement one from scratch. It may seem easy at first but you will run into a lot of "What should I do if this happens?". For example, in your above graph it seems you got a DataPoint # (5,100) it graphs it pretty well. But lets say, I add another DataPoint # (5.000000005, 0). How would you handle that in your code? Would you say that each pixel on the graph represents an exact value on the X-Axis, or does each pixel represent a range of X-Values?
I would recommend that you use an already establish library to do what you want to do unless you need something very specific like lets say you need horizontal cursors on the graph (think Tektronix Oscilloscope) and you need to calculate some values in between the two cursors.. then maybe you need to implement your own custom one or build on top of an open source one.
So, if you are still adamant of creating your own custom control here are answers to your questions.
How can I render data dynamically inside of a WPF control?
You can use a WriteableBitmap and create your own primitive drawing library from that. After you're done rendering, set it as the ImageSource of your control.
Or you can use WriteableBitmapEx which has GDI like drawing functions already implemented for you.
WriteableBitmapEx CodePlex Page, I also think you can just get it from NuGet as well.
You can also use a <Canvas> and add UI elements to that as well.
Am I able to specify in C# how my control is rendered, allowing the WPF designer to reflect it?
This depends on how you create your controls, but yes you can create Properties in your custom control that will appear in the Designer. Allowing you to change it thus updating the display. I would read a lot of tutorials about writing your own custom user control library. They can explain it better than I can in a SO answer. If you implement the properties correctly it should like so.....
Full Size Image: http://i.stack.imgur.com/pmevo.png
After changing the Number of Rows from 15 to 10 and the starting Y offset to -1 (thus moving the graph up and making the rows a lot taller)
Full Size Image: http://i.stack.imgur.com/0RKnA.png
I would have thought this was a common desire, but I'll be damned if I can find this.
I simply want to Animate an image by swapping two images back and forth. I tried StoryBoard, but apparently you can't change the source in a storyboard. The only answer I can come up with is a Timer, which I don't think is the best way.
Edit: How do I animate image content in WPF? Came up in the "Similiar Questions" window. And while this will do what I want, it is "hackish" as the OP of it says, and it only swaps two images, what if I wanted a whole sequence of 10 or 20 or 100.
I found another post here on SO whose answer sounds like it could solve your problem: Change an image during animation using storyboard
The problem with this approach is that it also doesn't satify your request for supporting an arbitrary number of images.
I was going to propose a different method that involves databinding the Image Source to the image path, and then in code behind simply changing the path, but I haven't gotten it to work yet.
Here's an article that seems to have an elegant way to handle your requirements: http://www.codeproject.com/Articles/364529/Animation-using-Storyboards-in-WPF
Hopefully that will work for you.
I am doing some work for which I need to develop a control, it should be a simple graph that shows several points and two edges.
My problem is that I need to show up to 16k points, with an update rate of 30 Hz. Has anyone done something similar?, and has any advice?.
For example whether to inherit from FrameworkElement or Control (ItemsControl in this case). If the control inherits from FrameworkElememt it may have a better performance drawing the points in the OnRender method but I would miss the Templating feature that comes from inheriting from Control.
Or does there exist another control that can do this out there?
Thanks in advance for your time.
I ended up using InteropBitmap, it is the fatest bitmap rendering class from WPF.
It allows you to map the image that you want to paint (in memory) and then reder it as a Image. This was perfect as i needed to plot points on the screen.
I got great performance (almost 50Hz for 20k points), i also use PLINQ to update the points in memory.
check this article for more details...
Try and read about ZoomableCanvas. I believe it can solve your problem. You can render all the points as small rectangles/ellipses inside the ZoomableCanvas.
I'm working on a c# wpf app in which I want to do something with audio. the irrklang audio library provides me with a pcm decoded 16 bit byte array.
I want to create a timeline control which shows the waveform along the timeline with an overlaying rectangle which the user can drag and click/drag the left and right side to increase or decrease the selection.
It is used to the trim the audio track. I would like the selected min and max to be databindable, the minimum and maximum value of the total track to be bindable.
To clarify here is an image mockup:
I'm not asking for a complete control but tips and suggestions on how to tackle this are more than welcome. Perhaps solutions like this already exist but so far I haven't been able to find it.
I think I need to tackle: the control (zooming, panning and changing the selection) and drawing the waveform in the control
Thanks in advance,
I think you should check out this codeplex project
http://wpfsvl.codeplex.com/
Refer to Audio WaveForm Drawing Using WPF.
Something based upon WaveFileTrimmerControl.xaml would be useful, it uses related controls PolygonWaveFormControl.xaml & RangeSelectionControl.xaml (links are to the XAML but refer to the CS also). In any case it'd be a good starting point for building a control that exactly meets what you want.
You could override the render method and use primitives which will give possibly better performance; but like anything related to performance I'd try the above approach first which is almost certainly good enough.