Version 6.13 of RGraph is now available

The latest version of RGraph - version 6.13 - is now available to download from the download page. What's new in this release?

• The svg Scatter chart now has a trace effect just like the Line chart. This may look strange when you're using the Scatter chart to produce a vertical Line as it always animates from left to right. However, when you're producing a Vertical Line chart then you may want to instead look at using the Horizontal Bar chart. You can read the relevant properties on the svg Horizontal Bar chart api documentation page and there's a blog article (with an example) about producing a Vertical Line chart here.
• Fixed a missing background grid line in the canvas Horizontal Bar chart which became apparent when the X-axis was turned off.
• A significant change to the way that you specify the responsive clauses on your chart (though this change doesn't at all mean that you have to alter all of your charts). The change is how you specify the responsive clauses when you define your chart - you can now put them in the main configuration of the chart instead of calling the responsive function after you call the draw function. The code shown below highlights the new way that you can put the responsive clauses.

  <script>
      new RGraph.Bar({
          id: 'cvs',
          data: [12,18,10,9,6,20,18],
          options: {
              yaxisScaleUnitsPost: 'k',
              colors: ['red'],
              title: 'A basic responsive Bar chart',
              titleBold: true,
              xaxis: false,
              yaxis: false,
              marginLeft: 50,
              marginBottom: 50,
  
              //
              // The new way of specifying your responsive clauses
              //
              responsive: [
                  {maxWidth: 900,  width: 400, height: 150, options: {textSize:10, xaxisLabels: ['Mon\n(yuck!)','Tue','Wed','Thu','Fri\n(woo!)','Sat','Sun'], marginInner: 10}},
                  {maxWidth: null, width: 750, height: 250, options: {textSize:14, xaxisLabels: ['Monday\n(yuck!)','Tuesday','Wednesday','Thursday','Friday\n(woo!)','Saturday','Sunday'], marginInner: 20}}
              ]
          }
      }).draw();
  </script>
  

  This change isn't at all mandatory - you can still use the existing method if you prefer - it's your choice!
• The svg Gauge chart now has a simple background grid effect (just some lines that emanate from the center out to the edge.) You can disable it if you want to and also stipulate the color.
• The canvas Line chart trendline now animates as well as the line if you use the trace animation effect.
• The responsive function had a small bug in it that prevented the setting of new colors in an updated configuration. This has been fixed.
• The Bar chart labelsAbove property, for some time now, has not been showing decimals correctly. This has now been remedied so that what you specify with the property labelsAboveDecimals will be what you see. The positioning of the labels has also been slightly adjusted - so you might need to reduce or remove entirely any labelsAboveOffsety that you may have set.
• A new color macro has been added to formatted tooltips:
  • %{color:red}
  • %{color:%{property:myColor}}
  • %{color:%{property:colors[%{dataset}]}}
  • %{color:%{property:colors [%{index}]}}
  This new macro allows you to add a small square of color, like in the key, which allows you to create your own, custom key.
• The Horizontal Bar chart has been able to have rounded ends for some time - however, the feature only worked when you had a regular chart with the Y-axis on the left-hand-side. Now, however, you can have rounded ends to your bars regardless of where the Y-axis is or whether you have a regular, stacked or grouped chart.
• You can currently have rounded corners on your Bar chart by setting the corners property to round - you can now control whether the left and right corners are rounded individually with the cornersRoundLeft and cornersRoundRight properties. You can also set the radius of the corners individually as well with the cornersRoundLeftRadius and cornersRoundRightRadius properties.
• A new feature has come to the canvas Scatter chart - the lasso options. These options, when enabled, allow you to draw rectangles around some (or all) of the points on your chart. A callback function is then called which is passed a list of the selected dataset and index numbers which you can use to integrate into your own code. The feature is mentioned in the documentation page here and the API documentation for the Lasso feature is here. It can also make use of the window.localStorage variable to enable easy persistence across page refreshes.
• Added the highlightDatasetEvent property to the canvas Line chart which defaults to click. You can set this to mousemove to change the event that highlights the relevant dataset.
• Added the missing annotating properties to the canvas Gauge chart documentation
• Added the Semi-circular Progress property backgroundBackdrop
The RGraph.common.core.js library now contains a new function: RGraph.arrayRemoveNull This function does what the name suggests and when you pass it an array the null values in the array will be removed. By default, objects aren't touched however if you give an object as the second argument which has the key objects (for example RGraph.arrayRemoveNull(myArray, {objects: true})) then null values will be removed from objects too. If you give a value parameter to the options array, null values will NOT be removed, but substituted with that value instead. You can see the api docs for the RGraph.arrayRemoveNull function here.
• The canvas Pie chart now has a new set of labelsInside properties for use when you're showing a Donut chart. These properties allow you to show labels inside the Donut ring - instead of traditional labels which are placed around the outside of the Donut.

The full changelog can be read here: https://www.rgraph.net/changelog.html You can download RGraph from the download page: https://www.rgraph.net/download.html#stable And you can leave a review for RGraph (please do!) here: https://g.page/r/CZFVpcu0qadyEBM/review