SERV-2286 - refactor charts

src/Views/Limitless/Barchart/Attachments/barchart.init.js

@@ -57,7 +57,7 @@ function set_data(elementObject, callback) {
             let title = elementObject.attr('title') ?? null;
             let colors = JSON.parse(elementObject.attr('colors')) ?? defaultColors;
 
-            let horizontal = (elementObject.attr('horizontal') == 'true' || elementObject.attr('horizontal') == true); // default false
+            let horizontal = (elementObject.attr('horizontal') === 'true' || elementObject.attr('horizontal') === true); // default false
 
             let animationDuration = elementObject.attr('animation-duration') ?? 750;
             // ex '{value} users'  - https://echarts.apache.org/en/option.html#yAxis.axisLabel.formatter
@@ -119,10 +119,10 @@ function setSeries(seriesData, elementObject, horizontal = false) {
     // uses series options if available else use global options.
     let seriesArray = [];
 
-    if(!seriesData || seriesData.length == 0) return [];
+    if(!seriesData || seriesData.length === 0) return [];
 
-    let showBarValues = (elementObject.attr('bar-values') == 'true' || elementObject.attr('bar-values') == true) ?? false;
-    let stacked = (elementObject.attr('stacked') == 'true' || elementObject.attr('stacked') == true) ?? false;
+    let showBarValues = (elementObject.attr('bar-values') === 'true' || elementObject.attr('bar-values') === true) ?? false;
+    let stacked = (elementObject.attr('stacked') === 'true' || elementObject.attr('stacked') === true) ?? false;
     let markLine = elementObject.attr('mark-line') ?? null; // min | max | average
 
     for(let i = 0; i < seriesData.length; i++) {
@@ -273,7 +273,7 @@ function setGlobalTextStyle() {
 
 //#region SUB FUNCTIONS FOR SERIES
 function setMarkLine(series, seriesData, markLine) {
-    if(seriesData.markLine != undefined && ['min', 'max', 'average'].includes(markLine)) {
+    if(seriesData.markLine !== undefined && ['min', 'max', 'average'].includes(markLine)) {
 
         series.markLine = {
             data: [{

src/Views/Limitless/Linechart/Attachments/linechart.init.js

@@ -49,7 +49,7 @@ function set_data(elementObject, numberOfCharts, callback) {
     setTimeout(function() {
 
         // lightcolors = ['#8dd3c7', '#ffffb3', '#bebada', '#fb8072', '#80b1d3', '#fdb462', '#b3de69', '#fccde5', '#d9d9d9', '#bc80bd', '#ccebc5', '#ffed6f'];
-        const defaultColors = ['#a6cee3', '#1f78b4', '#b2df8a', '#33a02c', '#fb9a99', '#e31a1c', '#fdbf6f', '#ff7f00', '#cab2d6', '#6a3d9a', '#ffff99', '#b15928'];;
+        const defaultColors = ['#a6cee3', '#1f78b4', '#b2df8a', '#33a02c', '#fb9a99', '#e31a1c', '#fdbf6f', '#ff7f00', '#cab2d6', '#6a3d9a', '#ffff99', '#b15928'];
         let options;
         let rawData = elementObject.attr('raw') ? JSON.parse(elementObject.attr('raw')) : null;
 
@@ -61,9 +61,9 @@ function set_data(elementObject, numberOfCharts, callback) {
             let titles = JSON.parse(elementObject.attr('titles')) ?? [];
             let colors = JSON.parse(elementObject.attr('colors')) ?? defaultColors;
 
-            let boundaryGap = (elementObject.attr('boundary-gap') == 'true' || elementObject.attr('boundary-gap') == true); // default true
-            let inverted = (elementObject.attr('inverted') == 'true' || elementObject.attr('inverted') == true); // default false
-            let showDataZoom = (elementObject.attr('data-zoom') == 'true' || elementObject.attr('data-zoom') == true); // default false
+            let boundaryGap = (elementObject.attr('boundary-gap') === 'true' || elementObject.attr('boundary-gap') === true); // default true
+            let inverted = (elementObject.attr('inverted') === 'true' || elementObject.attr('inverted') === true); // default false
+            let showDataZoom = (elementObject.attr('data-zoom') === 'true' || elementObject.attr('data-zoom') === true); // default false
 
             let animationDuration = elementObject.attr('animation-duration') ?? 750;
             // ex '{value} users'  - https://echarts.apache.org/en/option.html#yAxis.axisLabel.formatter
@@ -279,7 +279,7 @@ function setTitles(titles, numberOfCharts = 1) {
 
     let arrayTitles = [];
 
-    for(i = 0; i < numberOfCharts; i++) {
+    for(let i = 0; i < numberOfCharts; i++) {
 
         let title = {
             text: titles[i],
@@ -325,9 +325,6 @@ function setDataZoom(show, multichart = false) {
             bottom: 0,
             borderColor: 'rgba(255,255,255,0.1)',
             fillerColor: 'rgba(0,0,0,0.1)',
-            handleStyle: {
-                color: '#585f63'
-            },
             textStyle: {
                 color: '#fff'
             },