From 2a313f28fcb8675223708b0657de7517a3281095 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 17 Apr 2024 12:27:21 -0400
Subject: restoring eslint - updates not complete yet

---
 .../nodes/DataVizBox/components/LineChart.tsx      | 80 ++++++++++++----------
 1 file changed, 45 insertions(+), 35 deletions(-)

(limited to 'src/client/views/nodes/DataVizBox/components/LineChart.tsx')

diff --git a/src/client/views/nodes/DataVizBox/components/LineChart.tsx b/src/client/views/nodes/DataVizBox/components/LineChart.tsx
index e093ec648..c667a15de 100644
--- a/src/client/views/nodes/DataVizBox/components/LineChart.tsx
+++ b/src/client/views/nodes/DataVizBox/components/LineChart.tsx
@@ -11,10 +11,11 @@ import { Docs } from '../../../../documents/Documents';
 import { DocumentManager } from '../../../../util/DocumentManager';
 import { undoable } from '../../../../util/UndoManager';
 import { ObservableReactComponent } from '../../../ObservableReactComponent';
-import { PinProps, PresBox } from '../../trails';
+import { PresBox } from '../../trails';
 import { DataVizBox } from '../DataVizBox';
 import { createLineGenerator, drawLine, minMaxRange, scaleCreatorNumerical, xAxisCreator, xGrid, yAxisCreator, yGrid } from '../utils/D3Utils';
 import './Chart.scss';
+import { PinProps } from '../../../DocComponent';
 
 export interface DataPoint {
     x: number;
@@ -258,17 +259,18 @@ export class LineChart extends ObservableReactComponent<LineChartProps> {
             .attr('transform', `translate(${margin.left}, ${margin.top})`));
 
         var validSecondData;
-        if (this._props.axes.length>2){ // for when there are 2 lines on the chart
+        if (this._props.axes.length > 2) {
+            // for when there are 2 lines on the chart
             var next = this._tableData.map(record => ({ x: Number(record[this._props.axes[0]]), y: Number(record[this._props.axes[2]]) })).sort((a, b) => (a.x < b.x ? -1 : 1));
             validSecondData = next.filter(d => {
-                if (!d.x || Number.isNaN(d.x) || !d.y || Number.isNaN(d.y)) return false;
+                if (!d.x || isNaN(d.x) || !d.y || isNaN(d.y)) return false;
                 return true;
             });
             var secondDataRange = minMaxRange([validSecondData]);
-            if (secondDataRange.xMax!>xMax) xMax = secondDataRange.xMax;
-            if (secondDataRange.yMax!>yMax) yMax = secondDataRange.yMax;
-            if (secondDataRange.xMin!<xMin) xMin = secondDataRange.xMin;
-            if (secondDataRange.yMin!<yMin) yMin = secondDataRange.yMin;
+            if (secondDataRange.xMax! > xMax) xMax = secondDataRange.xMax;
+            if (secondDataRange.yMax! > yMax) yMax = secondDataRange.yMax;
+            if (secondDataRange.xMin! < xMin) xMin = secondDataRange.xMin;
+            if (secondDataRange.yMin! < yMin) yMin = secondDataRange.yMin;
         }
 
         // creating the x and y scales
@@ -285,37 +287,45 @@ export class LineChart extends ObservableReactComponent<LineChartProps> {
         if (validSecondData) {
             drawLine(svg.append('path'), validSecondData, lineGen, true);
             this.drawDataPoints(validSecondData, 0, xScale, yScale);
-            svg.append('path').attr("stroke", "red");
+            svg.append('path').attr('stroke', 'red');
 
             // legend
-            var color = d3.scaleOrdinal()
-                .range(["black", "blue"])
-                .domain([this._props.axes[1], this._props.axes[2]])
-            svg.selectAll("mydots")
+            var color = d3.scaleOrdinal().range(['black', 'blue']).domain([this._props.axes[1], this._props.axes[2]]);
+            svg.selectAll('mydots')
                 .data([this._props.axes[1], this._props.axes[2]])
                 .enter()
-                .append("circle")
-                    .attr("cx", 5)
-                    .attr("cy", function(d,i){ return -30 + i*15})
-                    .attr("r", 7)
-                    .style("fill", function(d){ return color(d)})
-            svg.selectAll("mylabels")
+                .append('circle')
+                .attr('cx', 5)
+                .attr('cy', function (d, i) {
+                    return -30 + i * 15;
+                })
+                .attr('r', 7)
+                .style('fill', function (d) {
+                    return color(d);
+                });
+            svg.selectAll('mylabels')
                 .data([this._props.axes[1], this._props.axes[2]])
                 .enter()
-                .append("text")
-                    .attr("x", 25)
-                    .attr("y", function(d,i){ return -30 + i*15})
-                    .style("fill", function(d){ return color(d)})
-                    .text(function(d){ return d})
-                    .attr("text-anchor", "left")
-                    .style("alignment-baseline", "middle")
+                .append('text')
+                .attr('x', 25)
+                .attr('y', function (d, i) {
+                    return -30 + i * 15;
+                })
+                .style('fill', function (d) {
+                    return color(d);
+                })
+                .text(function (d) {
+                    return d;
+                })
+                .attr('text-anchor', 'left')
+                .style('alignment-baseline', 'middle');
         }
 
         // get valid data points
         const data = dataSet[0];
         var validData = data.filter(d => {
             Object.keys(data[0]).map(key => {
-                if (!d[key] || Number.isNaN(d[key])) return false;
+                if (!d[key] || isNaN(d[key])) return false;
             });
             return true;
         });
@@ -399,16 +409,16 @@ export class LineChart extends ObservableReactComponent<LineChartProps> {
         else if (this._props.axes.length > 0) titleAccessor = titleAccessor + this._props.axes[0];
         if (!this._props.layoutDoc[titleAccessor]) this._props.layoutDoc[titleAccessor] = this.defaultGraphTitle;
         const selectedPt = this._currSelected ? `{ ${this._props.axes[0]}: ${this._currSelected.x} ${this._props.axes[1]}: ${this._currSelected.y} }` : 'none';
-        var selectedTitle = "";
-        if (this._currSelected && this._props.titleCol){
-            selectedTitle+= "\n" + this._props.titleCol + ": "
+        var selectedTitle = '';
+        if (this._currSelected && this._props.titleCol) {
+            selectedTitle += '\n' + this._props.titleCol + ': ';
             this._tableData.forEach(each => {
-                 var mapThisEntry = false;
-                if (this._currSelected.x==each[this._props.axes[0]] && this._currSelected.y==each[this._props.axes[1]]) mapThisEntry = true;
-                else if (this._currSelected.y==each[this._props.axes[0]] && this._currSelected.x==each[this._props.axes[1]]) mapThisEntry = true;
-                if (mapThisEntry) selectedTitle += each[this._props.titleCol] + ", ";
-            })
-            selectedTitle = selectedTitle.slice(0,-1).slice(0,-1);
+                var mapThisEntry = false;
+                if (this._currSelected.x == each[this._props.axes[0]] && this._currSelected.y == each[this._props.axes[1]]) mapThisEntry = true;
+                else if (this._currSelected.y == each[this._props.axes[0]] && this._currSelected.x == each[this._props.axes[1]]) mapThisEntry = true;
+                if (mapThisEntry) selectedTitle += each[this._props.titleCol] + ', ';
+            });
+            selectedTitle = selectedTitle.slice(0, -1).slice(0, -1);
         }
         if (this._lineChartData.length > 0 || !this.parentViz || this.parentViz.length == 0) {
             return this._props.axes.length >= 2 && /\d/.test(this._props.records[0][this._props.axes[0]]) && /\d/.test(this._props.records[0][this._props.axes[1]]) ? (
-- 
cgit v1.2.3-70-g09d2

