Backwards compatibility

Advisories and notifications of backwards compatibility breaks. Sometimes it is necessary to break backwards compatibility or change the workings of RGraph. Here is a list of such notifications.

Older notes are not available.

April 2022 (v6.07)

• The canvas Horizontal Bar chart has had some work done on it regarding the Y-axis positioning so if you use the Horizontal Bar chart - upgrade cautiously!
• The frame count on the canvas Horizontal Bar chart animations have changed (the grow and the wave effects).

November 2021 (v6.05)

• The minimum and maximum labels on the Semi-circular Progress bar no longer fall back to the scale properties. This is because a proper scale has been added. This applies to both the canvas and SVG versions of the meter.

October 2021 (v6.03)

• Some of the demos were still using the older property name labelsPercent when it should actually be labelsComplete. If you still use the older labelsPercent option you should be aware of this if you upgrade and change to use the newer property name.

August 2021 (v6.02)

• The purpose of this release is because of Google updating the requirements for Google Sheets integration. You now need to update your code if you connect to Google Sheets to retrieve your data. There are detailed instructions on what you now need to do on the Google Sheets integration page.

April 2021 (v6.00)

• This is a significant version increase so you would expect a lot of breaking changes or tweaks - this however is not the case. The purpose of the version increase is because from version 6.01 features from JavaScript ES6 will begin to be used (on an "as and when" basis). JavaScript ES 6 has been with us now for over five years and the likelihood is that your browser will support it since most auto-update these days. If you prefer though the last 5.xx version (which was 5.28) is available from the download page.
• The SVG Scatter chart outofbounds option default has been changed to true.

March 2021 (v5.28)

• The Rose chart property labelsOffset has been renamed to labelsOffsetRadius
• The Radar chart property labelsOffset has been renamed to labelsOffsetRadius
• The RScatter property labelsRadiusOffset has been changed to labelsOffsetRadius
• The Meter chart labelsRadiusOffset property has been renamed to labelsOffsetRadius
• The Meter chart labelsValueText* properties have been renamed 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:

January 2021 (v5.27)

• The responsive() function has been rewritten for this release to use the window.matchMedia function instead of the window.onresize event. This means that media queries are used in place of the onresize event. A consequence of this is that the list of screen size conditions is reversed - and should now be listed 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.

August 2020 (v5.25)

• The tooltips have changed significantly for this release. First of all the default appearance has changed to white on black - you can change this using the tooltipsCss property if you wish. Secondly, the positioning of the tooltips has changed to be static instead of positioned next to the mouse pointer. You can change this with the tooltipsPositionStatic property. And lastly, there's a small pointer added to tooltips now as well. You can disable this with the tooltipsPointer property. You can check the changelog page for details.

April 2020 (v5.23)

• A long-standing bug with angled accessible text has been resolved. However, as a result, if you use angled text your text may need adjusting.
• With the Waterfall getShape() functions return value, the index and the dataset properties have been swapped. This means that the first bar on the Waterfall chart now has a dataset value of 0, the second has 1, the third has a value of 2 etc. The index value of each bar is 0.
• The Rose chart indexes that are returned by the getShape() function have been updated. This may impact your code if you use it. The dataset and the index properties have been swapped for non-equi-angular charts.

February 2020 (v5.21)

• When using the drawing API X-axis and Y-axis objects you should be aware that the color properties have changed. They're no longer called colors - they're now called xaxisColor and yaxisColor and they're not arrays but are now a single color.
• The drawing API Y-axis property yaxisTickmarksAlign is now called yaxisPosition.
• The drawing API X-axis xaxisScaleInvert and xaxisScaleVisible properties have been removed.
• If you use the axes property to turn off both the X and Y axes you will now need to use both the xaxis and yaxis properties.
• The Y-axis title is now placed on the same side as the axis.
• If you use the yaxisLabels property to toggle the Y-axis scale you should now use the yaxisScale property instead.
• The *axisScaleZerostart properties for scales have been removed.
• The Line chart property yaxisScaleInside has been removed.
• On a Horizontal Bar chart if you use the property xaxisLabels to turn the labels off you may now need to use the xaxisScale property as well.

December 2019 (v5.2)

• The Bar chart axesColor axesLinewidth and axes properties are currently in a state of flux - ie they're in the middle of being removed and replaced with axis-specific properties. This means that in this release you'll need to add the following to your chart configuration to remove both of the axes:

  axes: false,
  xaxis: false,
  yaxis: false
  

  And to specify the linewidth for the axes you'll need to do this:

  axesLinewidth: 5,
  xaxisLinewidth: 5,
  yaxisLinewidth: 5,
  

  And to specify the color you'll need this:

  axesColor: 'red',
  xaxisColor: 'red',
  yaxisColor: 'red',
  

• The tag that's used for the X-axis labels has changed from labels to xaxis.labels If you use this you'll need to update your code.
• The Semi-circular Progress bar has had the names of the indexes changed that are returned by the getShape() function. You can see what they now are by examining the Semi-circular Progress API documentation
• The Scatter chart getShape() indexes for boxplots have been updated. So if you use these you may need to update your code.
• The Pie chart and the Rose chart shape object index names have been changed: angle.start is now angleStart, angle.end is now angleEnd, radius.start is now radiusStart and radius.end is now radiusEnd You'll need to adjust your code accordingly if you use these properties. They were changed so that they worked better as object property names.
• The shape objects that are returned by each objects getShape() function do not now return any numeric indexes - so the only indexes that are returned are textual ones. This will make your code easier to read and understand. For example, the Bar chart now returns:

  var shape = obj.getShape(e);
  
  
  // If a bar/segment is matched the shape object will contain these indexes:
  //
  // shape.object          // The RGraph Bar chart object
  // shape.x               // The X coordinate for the rectangle
  // shape.y               // The Y coordinate for the rectangle
  // shape.width           // The width of the rectangle
  // shape.height          // The height of the rectangle
  // shape.dataset         // In a regular Bar chart the dataset is the same as the sequentialIndex
                           // In a grouped or stacked Bar chart it pertains to the group of values.
  // shape.index           // In a regular Bar chart the index is always zero whilst in a grouped
                           // or stacked chart it pertains to the Bar in the relevant group
  // shape.sequentialIndex // This is the sequential index of the bar/segment.
  // shape.tooltip         // The corresponding tooltip for the Bar or segment.
  

  Other charts will return different indexes and you can see what they are by inspecting the shape object in your browser's JavaScript console (ie console.log(shape);).
• The RGraph.filledCurvyRect() and RGraph.strokedCurvyRect() functions have been renamed to RGraph.roundedRect(). To use this function you need to do the fill() and/or stroke() yourself like this:

  context.beginPath();
  context.strokeStyle = 'red';
  context.fillStyle   = 'black';
  RGraph.roundedRect({
      context: context,
            x: 50,
            y: 50,
        width:100,
       height: 100,
       radius: 25
  });
  context.stroke();
  context.fill();
  

• The RGraph.linearGradient() function has had its argument list changed. It should now only be called using the object notation like this:

  RGraph.linearGradient({
      object: obj,    // The chart object
      x1: x1,         // The start X coordinate
      x2: x2,         // The end X coordinate
      y1: y1,         // The start Y coordinate
      y2: y2,         // The end Y coordinate
      colors: colors  // An array of colors to use in the gradient
  });
  

• The RGraph.radialGradient() function has had its argument list changed. It should now only be called using the object notation like this:

  RGraph.radialGradient({
      object: obj,    // The chart object
      x1: x1,         // The start X coordinate
      x2: x2,         // The end X coordinate
      y1: y1,         // The start Y coordinate
      y2: y2,         // The end Y coordinate
      r1: r1,         // The start radius
      r2: r2,         // The end radius
      colors: colors  // An array of colors to use in the gradient
  });
  

October 2019 (v5.11)

• The SVG tooltips have had the line-height CSS property default changed to initial
.

September 2019 (v5.1)

• Please see the changelog for a list of changes that have been made to the libraries concerning the removal of older compatibility code.
• The Odometer property tickmarks has been changed to be disabled by default.
• The Odometer property tickmarksHighlighted has been changed to be enabled by default.
• The Odometer border property has been changed to be enabled by default. You may need to turn this off if you use a background image.
• The exec* option that you could add to your configuration, that executed a function there and then, has been removed. The exec() function has NOT been removed and can still be used.
• The RGraph.text() function should now be referred to as RGraph.text() It should now also use only one argument like this:

  RGraph.text({
      object: obj,
      x: 50,
      y: 50,
      text: 'Some text'
  });
  

  Going forward, more and more functions will use this format for arguments (ie using a single object map instead of true multiple arguments.

August 2019 (v5.1)

• It shouldn't cause any issues for you - but I've added RGraph.text() as an alias to RGraph.text2()

May 2019 (v5.01)

• The hmargin property has been changed across all libraries to marginInner. As well as this, the hmarginGrouped property has been changed to marginInnerGrouped. You will need to change your code if you're setting this property otherwise it will revert to the default value.
• The sketch variant of the Bar chart has been updated to better respect the marginInner setting. There are two examples of this type of Bar chart in the demos in the download archive:
  • bar-sketch.html
  • bar-sketch-wedding.html
• The canvas RGraph.parseDate() function has been updated to support more date/time formats - so if you use Scatter chart date/time charts or if you use this function you should check that your charts are OK. You shouldn't notice any difference though.
• The Waterfall chart textAngle property to xaxisLabelsAngle. You will need to update your code appropriately.
• The labelsAbove option for specifying a separator was spelled incorrectly and is now called this: labelsAboveSeparator

January 2019 (v5.00)

• This is big update - hence the version bump to 5.00. All of the chart types - both SVG and canvas - have been affected. Read about it on the RGraph blog.
• The Pie chart option labelsSticksUsecolors has been removed. You can still change the colors of the labels but as a whole (all of the labels) and not so that they match the colors on the charts.
• The labelsCenter option should now be the literal string that you want to show in the center of the Pie chart.
• The canvas Pie chart labelsSticksList property now defaults to true.
• The canvas Semi-circular Progress labelsMinOffsety and the labelsMaxOffsety options now both default to 5 instead of 0.
• The Pie chart option labelsSticksUsecolors has been removed.

February 2018 (v4.66)

• The SVG Line chart no longer sets the yaxisScaleMax or the yaxisScaleMin properties when they've been worked out.

November 2017 (v4.65)

• The Scatter chart coordinates have been significantly changed - you can read about them on the Scatter chart documentation page.
• All of the SVG charts have had the properties adjusted that are held in the obj.coords variable - specifically the object variable is now the RGraph object and the element variable is the SVG element that the coordinates represent. Each chart type's documentation page now details the coordinates.
• The canvas Bipolar chart has had a lot of work done to it this month. As well as now supporting grouped and stacked charts (plus 3D variants of both) the coordinates have been overhauled. You can read details of the Bipolar coordinates at this link.

August 2017 (v4.63)

• One of the canvas Pie chart default values was incorrect - the labelsSticksUsecolors value was true when the correct default is false. This has now been corrected.
• The format of the HTML key table ID has changed. They now look like this: rgraph_key_e80a6674-488f-4e39-b022-314b9129d395 and are returned by the HTML key function.

October 2016 (v4.58)

• Formerly the Bubble chart draw() function returned the underlying Scatter chart object. This has now changed so that the Bubble chart is returned.
• The color handling that the Horizontal Bar uses has changed. You may need to update your code accordingly. The colors are now used from the top down.

August 2016 (v4.57)

• My hosting had "a bit of funny turn" in August so please let me know if things don't work as expected.
• Previously, when you adjusted the Bar chart the bar being adjusted was the one under the mouse pointer - regardless of whether it was under the mouse pointer when you pressed the mouse button down. Now though the bar being adjusted remains being the one that you clicked on, regardless of whether you move the mouse left or right. There's an example of adjusting the Bar chart in the download archive (bar-adjustable.html).

July 2016 (v4.56)

• The textAccessiblePointerevents has had its default changed to true. You can change it back to false if you prefer it that way. This change makes it far easier to select and copy text if required.
• The Bar chart color defaults have been updated so if you don't set the colors yourself they may well change.
• Each get() method of the libraries has been updated to use a slightly different way of parsing property names.
• The handling of decimal scales (eg 0, 0.02, 0.04, 0.06, 0.08, 0.10) has changed and they're no longer represented in exponential format.
• Scaled charts (including the drawing API X/Y axes) no longer have decimals appended to the zero value (eg Bar, Line, Scatter, Horizontal Bar, Waterfall). They also no longer use scientific notation (eg 5e3 ).
• The Horizontal Bar default colors have been changed to: ['red', 'blue', 'green', 'pink', 'yellow', 'cyan', 'navy', 'gray', 'black'] (no gradients)
• The Bar chart shadow default has been changed to false
• The Bar chart colors have been changed to: ['red', '#0f0', 'blue', 'pink', 'orange', 'cyan', 'black', 'white', 'green', 'magenta']
• The colors of the Waterfall chart have been changed from gradients to solid colors (green, red, blue)

June 2016 (v4.55)

• Only the grid is now cached in the background drawing function. This shouldn't affect anything that you see but should cure a few obscure bugs.
• The option textAccessiblePointerevents now defaults to false
• The textAccessible option now defaults to true. You may need to disable this in a few circumstances (eg 3D Pie charts).
• Scaled charts are slowly being converted to have their scaleZerostart option to be enabled by default.
• The Pie chart default colors have been changed to solid (ie not graduated) versions of themselves
• The Bipolar scaleZerostart option now defaults to true.
• If you're manipulating the textAccessible <span> nodes then you need to know that the format for their IDs has changed and had an extra underscore added. An example ID is now: 82_25_100_cvs so the format is now X_Y_text_id - the X and Y coordinates of the text, the text that is shown within the <span> and the canvas ID.
• The Bar chart animation functions now turn off the labelsAbove option whilst animating and turn it back on when done. By doing this performance is noticeably improved - particularly when using the textAccessible option.
• The RGraph.path() API function has been updated. It is now faster and more versatile. See the API documentation for more details.
• With the Bar chart sketch variants, the bars are now drawn before the axes.
• The Line chart property scaleZerostart now defaults to true.
• The Scatter chart property scaleZerostart has been added and defaults to true. Therefore, you might see a zero now if you upgrade.
• Some of the Bar chart defaults have changed. The strokestyle option is now rgba(0,0,0,0), scaleZerostart is now true and the shadow option is now false.
• The tooltips no longer have a small pointer image underneath them. The positioning of the tooltip remains the same.
• Some of the Bar chart defaults have changed. The strokestyle option is now rgba(0,0,0,0), scaleZerostart is now true and the shadow option is now false.

April 2016 (v4.54)

• The Line chart lineVisible property is now an array instead of a boolean to accommodate the ability to show or hide individual lines. But you shouldn't set the property directly - use the hide(index), show(index) functions. There's also a visible(index) function.
• The clearto option now has a default of rgba(0,0,0,0) - this means that if you clear the canvas to a color (instead of it clearing to transparency) in effects and now it unexpectedly goes to transparent you may need to set the clearto option on your object to black (or whatever your chosen color is).

October 2015 (v4.50)

• Important Microsoft Internet Explorer 7 and 8 are no longer supported. As such ExCanvas has been removed from the archive. So now the minimum version of Internet Explorer that's supported is version 9.
• The Line chart trace() effect is being removed - please use the trace2() effect instead. The trace2() effect does not require jQuery.
• The Bipolar now has a background grid enabled by default. You can turn it off though with the backgroundGrid property
• The Bipolar function redrawBars() has been removed
• The Gantt chart background grid has changed - you can control how many grid lines there are with these properties:
  • backgroundGridHlinesCount
  • backgroundGridVlinesCount

August 2015 (v4.32)

• Because the Bar chart 3D effect is different now you might well need a larger bottom margin.
• The Radar chart labels are no longer boxed by default. The order of the Radar chart internals has changed - labels are now drawn AFTER the chart itself so that the labels appear ON TOP of the chart. The code that draws the Radar chart axis labels has also been updated so that the labels now have a white semi-opaque background to them. This enhances readability.
• With the new style properties (eg backgroundGridColor instead of background.grid.color) it means that property names are no longer case insensitive. So use them as they're documented - ie don't add your own upper case characters as you wish. The case now matters.
• The Line chart labels.above option no longer uses units.pre or units.post - they use the separate labels.above.units.pre and labels.above.units.post
• The registry palette entry (which is the annotating palette DIV) is now called chart.palette (ie it has the chart. prefix like other registry entries)

June 2015 (v4.30)

• instead of using dots to separate the various parts of the configuration names (eg text.size and text.color) you can now instead use capital letters (eg textSize and textColor). The rest of the configuration name should be lower-case. This does mean that if you use upper case in your configuration names at present you'll need to stop and also change what you have. You can mix 'n' match configuration styles if you wish but I wouldn't recommend it. This is not a change that you need to rush and switch to - it's simply an alternative configuration method