Article Options
Premium Sponsor
Premium Sponsor

 »  Home  »  .NET Newbie  »  Chart Success Part 5 - Line Graph  »  Summary
 »  Home  »  Windows Development  »  Graphics  »  Chart Success Part 5 - Line Graph  »  Summary
Chart Success Part 5 - Line Graph
by Ged Mead | Published  06/06/2006 | .NET Newbie Graphics | Rating:
Ged Mead

Ged Mead (XTab) has been around computers since the 1980's when the first affordable home computers came on the market. His journey from that very first Dragon 32 to the present has taken him through many different facets of the IT Industry. These include formal training as a Systems Analyst, employment in a mainframe software development environment, and a short time spent demonstrating rugged military IT systems in the days when it took two strong men to carry a 'mobile' system.

His most rewarding challenge was the creation of a financial management system for a large organisation.

Now based in an idyllic lochside location in the West of Scotland, he is currently involved in a range of development projects, whenever he can drag his gaze away from the stunning surrounding views, that is!

Ged is a Microsoft MVP, Senior Editor for DevCity.NET, vbCity Developer Community Leader and Admin, Helper of the Month competition winner and DevCity.NET newsletter Editor.

 

View all articles by Ged Mead...
Summary

   You may have been surprised by how much code you have to write to create this rather basic looking chart.   As with so many things when it comes to transferring ideas from paper to screen, things are not always as straightforward as they seem.  That good idea that takes 30 seconds to plan out in your mind, ends up taking 30 hours of hard work to bring to life - ah, the joys of programming!

  

 In this article we covered or used the following :

  • Bitmap
  • Brush
  • CreateGraphics
  • Double Buffering
  • DrawLine
  • DrawString
  • Font
  • GraphicsPath
  • Graphics Object
  • Pen
  • Point
  • Scaling
  • Transformations
  • X position
  • Y position

  

How would you rate the quality of this article?
1 2 3 4 5
Poor Excellent
Tell us why you rated this way (optional):

Article Rating
The average rating is: No-one else has rated this article yet.

Article rating:4.90625 out of 5
 32 people have rated this page
Article Score19186
Article Series
This article is part 1 of a 3 part series. Other articles in this series are shown below:
  1. Chart Success Part 5 - Line Graph
  2. GDI+ Chart Success Part 6: Dynamic Line Chart
  3. GDI+ Chart Success Part 7: Printing Charts
Related Articles
Attachments
Comments    Submit Comment

Comment #1  (Posted by an unknown user on 06/19/2006)
Rating
Thank you for this aricle, it was of great help to me. One question:
I am able to draw lines with the mouse on the graph and these must stay there, even after the graph is updated. How to go about?
Thanks!
 
Comment #2  (Posted by an unknown user on 06/19/2006)
Rating
Thank you for this aricle, it was of great help to me. One question:
I am able to draw lines with the mouse on the graph and these must stay there, even after the graph is updated. How to go about?
Thanks!
 
Comment #3  (Posted by Ged Mead on 06/19/2006)
Rating
Hi, You can continue in the same way by drawing your lines using DrawLine methods on the bitmap that is used and assigned to the PictureBox. If it is a single simple line you can update the bitmap on the mouse up event. If it is more complex you may need to use the DrawPath method again, saving the various mouse clicks along the way (it's fiddly but can be done).
There is a recent FAQ by Sp!ke on Persistence which you might also find of interest. You can read it here: http://www.vbcity.com/forums/faq.asp?fid=41&cat=Graphics&#TID128254
 
Comment #4  (Posted by Mike Brewster on 06/21/2006)
Rating
Thank Mr. Mead for a great tutorial. As a newbie to .NET, I am enjoying the difficulties from unlearning old school to learn new school stuff, such as this. ;-)

With that said, I may not fully understand some of your build notes. Are you in indicating that a class object be created called GraphicsPath with only the for interation in it?

Do you happen to have a ZIP build of this? I ask as the chart shows only a horizontal line at 1000 with the respective "points" as specified. I'm sure I'm missing something writing the code for DrawTheLine.

Any insight or comments is greatly appreciated. Thank you!
 
Comment #5  (Posted by an unknown user on 06/21/2006)
Rating
Hi Mike, Thanks for the feedback. I will upload a zipped sample solution by the end of the week, so you can see how the whole thing comes together.
 
Comment #6  (Posted by Ged Mead on 06/22/2006)
Rating
I have now uploaded a demo solution using VB.NET 2003. I hope this will help you to analyze the code in the article.
 
Comment #7  (Posted by Mike Brewster on 06/22/2006)
Rating
Thank Mr Mead! It is what I expected, I had the DrawTheLine coded incorrectly. I also notice your use of "try", though i didn't see it commented in the writing, is this strictly to catch the exception?. Also, if I wanted to have an additional line plotted, I assume referencing additional Sales arrays will do the trick. Again, thank you for a great tutorial!
 
Comment #8  (Posted by an unknown user on 06/27/2006)
Rating
high quality work, no shortcuts
 
Comment #9  (Posted by an unknown user on 06/30/2006)
Rating
Thanks Ged Meat for a wonderful Tutorial. I have one problem. When i am saving the chart. it not getting displayed. Can u suggest any solution for this

 
Comment #10  (Posted by Vimal Raj on 07/03/2006)
Rating
Wonderful Tutorial.When I am saving the graph in Jpeg,or any format the graph is not showing properly. In background fully its black. Can u help me out.
 
Comment #11  (Posted by Jimmie Missfeldt on 07/12/2006)
Rating
Great post. I had alot of help with it to draw my graph.

I translated all of it into C# though and came across a few problems with the VertScale on drawing the line.

I am still not quite sure from where in the translation the problem came but I got a flat line in the bottom of my graph. am using a hard size on the graph so I took the Scaling to Sales[1] * scaling (where scaling = 0.2) and it all came out good.

just a tip for you C# nerds out there who couldn't find any other graph tutorial ;)
 
Comment #12  (Posted by Bob Goh on 07/24/2006)
Rating
Excellent and well wriiten. Although my current job require me to build a complex time-distance diagram, after going through your article (1-5), it really equip me with some essential knowledges to kick start the develpoment. Thanks
 
Comment #13  (Posted by an unknown user on 08/01/2006)
Rating
Thank you!
 
Comment #14  (Posted by an unknown user on 09/29/2006)
Rating
excellent !!
 
Comment #15  (Posted by Cesar Parrales on 05/22/2007)
Rating
Mr. Mead. I having the problem that Mike say in his comment #5. You said in your comment #6 you uploaded a demo solution using VB.NET 2003.

My point is, haw can I get this solution?

I appreciate you help,

Thanks in advance.
 
Comment #16  (Posted by az on 05/31/2007)
Rating
Ok, however the chart lines fail to draw express edtion.
 
Comment #17  (Posted by an unknown user on 06/16/2007)
Rating
i am new in vb.net and this is very nicely created method for line grid

thanks
 
Comment #18  (Posted by an unknown user on 07/04/2007)
Rating
Very nice ! Thank You
 
Comment #19  (Posted by Julia Andrea Rodriguez Amaro on 07/28/2007)
Rating
Hello, I need to know where do you uploaded the sample for VB 2003. Thanks a lot!
 
Comment #20  (Posted by an unknown user on 10/05/2007)
Rating
Best C# tutorial, hands down! Please make more :)
 
Comment #21  (Posted by Nerea007 on 10/16/2007)
Rating
Thanks so much for the articles - I was struggling so much to find a good, comprehensive source for charts and graphics.

I'm having a little trouble with this section. My X-axis was not showing up and I was getting an error, so I changed 'PBBarChart' to 'PBLineChart' in these lines:

Dim StartPoint As New Point(LeftMargin, PBBarChart.Height - BaseMargin)

Dim VertLineLength As Integer = PBBarChart.Height - (BaseMargin + TopMargin)

g.DrawLine(LinePen, LeftMargin, PBBarChart.Height - BaseMargin, _
PBBarChart.Width - RightMargin, PBBarChart.Height - BaseMargin)

And the X-axis appeared just like in your screen shot, but then I went to make the procedure DrawTheLine() and it just didn't work - I got a blue horizontal line at the 1000 mark.

Could you give me any pointers as to where I'm going wrong? There was some mention in the comments about a zip file of the code - maybe you can refer me to the link and I can compare what I have written to see where my mistake is.

Thanks!
 
Comment #22  (Posted by Ged Mead on 10/16/2007)
Rating
Hi, If you navigate to the final page of the article and then page down to the bottom you will see there a link to a zip file named Chart5.zip. This is the downloadable sample. (It is placed between the "Related Articles" section and the start of the Comments.)

 
Comment #23  (Posted by an unknown user on 02/11/2008)
Rating
Very, very helpful article. I'm trying to create graphical statistics for a call management package, the next step is to connect to a SQL server table for input. Thanks for the tutorial!
 
Comment #24  (Posted by an unknown user on 03/25/2008)
Rating
Great tutorial ... thousands of thanks cast to u ... =)
 
Comment #25  (Posted by kishore on 04/10/2008)
Rating
Excellent work. How can i show value of the sales near the elliptical region. Any solution is apreciable

thnx
 
Sponsored Links