MENU
.net Powerful JavaScript charts
About
RGraph is a JavaScript charts library based on HTML5 SVG and canvas. RGraph is mature (over 17 years old) and has a wealth of features making it an ideal choice to use for showing charts on your website.

More »

 

New datagrid in v6.21
In version 6.21 a new datagrid object has been added. This makes it easy to add static or dynamic data tables to your pages. It can be used whether you use the canvas or SVG libraries or entirely standalone.

Read more »

 

Download
Get the latest version of RGraph (version 6.21, 10th April 2025) from the download page. You can read the changelog here. There's also older versions available, minified files and links to cdnjs.com hosted libraries.

Download »

 

License
RGraph can be used for free under the GPL or if that doesn't suit your situation there's an inexpensive (£129) commercial license available.

More »

HOWTO: Debug your charts

Debugging your charts becomes an awful lot easier if you use a javascript console. This is where you'll find error messages and it's these messages that can help you to trace the location of an error. This page focuses on the developer tools built into Google Chrome, however, each browser has its own set of developer tools. for Mozilla Firefox.

The Google Chrome developer tools in undocked mode

When you first open the developer tools in Google Chrome (you can press CTRL+SHIFT+J to open the tools) they'll probably appear in undocked mode. You may prefer this as it gives you more space initially or you may find that showing them in docked mode is more convenient. The buttons for switching modes are under the three dots menu in the top right of the window.


The Google Chrome developer tools in docked mode

Here the tools are docked so that they appear joined to the main browser window at the bottom (usually). Using them this way means that any javascript errors will appear in the console which will make debugging your charts much easier.


More information

This is an old video from Google IO 2010 detailing the development tools. Remember that other browsers as well as Google Chrome have developer tools - so refer to their documentation for more details.

The debug functions in RGraph

Some functions that you may find very useful when you're debugging your charts are the $c() $a() $p() and $d()functions. The $a() function is just an alias for the standard alert function and the $p() function is similar but goes further in that it attempts to "pretty print" the structure of whatever you pass it and also gives you type information. The $c() function is an alias for the console.log function and the $d() function opens a debug window and logs the message to it whilst not blocking execution like the alert function does. If you need to find out what a variable consists of then this is probably the function you want (or the standard $c() function).