Release notes for 2017

• November 2017 (v4.65)
• October 2017 (v4.64)
• August 2017 (v4.63)
• May 2017 (v4.62)
• February 2017 (v4.61)
• January 2017 (v4.60)

November 2017 (v4.65)

• Added an svg HOWTO that demonstrates how to create a stacked and grouped Bar chart. You could use the same technique with the canvas libraries
• Added Error bars to the
  • Bar
  • Line
  • Scatter
• Tooltip highlighting has been fixed for when tooltipsOverride is in use.
• Added the missing Bubble chart properties to the documentation for the SVG Scatter chart.
• The Scatter chart now supports having an x-axis scale instead of labels. The options for it are documented in the X-axis section of the Scatter chart documentation. This makes it possible to have a Vertical line chart.
• The highlights for most of the charts now do not accept pointer events. This means that they are "transparent" to the pointer and the event is "passed through" to the element underneath. In practice, this means that the highlight elements are simply not clickable.
• Added the yaxisLabelsHalign and yaxisLabelsValign properties to the svg y-axis function. So charts that use this for generating Y axes (currently the Bar, Horizontal Bar, Line, Scatter and Waterfall charts) will now support this property.
• Before this version, RGraph would create an svg tag inside the container div and set the container div tags css position: to relative. Now it will only set the position of the container div to relative if it isn't already set to absolute, sticky or fixed.
• Fixed an error with filled lines and grouping. In multiple-dataset Line charts, some lines were appearing over previous fills when they should have been appearing under.
• Fixed a bug with api function RGraph.SVG.arrayFill where zero was used as the value - it was using null instead of zero.
• The svg Waterfall has had a bug fixed that presented itself when you had set the total option to false.
• The canvas Waterfall chart labels are now aligned to the top so you can use carriage returns in the labels if you wish.
• The svg Line chart now has a stepped option.
• The Rose chart labels have been tweaked slightly to get rid of an error - you shouldn't notice any difference though.
• Each svg chart type has had the coordinates that it keeps checked and, where appropriate, an obj.coords2 array has been added. These are the same coordinates as the obj.coords array but instead of being indexed sequentially, they're indexed by group index. For example, in a grouped Horizontal Bar chart the second bar in the third group (where each group has two bars) would be: obj.coords[5] and obj.coords2[2][1]. Notably: The Scatter chart coordinates have been significantly changed - you can read about them on the Scatter chart documentation page.
• Added the SVG Bipolar chart. It supports regular, stacked and grouped options.
• Added a new demo that shows off the css3 animate library.
• Added an SVG HOWTO document that details the new SVG RGraph.SVG.text.find function which can be used to find text nodes that have been added to your chart. You can see the document here.
• Changed the key documentation page over to use the up-to-date layout format for the properties documentation.
• Updated the RGraph.SVG.text function to support carriage returns. So you can now put \r\n characters in your labels and you'll see a line break.
• Added the labelsAboveLast* properties to the svg Waterfall chart that allow customisation of just the last label. You can see an example of it here.

October 2017 (v4.64)

• Added a section to the installation docs about integrating RGraph with your own data structures.
• The svg drawTitle function has been updated. Now, unless specified otherwise, the subtitle will be placed underneath the title. You can use the titleSubtitleX and titleSubtitleY properties to change the positions. The titleX, titleY, titleSubtitleX and titleSubtitleY properties can now be given as strings (eg '+20' or '-5') and they will be added to the calculated positions to allow for adjusting as well as absolute specification.
• Added an SVG HOWTO document about how to turn your labels into links. It's very similar to the canvas version and uses jquery to make things easier. If you prefer a different javascript library than jquery you shouldn't have much difficulty in adapting it.
• Added a canvas HOWTO document that shows you how to turn your labels into links. It's only relevant if you're using the textAccessible option - but this is the default now and has been for a few versions.
• Added link and linkTarget options to the RGraph.SVG.text function so you can very easily make any text that you add to your svg charts links. You'll probably also want to set the color option to blue so that the text is recognisable by users as a link that can be clicked. Some example code that creates a clickable link is (assume that the myObj variable is your chart object):

  RGraph.SVG.text({
      object: myObj,
      text: 'Some text that\'s linked',
      parent: myObj.svg.all,
      color: 'blue',
      x: 300,
      y: 150,
      valign:'center',
      halign:'center',
      link: 'http://www.google.com',
      linkTarget: '_blank', // This is the default
  });
  

• Added a new needle type to the Meter chart which you can set using the needleType property. Set it to pointer. You can see a demo of it in action by viewing the meter-needle.html demo page in the archive.
• The labelsAbove feature has been added to the Scatter chart. You can read about it in the Scatter chart documentation. You'll also find some example code of it there.
• The svg Pie chart has had labelsIngraph added. See the documentation page for a reference to the various properties.
• The canvas Line chart filledAccumulative demonstration has been updated to look a bit nicer.
• To enable far better caching with HTTP2 The libraries have been separated into their own script tags. Eg:

  <script src="/libraries/RGraph.common.core.js"></script>
  <script src="/libraries/RGraph.common.sheets.js"></script>
  <script src="/libraries/RGraph.bar.js"></script>
  <script src="/libraries/RGraph.line.js"></script>
  

  Note: The combined.html file used to combine multiple files into one - but now it does other things too.
• Added the labelsValueTextActual property to the canvas Gauge chart. This can be used when your value is above the max so the needle shows 100 (for example) but the actual value is 143. Setting this property to true will mean 143 gets displayed as the value (when the labelsValueText option is being used).
• Added the keyColorShape property to the canvas key library.
• Previously the Bipolar coordinates were a bit hit and miss - now they've been cleaned up and should be far more accurate. There are now six coordinates arrays that you can use:
  • obj.coords
  • obj.coordsLeft
  • obj.coordsRight
  • obj.coords2
  • obj.coords2Left
  • obj.coords2Right
  The difference between the obj.coords and the obj.coords2 arrays is how they are indexed. ie All the coordinates are just appended to the obj.coords array and the relevant obj.coordsLeft or obj.coordsRight array. However, the obj.coords2 arrays are for stacked and grouped charts only and the first element of the obj.coords2 array Contains the coordinates for the first stack/group. The second element of the obj.coords2 array contains all of the coordinates for the second stack/group and so on.
• Added a number of text and labels configuration parameters to the canvas Bipolar chart (a few of these properties may already exist): marginCenterAutosize, title, titleBold, titleItalic, titleFont, titleSize, titleColor, titleLeft, titleLeftBold, titleLeftItalic, titleLeftFont, titleLeftSize, titleLeftColor, titleRight, titleRightBold, titleRightItalic, titleRightFont, titleRightSize, titleRightColor, textFont, textColor,textSize, textBold, textItalic, noyaxis, noxaxis, labelsAbove, labelsAboveSize, labelsAboveColor, labelsAboveItalic, labelsAboveBold, labelsAboveFont, labelsAboveUnitsPre, labelsAboveUnitsPost, labelsAboveDecimals, labelsAboveFormatter, labelsBold, labelsItalic, labelsFont, labelsSize
• The Bipolar chart can now show grouped values.
• The Bipolar chart can now show stacked values. Both the stacked and grouped Bipolar charts support the grow and wave() effects.
• Optimised the front page more. It now weighs in at a svelte 274k - which when I first started in web development would have been obscenely large - but now - it's on the slim side.
• Ensured that each relevant svg chart type has tickmark controls for the axes. These may be (depending on the chart type):
  • xaxisLabelsPositionSectionTickmarksCount
  • xaxisLabelsPositionEdgeTickmarksCount
  • yaxisLabelsPositionSectionTickmarksCount
  • yaxisLabelsPositionEdgeTickmarksCount
  See each chart type's documentation page to determine which one to use.
• Added the colorsSequential option to the canvas Waterfall chart.
• I've added a search button to the forum which takes you to Google with the relevant search terms in place so that you can just search the RGraph forum.
• Improved the forum paging so that now, it defaults to showing 50 messages but you can also view in 500 message blocks.

August 2017 (v4.63)

• Added the labelsValueTextActual option to the Gauge chart which allows you to display the actual value that you passed to the Gauge regardless of the upper/lower limits. Thanks to Graeme Elsworthy.
• Corrected a Pie chart default setting: Changed labelSticksUsecolors to default to false
• Added these properties after a code submission from Graeme Elsworthy:
  • labelsValueTextFont
  • labelsValueTextSize
  • labelsValueTextItalic
  • labelsValueTextBold
  • titleTopItalic
  • titleBottomItalic
  • labelsValueTextDecimals (documented)
• Fixed a bug in the svg Bar wave function that prevented this combination svg-bar-3d-grouped-negative.html of 3D and offset x-axis from being drawn correctly. As you can see it works OK now.
• The canvas Line chart ingraph labels now switch their alignment from above to below if the Y coordinate starts off the top of the canvas. Unless you specifically specify the alignment - in which case your setting is respected. Thanks to Anthony Kuma for some code (and the motivation) to make this change.
• When using an X scale with the canvas Scatter chart, the labels will now respect the textAngle setting.
• If a (canvas) line is currently hidden it no longer returns anything for the getShape function. So tooltips won't be triggered for hidden lines for example.
• Fixed a bug in the 3D Bar chart with an offset x-axis where negative bars were drawn on top of the x-axis.
• Added key support, which was missing, to the canvas Waterfall chart.
• Added the textAngle property to the Horizontal Bar for the X labels.
• Updated the example code for the getShape function on this documentation page: https://www.rgraph.net/canvas/line.html#getshape. Thanks to Zsolt for the updated code.
• The html key IDs are now far more unique - so using multiple html keys on the same page is easier. The new IDs look like this: rgraph_key_e80a6674-488f-4e39-b022-314b9129d395 and are returned by the html key function.
• Added two new properties to the Scatter chart: crosshairsCoordsFormatterX and crosshairsCoordsFormatterY. These are functions that you can specify, that format and return the value exactly as you wish. There's an example of these two new properties being used with a date/time Scatter chart in the download archive: scatter-crosshairs-datetime.html
• The keyColorShape option can now be a function. This allows you to create your own blob shapes. The function is passed a single argument - an object consisting of the following properties:
  • object
  • color
  • x
  • y
  • width
  • height
  You could for example do this:

  keyColorShape: ['rect','line','circle', function (opt)
  {
      var co = opt.object.context;
      
      opt.object.path(
          'b m % % l % % l % % c f %',
          opt.x,             opt.y,
          opt.x + opt.width, opt.y,
          opt.x,             opt.y + opt.height,
          opt.color
      );
  }]
  

  This has been implemented for both graph and margin key types (for canvas charts).
• A gradient bug has been fixed when multiple gradients are being used across multiple objects.
• The background color for charts such as the Bar chart Line chart Scatter chart and the Waterfall chart no longer includes the margins.
• Added support for dotted and dashed background grids to the svg Bar, Horizontal Bar, Line, Scatter and Waterfall charts. If you don't like the default dotted and dashed options you can define your own style using the backgroundGridDashArray property.
• Added support for defining global configuration values that are assigned to all subsequently created chart objects. It looks a little something like this:

  // These configuration values get inherited by ALL subsequently instantiated RGraph objects
  RGraph.SVG.GLOBALS = {
      colors: ['pink'],
      marginInner: 15,
      backgroundGridVlines: false,
      backgroundGridBorder: false,
      backgroundGridLinewidth: 3,
      xaxis: false,
      yaxis: false
  };
  
  new RGraph.SVG.Bar({
      id: "cvs1",
      data: [4,8,6,3,5,2,4]
  }).draw();
  
  new RGraph.SVG.Bar({
      id: "cvs2",
      data: [1,5,3,2,6,8,4]
  }).draw();
  

• A few libraries that weren't minimised by my release script are now. Not that this will affect you in any way.
• An SVG Funnel chart has been added. Funnel charts can show the loss or gain (usually a loss) of a quantity as a process progresses.
• A HOWTO document that describes the new SVG background layers that charts now create has been added.

May 2017 (v4.62)

• Added a donut api function - which is an easy way to draw a complete donut.

  path = RGraph.SVG.donut({
          svg: obj.svg, // The SVG element as returned by document.getElementById()
           cx: 200,
           cy: 100,
       stroke: 'black',
         fill: '#eee',
  innerRadius: 35,
  outerRadius: 75
  });
  

• The svg 3D Bar chart now supports having the x-axis in an offset position.
• Added a contributions section to the About page. There are only two contributors listed there at the moment. If I've missed you out and you've fixed bugs in the past - please let me know so that I can add you.
• Added a footer bar to the website.
• Added an SVG Rose chart. It can do regular Rose charts, stacked Rose charts, non-equi-angular charts and stacked non-equi-angular charts.
• Added a key to the svg libraries. It's quite simple at the moment in terms of the available configuration options.
• In a stacked 3D svg Bar chart little white gaps used to appear - this has been fixed. Other fixes have also been added to the chart.
• The svg Radar chart now has a trace effect which you can use in place of the draw function.
• A small but significant change to the Horizontal Bar: The labels might change the order that they're used. They shouldn't, but they might.
• The documentation layout has changed to a more tabular and compact layout. You can still get to the old format though if you prefer it by using the controls above the list of properties. Thanks to Amjad Moghul for the layout (and the prod to do it!).
• Descriptions on menus have been fleshed out a little.

February 2017 (v4.61)

• Fixed a clipping bug with the outofboundsClip option and filled Line charts
• The RGraph blog now shows entries on a per-year basis instead of all on one page.
• The svg Bar and Horizontal Bar charts have had scale modifications done to better support different combinations of values (positive/negative etc).
• Fixed a bug in the canvas Thermometer chart getYCoord function.
• The svg parseDate function now handles lots of different formats. eg (this is not a comprehensive list):
  • 2012-01-06 12:14:12
  • 6 Jan 2012 12:14
  • 31st January 2012 12:14:12
  • 31st January 2012
  • 31st January
  • January 31
  • 2012 January 31
• The installation/setup documentation has now been moved out of the canvas section and into its own folder (/install/index.html) as it applies to both svg and canvas.
• Added the sticks label layout for Pie charts. This new layout is now the default, but you can disable it by using the labelsSticks option.
• The SVG Bar chart, the SVG Horizontal Bar chart and the SVG Radar chart all now use the dom2 addEventListener to add tooltip event listener functions instead of dom1.
• Added the wave effect to the svg Bar chart
• Added the wave effect to the svg Horizontal Bar chart
• Added and documented labelsAbove to the svg Bar chart
• Added and documented labelsAbove to the svg Horizontal Bar chart
• Added and documented labelsAbove to the svg Line chart
• The svg Pie chart now has a donut chart option.
• The svg tooltips now no longer simply fade in - but using a css transition they slide from the previous tooltip position to the new. If there's no previous tooltip position then it slides to where it should be from the top left of the screen. As a result, the tooltipEffect option has been removed.

January 2017 (v4.60)

• Added svg Horizontal Bar chart. The Horizontal Bar chart can be configured to appear as a horizontal progress bar. Similarly, the Bar chart can be configured to appear as a vertical progress bar. There are demos of both in the download.
• Added svg Radar charts
• Added svg Semi-circular Progress
• Added rect, endrect, filledrect, and filledendrect style tickmarks.
• Added angled accessible text to the canvas libraries. This should be considered BETA quality code at the moment, but it seems to be OK. You may need to use the labelsOffsety when using this option - particularly if you have multi-line text.

You can download RGraph here