Release notes for 2021

The release notes and information regarding upgrades that you should read for the 2021 releases. You should read this when you're upgrading from an older version of RGraph to a newer one in case something that affects you has changed.

• July
• April
• March
• January

July 2021 (v6.01)

• The labelsInbar* properties were added to the SVG Horizontal Bar and the canvas Horizontal Bar charts.
• The Bar chart has a new corners property. This can be set to round if you want and you'll get rounded corners on the bars. There's also a new cornersRoundRadius property which allows you to control the magnitude of the rounding effect. The default for this property is 10.
• The tooltips templates macro %{group} has been removed from the site. It's still supported, is working and I have no plans to remove it - however the %{dataset} is now the preferred macro to use.
• Some of the demos have been brought up to better/more recent styles of coding.
• The colorsConnectors property has been added to the canvas Waterfall chart. The SVG Waterfall chart already had a colorsConnector property so this has been renamed to colorsConnectors (an s has been added on to the end). The former property name will still work though (for backwards-compatibility purposes).
• The SVG Line chart now has support for rendering a trend line on your chart. This brings the total chart support for trend lines to: canvas Scatter/Line charts and SVG Scatter/Line charts. There's a demo of an SVG Line chart with a trend line in the demos which are in the download archive and you can see the documentation section on the SVG Line chart documentation page.
• The tickmarksColor option has been added to the Line chart. So you could have a red line with black tickmarks for example.
• A new interesting Line chart demo has been added called line-3d-effect.html. As the name suggests this is a 3D Line chart, which has multiple datasets. It's not controlled by an option - ie it's not natively supported, but the code involved to produce the chart is not difficult (though there is a lot of it). You can find the demo in the demos/ folder in the download archive. You can see a picture of it on the RGraph blog.
• A few pseudo-constants (they're really just variables) have been added to the core library:
  • RGraph.MONTHS_SHORT ([Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec])
  • RGraph.MONTHS_LONG ([January, February, March, April, May, June, July, August, September, October, November, December])
  • RGraph.DAYS_SHORT ([Mon, Tue, Wed, Thu, Fri, Sat, Sun])
  • RGraph.DAYS_LONG ([Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday])
  • RGraph.HOURS24 ([00:00, 01:00, 02:00, ..., 21:00, 22:00, 23:00])
  • RGraph.HOURS12 ([00:00, 01:00, 02:00, 03:00, 04:00, 05:00, 06:00, 07:00, 08:00, 09:00, 10:00, 11:00])
  They're all pretty self-explanatory but if you want to see or alter them then they're located in the RGraph.common.core.js file near the top. You could use them like this:

  new RGraph.Bar({
      id: 'cvs',
      data: [4,8,6,5,3,2,5],
      options: {
          xaxisLabels: RGraph.DAYS_SHORT
      }
  }).draw();
  

• The canvas Line chart now (as well as the canvas Scatter chart) can draw a trend line for your data.
• The Scatter chart now has an explode effect. With this effect the marks on the chart explode outwards from a point on the chart (top-left, top-center, top-right, center-left, center-center, center-right, bottom-left, bottom-center or bottom-right).
• The RScatter chart now has an explode effect. With this effect the marks on the chart explode outwards from the center of the chart.

April 2021 (v6.00)

• The RGraph source code is now available via GitHub so you can now browse the source code and, if the desire strikes you, fork it!
• The trendline option has been added to the SVG Scatter chart. See the SVG Scatter chart documentation page for the applicable options. As a result of this addition the outofbounds option default value has been changed from false to true.
• The RGraph blog has been separated out into different pages for each year instead of being one huge page.
• From this major release features from JavaScript ES6 will start being used. This means that older browsers will no longer be supported. You can read the installation documentation for details on what browsers are now supported. If you want the last 5.xx release you can get that from the download page.
• Improvements have been made to the handling of Y axis tickmarks on SVG charts. This means that you may notice that one or two tickmarks may disappear when you upgrade. Making the charts look better I hope you'll agree.
• The SVG Activity meter has been added. This is just like the canvas based version of it and supports a number of useful API methods and the grow effect. It also supports interactive adjusting and can be configured with two quite different appearances along with tooltips and supports having multiple data points on the chart. Read the Activity meter API documentation page for more information.
• The SVG Segmented donut has been added. This is just like the canvas based version of it and supports the grow and roundRobin effects, interactive adjusting and has a number of useful API methods. Read the Segmented donut API documentation page for more information.
• The SVG Horseshoe meter has been added. This is just like the canvas based version of it and supports the grow effect, interactive adjusting and has a number of useful API methods. Read the Horseshoe meter API documentation page for more information.
• Formatted labels have been added to both canvas and SVG charts. They're similar to formatted tooltips albeit with fewer options (because they're not HTML). You can read about them on the formatted labels documentation page. Note that even though this page is in the canvas section of the website it's still applicable to SVG charts.
• The SVG Rose chart property amargin has been renamed to marginInner. You don't need to immediately change your code though as there's backwards-compatibility code that accounts for this change.

March 2021 (v5.28)

• All of the canvas charts that can show a title have had the properties titleOffsetx and titleOffsety added.
• The Meter chart properties labelsValuePoint and labelsValueThousand have been added.
• The Meter chart properties labelsValueText* have changed to labelsValue*
• The Bipolar chart colors option has been changed - the colors red blue and yellow have been added to the start of the colors array. If you don't like this then you can set it back to the original colors array which is commented out in the source code. Simply open the Bipolar chart source file (RGraph.bipolar.js) and uncomment the colors option which is commented out. Search for the following text in the file and remove the // at the start of the line: //colors:
• A Bipolar chart tooltip positioning bug when the textAccessible feature is disabled and the variant is set to 3d has been resolved. The positioning of tooltips in general has been improved.
• A Horizontal Bar chart tooltip positioning bug when the textAccessible feature is disabled and the variant is set to 3d has been resolved. The positioning of tooltips in general has been improved.
• A Bar chart tooltip positioning bug when the textAccessible feature is disabled and the variant is set to 3d has been resolved. The positioning of tooltips in general has been improved.
• The border color and the shadow for the annotating mini-palette have been tweaked ever-so-slightly.
• The Pie chart variation - the Activity meter - has now been promoted to its own chart type. The consequences of this are not large and it means a better grow() animation. You can view the full documentation page here. This chart type now also supports tooltips.
• The Pie chart variation - the Segmented donut chart - has now been promoted to its own chart type. The consequences of this are not large and it means a better grow() animation. You can view the full documentation page here.
• The Pie chart variation - the Horseshoe meter - has now been promoted to its own chart type. The consequences of this are not large and it means a better grow() animation. You can view the full documentation page here.
• The SVG 3D Bar chart tooltips weren't taking into account the 3D effect when being positioned. This has been remedied and the tooltips for 3D charts look much better.
• The property xaxisLabelsClass has been added to the canvas Bar, Line, Scatter, Gantt and Waterfall charts which allows you to add a CSS class to the tooltips. This property is called yaxisLabelsClass with the HBar chart and labelsClass for charts without axes (eg the Rose chart).

January 2021 (v5.27)

• The responsive() function has been rewritten to use the standard window.matchMedia API instead of the window.onresize event. You can read more about this on the RGraph blog . This is a significant change to the responsive() function but the usage of the function has only changed marginally. Now you should list the screen size clauses from largest to smallest like this:

  .responsive([
      {maxWidth: null,width:600,height:250,options:{marginInner: 10,textSize:12}},
      {maxWidth: 800,width:400,height:200,options:{marginInner: 5,textSize:10}}
  ]);

  Otherwise the usage of the function is no different.
• In both the canvas and SVG libraries the String.format() function has been extended. Previously you could do this with the function:

  str        = '{1} works as a {2}';
  name       = 'Richard';
  occupation = 'web developer';
  
  str.format(name, occupation);
  

  And this:

  str        = '%1 works as a %2.';
  name       = 'Richard';
  occupation = 'web developer';
  
  str = str.format(name, occupation)
  

  Now though, as well as that, you can do this too:

  occupation = 'web developer';
  name       = 'Richard';
  str        = '{name} works as a {occupation}'.format();
  

• All of the libraries now accommodate having the data given to them as strings as well as real JavaScript arrays. So RGraph now accommodates this type of thing:

  new RGraph.Bar({
      id: 'cvs',
      data: '4,8,6,5,3,2,5',        // Result: [4,8,6,5,3,2,5]
      // ['5','3','7','2','4'],     // Result: [5,3,7,2,4]
      // ['4,8,6','4,5,2','4,8,6'], // Result: [[4,8,6],[4,5,2],[4,8,6]]
      options: {
      }
  }).draw();

  You should of course give RGraph real JavaScript data structures (arrays containing numbers for example) - this is simply there for ease of use purposes.
• The Horizontal Bar chart now has a tooltipsHotspotYonly option so you can still get at tooltips when the value of a bar is zero.
• The 3D Bar chart hotspots for tooltips are now drawn more accurately which makes clicking on the bars easier.
• The CSV reader has had some aliases added to the getCol() and getRow() API functions. These are:

  csv.row();
  csv.col();
  csv.column();
  csv.getColumn();
  

• The label labelUnitsPre labelUnitsPost labelPoint labelThousand and labelDecimals properties were added to the Horseshoe Meter.
• The RGraph.redraw() API function can now accept a canvas as the argument (as well as a color) to limit the clearing to a specific canvas tag. For example:

  RGraph.redraw();                // Pre-existing usage
  RGraph.redraw('red');           // Pre-existing usage
  RGraph.redraw(myCanvas);        // New addition
  RGraph.redraw(myCanvas, 'red'); // New addition
  

• Fixed a bug with the Bar chart grow effect when supplying data to it. It wouldn't respect a maximum Y scale value that you had set.
• The properties tooltipsFormattedListType and tooltipsFormattedListItems have been added to both the canvas and SVG chart types (those that support tooltips). These two properties give you the ability to easily show HTML lists (either ordered or unordered) in your tooltips by using the %{list} macro. There are demos available of charts that use lists in tooltips in the download archive.

You can download RGraph here