Release notes for 2026

• March 2026 (v7.11)
• January 2026 (v7.10)

March 2026 (v7.11)

• The front page has undergone a few changes in order to try and make the page a little more mobile-friendly. The website doesn't receive that many mobile visitors but Google does favour it these days.
• The Dumbbell variant has been added to the both the canvas and the SVG Bar and Horizontal Bar charts. This allows you to switch regular Bar and Horizontal Bar charts to Dumbbell charts with just a single option. There are demos of the new Dumbbell charts in the download archive. You can also see an example of a Dumbbell chart on the RGraph blog.

January 2026 (v7.10)

• The RGraph.addCss internal function has been updated. This function is used by the Datagrid.
• The Datagrid column sort indicators are now shown on the right-hand-side of the column header text label instead of being right-aligned in that particular column.
• The Datagrid search now uses better splitting functionality that allows you to use quotes around your search terms to enable you to use spaces in them if you want. for example you can search for any of these terms if you want to:
  • jacob
  • jacob barroff (no quotes - searches for both words)
  • "jacob barroff" (quoted - so it searches for the one phrase)
  Use the demos/datagrid-search.html demo in the download archive to try these searches out.
• The Datagrid search now has a little magnifying glass icon in the search box that allows you to click to trigger a search as well as pressing the enter key on your keyboard.
• The Datagrid now has a searchFocus property so that you can easily disable the search input from being focused if you need to. If your Datagrid is initially offscreen when the page loads, if the search is focused it can make the page jump.
• On all chart types (both canvas and SVG) that have tooltips, the highlight that you see when you click a bar/segment/line etc now fades in instead of being instantly shown. You can disable the fade and revert to the prior behaviour by setting the highlightFade property to false.
• Both the internal and external functions have been moved away from using an object based format for arguments back to a normal one. This should help speed up the rendering of charts though you may only notice it if you use animations - which may be smoother. If you use any member or API functions then you might need to change the arguments to the functions to the separate, traditional style instead of being objects (IMPORTANT: There are exceptions to this - notably the RGraph.linearGradient and RGraph.radialGradient functions which continue to use an object format for their arguments). Here's an example of the object style of giving arguments that has been used in RGraph for a number of years now:

  <script>
      var myArray = RGraph.arrayFill({
          array:  [],
          length: this.data.length,
          value:  1
      });
  </script>
  

  And the updated - more traditional way of passing arguments:

  <script>
      var myArray = RGraph.arrayFill([], this.data.length, 1);
  </script>
  

  Not as readable perhaps - but faster and it results in less code and so smaller downloads for your visitors!

• All animations have been standardised to be 1 second in length (though there are a few exceptions to this). So depending on which animation you use it may be a bit faster or slower or it may remain the same. You can set exactly how many frames you want your animation effect to use though by supplying an object to the animation function with a "frames" property. For example (the target is 60 frames per second so this would take roughly two seconds to complete):

  <script>
      new RGraph.Bar({
          id: 'cvs',
          data: [4,8,6,4,2,4,9],    
          options: {
          }
      }).grow({frames: 120});
  </script>
  

• The CSV reader format has changed to this:

  <script>
      new RGraph.CSV('/sample.csv', function (csv)
      {
          // ...
      });
  </script>
  

  Note that the arguments that you pass to the RGraph.CSV object are no longer an object and are instead separate, normal arguments.

• The Line chart growPoint() method has had its argument list changed.
• The canvas core JS file has had extensive alterations to it because of a big tidy up relating to comments and other whitespace.
• There's a new clipping callback function which you can do clipping with instead of calling the start function and then the stop function. You'll see it in the code looking like this:

  <script>
      RGraph.clipTo.callback(this, function (obj)
      {
          // Clipped drawing...
      });
  </script>
  

  It clips to the area/shape as specified by the clip: property in the chart configuration though this can be specified with a third argument - see the API documentation for details.

• The clipping string that you give in the options is now more forgiving in terms of extraneous spaces. So as well as this:

  clip: 'x:-10%-110%'

  You could also do this:

  clip: '  x  :  -10%  -  110%  '

• The canvas charts that support background images (eg Bar, HBar, Line, Scatter) now employ clipping for the background image as well as the main chart.
• When using clipping on your (canvas-based) charts the highlight that is used by tooltips is now clipped as well.
• The internal RGraph.measureText function has had its argument list changed. It now takes:
  • The text to measure.
  • Whether the text is italic.
  • Whether the text is bold.
  • The font used by the text.
  • The point size of the text.

You can download RGraph here