A Simple Graph Control

I know this is an old article so I hope you are still active with it.

I downloaded the demo and regulsr source code.

I was able to build the demo program with no problems. However, when I went to build the actual dll, I got an error related to importing key file "WindowsFormsControlLibrary.pfx" The subsequent error message said that it may be password protected.

Can you assist me in getting past this?

Thanks,
Paul Scannell

Sir, Can we draw in vb language(no c++,c#)?
How to include c++ dll file?
i know how to use dll file but this is different....... Smile | :)

I give a 5 on this!
Also, is there a way to display the value on the graph?

very well, this is just that I'm searching for

Thank you!

Concise article, solved my challenge for the clipboard implementation for my graphical control. Is there also a simpler way on saving the panel as a *.jpeg or *.gif... with a saveFile dialog.

I recently developed a small charting application using System.Windows.Forms.DataVisualization.Charting. By playing with the demo application that MS provides I was able to see how to incorporate interactive functionality whereby the user can add, modify, and remove trend lines for selected intervals of data points in the plots.

Can anyone offer comments comparing
System.Windows.Forms.DataVisualization.Charting
and
WindowsFormsControlLibrary ?

Louis T Klauder Jr, Quarryville, PA, lklauder@wsof.com

Hello,

1/I was not aware there was such a capability in .net. I just checked and it is apparently a .Net 4.0 new capability? The control of this article works in .Net 2.0 (and even less I guess).
2/I don't know how the MS control performs in terms of performance, this is to be checked. My control is using a simple drawline function which I think very fast. I use it with thousands of points and several controls are displayed at once, it is still fast.
3/My control is very very simple on its usage.

Apparently it will be a standard part of .Net 4.0. But you can also use it in VS2008 and .Net 3.5 as an add-in downloaded from

www.microsoft.com/downloads/details.aspx?FamilyId=1D69CE13-E1E5-4315-825C-F14D33A303E9&displaylang=en

I appreciate your comment about the execution speed of your approach. I do not know about the efficiency of the charting control, but speed has not been an issue in what I have been doing. Results appear instantaneous but the amount of computation for a single chart is pretty small.

Have you played with using your approach to make a graph interactive? (I happen to have arranged for a right or left click on a data point to bring up a dialog that displays info about the point or lets me tell the program to add trend lines to quantify trends based on selected points.)

Louis T Klauder Jr, Quarryville, PA, lklauder@wsof.com

Hello,

The control is also extremely easy to use. Just a little of code is needed to draw a serie of point.
About your question, I was thinking about the selection of the points and popups to show the value at the mouse location but I was not able to find an easy way to retrieve the point which may be selected by the user without requiring heavy calculations (think there are multiple series on the same graph).

What could be your idea?

FYI: I just sent an update of the control, it should be updated soon.

Stephane.

When using System.Windows.Forms.DataVisualization.Charting,
the following illustrates one way to get interactivity when
a user clicks on one of the plotted points:

In the designer for the window that contains the chart,
select the chart, and go to its Properties/Events panel, and
for event MouseClick, specify a function such as chart1_MouseClick
whose outline is as follows:

<br />
      private void chart1_MouseClick( object sender, MouseEventArgs e )<br />
      {<br />
         HitTestResult result = Chart1.HitTest( e.X, e.Y );<br />
<br />
         if ( result.ChartElementType == ChartElementType.DataPoint )<br />
         {<br />
            i_point_selected = result.PointIndex;<br />
            run_name_and_yyyy_mm_dd_nn = runs_on_spiral_List[ i_point_selected ];<br />
            if ( e.Button == MouseButtons.Left )<br />
            {<br />
               cl_run_info_Form run_info_Form = new cl_run_info_Form( );<br />
<br />
               //Initialize members<br />
<br />
               run_info_Form.ChartRef = Chart1;<br />
               run_info_Form.i_point_selected = i_point_selected;<br />
                .....<br />
               run_info_Form.db_context = db_context;<br />
<br />
               run_info_Form.ShowDialog( this );<br />
<br />
            }<br />
            else if ( e.Button == MouseButtons.Right )<br />
            {<br />
               cl_period_edit_Form period_edit_Form = new cl_period_edit_Form( );<br />
<br />
               period_edit_Form.ChartRef = Chart1;<br />
               period_edit_Form.i_point_selected = i_point_selected;<br />
               .....<br />
               period_edit_Form.db_context = db_context;<br />
<br />
               period_edit_Form.ShowDialog( this );<br />
            }<br />
<br />
         }<br />
         else if ( result.ChartElementType != ChartElementType.Nothing )<br />
         {<br />
            string elementType = result.ChartElementType.ToString( );<br />
            MessageBox.Show( this, "you did not right or left click on a data point" );<br />
         }<br />
      }<br />

Earlier I wrote a charting program including user interactivity
following the techniques spelled out in Petzold's wonderful book
"Programming Microsoft Windows with C#" published in 2002. That
lets you put on the screen exactly what you want, but it involves
vastly more code, so it was a great relief to be able to use
System.Windows.Forms.DataVisualization.Charting for the simpler
charting requirements of the more recent program.

For the interactive aspect of the earlier program the main
mechanism is panels for recognizing mouse actions within
the panels. Some snippets of code I needed to use are:

<br />
      // for adjusting arcs via mouse in main window<br />
<br />
      cl_Panel_collection  arc_boundary_select_panel_col;<br />
      public TrackBar    arc_bound_location_track_bar ;<br />
      int   index_of_arc_bound_selected ;<br />

<br />
         arc_boundary_select_panel_col = new cl_Panel_collection(this) ;<br />
         this.ContextMenu = this.contextMenu_arc_adjust ;         <br />
         change_arc_adjust_state_to( arc_adjust_state_enum.none ) ;<br />

<br />
   arc_boundary_select_panel_Point = new Point( x_panel_left_pixels, y_m1_pixels );<br />
   arc_boundary_select_panel_Size = new Size( panel_width_pixels, panel_height_pixels );<br />
   arc_boundary_select_panel_Rectangle = new Rectangle( arc_boundary_select_panel_Point, arc_boundary_select_panel_Size );<br />
<br />
   arc_boundary_select_panel_col.add_Panel( arc_boundary_select_panel_Rectangle );<br />
<br />
   arc_boundary_select_panel_col[ arc_boundary_select_panel_col.Count - 1 ].MouseHover<br />
         += new System.EventHandler( boundary_select_panel_MouseHover );<br />
<br />
   arc_boundary_select_panel_col[ arc_boundary_select_panel_col.Count - 1 ].MouseLeave<br />
         += new System.EventHandler( boundary_select_panel_MouseLeave );

<br />
         // <br />
         // contextMenu_arc_adjust<br />
         // <br />
         this.contextMenu_arc_adjust.MenuItems.AddRange( new System.Windows.Forms.MenuItem[ ] {<br />
            this.menuItem_move_arc_boundary,<br />
            this.menuItem_split_arc,<br />
            this.menuItem_remove_arc,<br />
            this.menuItem_confirm_boundary_move,<br />
            this.menuItem_cancel_boundary_move} );<br />
         this.contextMenu_arc_adjust.Popup += new System.EventHandler( this.contextMenu_arc_adjust_Popup );<br />
         // <br />
         // menuItem_move_arc_boundary<br />
         // <br />
         this.menuItem_move_arc_boundary.Index = 0;<br />
         this.menuItem_move_arc_boundary.Text = "move arc boundary";<br />
         this.menuItem_move_arc_boundary.Click += new System.EventHandler( this.menuItem_move_arc_boundary_Click );<br />
         // <br />
         // menuItem_split_arc<br />
         // <br />
         this.menuItem_split_arc.Index = 1;<br />
         this.menuItem_split_arc.Text = "split arc";<br />
         this.menuItem_split_arc.Click += new System.EventHandler( this.menuItem_split_arc_Click );<br />
         // <br />
         // menuItem_remove_arc<br />
         // <br />
         this.menuItem_remove_arc.Index = 2;<br />
         this.menuItem_remove_arc.Text = "remove arc";<br />
         this.menuItem_remove_arc.Click += new System.EventHandler( this.menuItem_remove_arc_Click );<br />

<br />
      private void menuItem_move_arc_boundary_Click(object sender, System.EventArgs e)<br />
      {<br />
         if ( arc_adjust_state != arc_adjust_state_enum.showing_arc_adj_function_context_menu )<br />
         {<br />
            throw(new Exception(String.Format<br />
               (  " {0} {1} "<br />
               ,  "function menuItem_confirm_boundary_move_Click was called with "<br />
               ,  "arc_adjust_state =", arc_adjust_state.ToString( )<br />
               ,  "indicating a logic error"<br />
               ))) ;<br />
         }<br />
<br />
         arc_bound_location_track_bar.Enabled = true ;<br />
         change_arc_adjust_state_to( arc_adjust_state_enum.responding_to_arc_bound_move_track_bar ) ;<br />
      }<br />

<br />
      private void menuItem_confirm_boundary_move_Click(object sender, System.EventArgs e)<br />
      {<br />
         double   new_position ;<br />
<br />
         new_position = arc_bound_location_track_bar.Value ;<br />
<br />
         move_arc_boundary_to( this.index_of_arc_bound_selected, new_position ) ;<br />
      <br />
         remove_track_bar( ) ;<br />
         change_arc_adjust_state_to( arc_adjust_state_enum.none ) ;<br />
      }<br />

Louis T Klauder Jr, Quarryville, PA, lklauder@wsof.com

Hello

Thank you.
I will think of future improvements in this interactivity.

Thanks for your feedbacks!

Stephane.

I missed 2 features in the article:
- The user can change the name of the graph by double clicling on it.
- A graph can be selected by clicking on / near it.

Stephane.

Hi!

Is it possible to upload a source, where i can hit F5, and it runs?

as service for lazy programmers like me, who actually don't need a graph-control, but although would like to examine it a bit, if it doesnt make too much effort Big Grin | :-D

.

Hello,

Isn't it what is provided?
What is wrong, can you please help to clarify?
Thanks Stephane.

modified on Friday, February 26, 2010 5:43 PM

Oh, sorry, me stupid!

when i saw "download source code" i thought, the other download would be an executable. but it is source too. $Shucks | :-\$

thanks.

immediately my first suggestion:

i changed a little the constructors, in order to get rid of the need to write Resizing-Code, look:

C#

/// <summary>
/// Initialize a new CurveControl using default Title, Legend and Axe fonts.
/// </summary>
public CurveControl()
   : this(new Font("Arial", 15), new Font("Arial", 10), new Font("Arial", 8)) { }

/// <summary>
/// Initialize a new CurveControl using the specified Title, Legend and Axe fonts.
/// </summary>
/// <param name="TitleFont">The font used to display the title of the Curve Control.</param>
/// <param name="CurveLegendFont">The font use to display the legends.</param>
/// <param name="AxeFont">The font used to display values on axes.</param>
public CurveControl(Font TitleFont, Font CurveLegendFont, Font AxeFont) {
   this.SetStyle(ControlStyles.ResizeRedraw, true);
   Initialize();
   _CurveFont = TitleFont;
   _CurveLegendFont = CurveLegendFont;
   _AxeFont = AxeFont;
}

<br />
 this.SetStyle(ControlStyles.ResizeRedraw, true);

is the important command

or, moreover, to reduce flickering:

C#

this.SetStyle(ControlStyles.ResizeRedraw | ControlStyles.OptimizedDoubleBuffer, true);

regards

Do you know
System.Drawing.Drawing2D.Matrix
and
System.Drawing.Drawing2D.GraphicsPath?
they are very helpful when dealing with ownerdrawing.
Some time ago i also did a ChartControl[^] (my suggestion to name it) in VB.Net, if you like to look at it.
Its not comparable to yours, it only draws one line.
But the concept may be interesting: prepare and store all drawing-Informations in graphicsPathes, and align and scale it with the matrix.
So my OnPaint() is very short:

VB.NET

Protected Overrides Sub OnPaint(ByVal e As PaintEventArgs)
   MyBase.OnPaint(e)
   Dim G As Graphics = e.Graphics
   G.DrawPath(_GridPen, _GridPath)
   G.DrawPath(_CurvePen, _CurvePath)
   G.DrawPath(_PlotPen, _PlotPath)
   ControlPaint.DrawBorder(G, Me.ClientRectangle, Color.Black, ButtonBorderStyle.Solid)
   G.SmoothingMode = SmoothingMode.AntiAlias                   'Textdarstellung erfordert AntiAliasing
   G.FillPath(_TextBrush, _TextPath)
End Sub

Furthermore some tricky auto-scaling and automatically inserting axis-captions, if space available.

Hello,

Thanks for your feedbacks.
I looked to Paths but did not get it to work as I wanted. I may have to study it again!

Thanks a lot!

Stephane.

Hello,

Thanks a lot for the suggestion!
I updated my code but I cannot get it ro run.
If I remove my resize code and add this.SetStyle(ControlStyles.ResizeRedraw | ControlStyles.OptimizedDoubleBuffer, true); inside the Initialize function (or even in the constructor as you show), the control is not resizing.
What am I missing?

Thanks!
Stephane.

you should set the curveControls Dock - property, means:

C#

CC.Dock = Dockstyle.Fill;

Hello

Yes.

I will add an option in the constructor for this.
I do not especially want the control to resize because in my application, for example, the user can instantiate multiple of them and select the series to put in each of them. The curve (graph Smile | :)

) controls must then be organized in the form. A "resize" specific function is then needed.

Thanks a lot!

Stephane.

slelong wrote:
I do not especially want the control to resize...

i'm a little puzzled: you create an excellent, really non-trivial control, but seem not to know the faboulous .Net resizing-support for every control.
To set the Dock-Property always is optional. If you dont want to resize a control, just dont set its Dock. And you cannot prevent users to set the Dock of particular your control, since it's a Property of the base-class. (ok, you can, with a kind of hack).
What is up to you, is to care, that your control draws itself correctly, if someone sets the Dock-Property.
I myself usually set Dockings in the Form-Designer. (By the way: the fact, that you can drag your control from the toolbox on a form, and work with it as with any other control shows, that it is well done.)
There are more docking-options, i recomment to play around with it in the form-designer, with other controls.
To say it kinda lyrical: To me it was Docking and Anchoring, which made me fall in love with .Net immediately Wink | ;)

.

cheers

Hello,

I got it now. Sorry I got confused in your initial post by:

Mr.PoorEnglish wrote:
i changed a little the constructors, in order to get rid of the need to write Resizing-Cod

In fact, this style allows to get rids of the need to invalidate the control to make sure it is re-drawn entirely. But, the "resizing code", if you do not dock the control, it still needed.

Thanks for your help.

Stephane.

But good anyway, have a 5

Sacha Barber

Microsoft Visual C# MVP 2008/2009
Codeproject MVP 2008/2009

Your best friend is you.
I'm my best friend too. We share the same views, and hardly ever argue

My Blog : sachabarber.net

yeah, I got excited what control is that

TVMU^P[[IGIOQHG^JSH`A#@`RFJ\c^JPL>;"[,*/|+&WLEZGc`AFXc!L
%^]*IRXD#@GKCQ`R\^SF_WcHbORY87֦ʻ6ϣN8ȤBcRAV\Z^&SU~%CSWQ@#2
W_AD`EPABIKRDFVS)EVLQK)JKQUFK[M`UKs*$GwU#QDXBER@CBN%
R0~53%eYrd8mt^7Z6]iTF+(EWfJ9zaK-iTV.C\y<pjxsg-b$f4ia>

-----------------------------------------------
128 bit encrypted signature, crack if you can

modified 27-Jun-12 22:17pm.

A Simple Graph Control

Introduction

Using the Code

Creating the Control

Adding Series

Adding Points

Updating the Display

Changing the Axis of a Series

Clearing a Series

Removing a Series

Printing and Copying to the Clipboard

Using the Method to Print

Using the Method to Copy to the Clipboard

Interactivity

Graph Displayed Name

Serie Selection

History

License

Comments and Discussions