Do I need to worry about optimal drawing on canvas?

Question

I've to draw a graph on a canvas (bound by a scrollviewer). And there are about 200 or so nodes in memory.

To keep the things simple, I have derived the nodes from a usercontrol which can render itself.

But I've not created the lines between the nodes. I know from MSDN that,

On the surface, the Geometry class and the Shape class are quite similar. Both are used in the rendering of 2D graphics and both have similar concrete classes which derive from them, for example, EllipseGeometry and Ellipse. However, there are important differences between these two sets of classes. For one, the Geometry class lacks some of the functionality of the Shape class, such as the ability to draw itself.

Because there can be lot many more nodes, the system may render things slowly. Hence, to increase performance, I feel the best choice would be Geometry (custom rendering).

My questions:

1. Should I go with Shape or Geometry to draw the lines?

2. Should I render only the current viewport area of the scrollviewer to speed up the display (in which case I would have to convert the nodes from controls to geometry objects), or should I just iterate over ALL the nodes and draw lines between them?

3. Should I render the graph in memory on a bitmap and then flip it? It sounds more like game programming that general application programming! :D

4. Doesn't WPF automatically takes care of rendering what's in view and what not for better performance?

Answer 1

A few points to ponder...

From your topic I get that you dont want the ability of nodes to redraw themselves as that may make them slower. Instead, you want to decide when and which node to draw. Am I correct?

Well that looks ok to me, however Canvas is never virtualized. I recommend going through the codeplex website and download the WPFToolkit source code. Under DataVisualization namespace you have several charting controls (even ScatterredChart which is similar to yours where lines are not drawn between nodes) and their source code. Observe what they have done. How have they increased performance of their graph tools.

I also came across this artical of how to implement a Scrollable Virtualized Canvas . Probably that can help you to achieve fast rendering of nodes over canvas.

Personally...

1] Geometries are lightweight and I like them.

2] Visual HitTesting can help you understand if an item is under rendered region ie within the bounds of the scroll view. Otherwise make it hidden so that it doesn draw itself. "Hidden" and not "Collapsed" because hueristic for scrolling would work fine.

3] I remember my colleague using even the virtualizing stackpanel with horizontal orientation so that it renders nodes and the unit view ie the region specific to one point on X axis so that such repeating regions would automatially fit together to produce a monolithic graph.

Wonderful that impelemntation was!

All the best and keep us posted of your progress on this.