Scatter plot (#341)

* Scatter plot

Add advanced setting to line charts to turn it into a scatter plot

* Scatter plot

Add advanced setting to line charts to turn it into a scatter plot

* Added docs and refactored settings retrieval

---------

Co-authored-by: Harold Agudelo <[email protected]>
Co-authored-by: Niels de Jong <[email protected]>

Author: 3 people

docs/modules/ROOT/pages/user-guide/reports/line-chart.adoc

@@ -45,6 +45,8 @@ image::line2.png[Multi Line Chart]
 [width="100%",cols="13%,2%,6%,79%",options="header",]
 |===
 |Name |Type |Default Value |Description
+|Plot Type |List |line | Whether to use a line plot (with connections) or a scatter plot of disjointed points
+
 |Show Legend |on/off |off |If enabled, shows a legend at the top right
 of the visualization.
 

src/chart/line/LineChart.tsx

@@ -45,7 +45,7 @@ const NeoLineChart = (props: ChartProps) => {
   const marginLeft = settings.marginLeft ? settings.marginLeft : 36;
   const marginTop = settings.marginTop ? settings.marginTop : 24;
   const marginBottom = settings.marginBottom ? settings.marginBottom : 40;
-  const lineWidth = settings.lineWidth ? settings.lineWidth : 2;
+  const lineWidth = settings.type == 'scatter' ? 0 : settings.lineWidth || 2;
   const pointSize = settings.pointSize ? settings.pointSize : 10;
   const showGrid = settings.showGrid != undefined ? settings.showGrid : true;
   const xTickValues = settings.xTickValues != undefined ? settings.xTickValues : undefined;

src/config/ReportConfig.tsx

@@ -636,6 +636,12 @@ export const REPORT_TYPES = {
     },
     maxRecords: 250,
     settings: {
+      type: {
+        label: 'Plot Type',
+        type: SELECTION_TYPES.LIST,
+        values: ['line', 'scatter'],
+        default: 'line',
+      },
       backgroundColor: {
         label: 'Background Color',
         type: SELECTION_TYPES.COLOR,