Browser support for RGraph
- RGraph version 6
- Older version (5.xx) requirements
- Canvas, SVG & Microsoft Internet Explorer
- Other devices
- Creating your charts without a browser
RGraph version 6
From version 6.01 RGraph will start to use javascript es6 features. What this means is that you'll need
to be using a modern-ish browser to view RGraph charts. This isn't a case of going back and
updating the libraries - that would produce a large number of bugs and errors. Only new features and
code will use the new features and not immediately either.
Version 6.00 itself will not use any of these new features - so you'll be able to upgrade to that if you want to. But subsequent releases will use the new features.
So you'll need a modern, es6 compatible browser. es6 has been around for over 5 years now so
any of the major browsers will incorporate support - including WebKit-based browsers and Firefox.
This covers the vast majority of the browser market.
Older version (5.xx) requirements
With the older 5.xx releases the charts are made using html5
features (the svg and canvas tags) so browser
support includes:
- Mozilla Firefox 3.0+
- Google Chrome 1+
- Apple Safari 3+
- Opera 9.5+
- Microsoft Internet Explorer 9+ (see note)
- Edge
- iPhone (text support from iOS v4+)
- iPad (text support from iOS v4.2+)
The html5 canvas and svg tags are part of the HTML5 standard,
and all of the above browsers have some sort of support for them.
Canvas, SVG & Microsoft Internet Explorer
Microsoft Internet Explorer 9 added support for the canvas and
svg tags at the start of 2011. Older versions of MSIE are no longer supported
by RGraph. Remember that version 6.00 of RGraph increased the base requirement to an es6 compatible
browser though.
Also note that as of version 5.27 the responsive function was switched
from using the window.onresize function to using media queries that are installed
via the javascript API (the window.matchMedia function). With Internet Explorer, this
function is only supported from version 10.
However the older version of the function that uses the window.onresize function is
still available in the RGraph.common.core.js file. Simply search for the phrase
RGraph.responsive_old and change it to RGraph.responsive. The way that
the functions are created means that this will overwrite the newer responsive
function and the result will be that you use the old version of the
responsive function.
The two functions use different styles of configuration so their configurations are incompatible. If you want to use the old function you can of course - just keep in mind that the conditions should be listed in reverse order - from smallest screen condition to largest screen condition. Like this:
.responsive([
{maxWidth: 800,width:400,height:200,options:{marginInner: 5,textSize:10}},
{maxWidth: null,width:600,height:250,options:{marginInner: 10,textSize:12}}
]);
Other devices
Other devices (eg mobile devices) may support or may be intending to
support
the canvas and/or the svg tags as part of their html5 support.
Typically the newer a device or its OS is the higher the chances are that it
has support for the html5 canvas and svg tags.
Creating your charts without a browser
If you wish to make charts without a browser or user involved - eg from a script - there's something called PhantomJS that you can use to make images from webpages automatically.
There's a HOWTO document here
that goes through the process of using PhantomJS. This document, despite
being in the canvas section of the website, applies also to svg
charts.
You can also find a little bit of information about PhantomJS on the download page.
Puppeteer for NodeJS
If you're using NodeJS then there's a more up-to-date
project called Puppeteer that you can use to get
images of your charts instead of PhantomJS. You can find
the Puppeteer Git page here: