Merge branch 'master' into data-visualization-sarah

3 files changed, 28 insertions, 30 deletions

diff --git a/src/client/views/nodes/DataVizBox/components/Histogram.tsx b/src/client/views/nodes/DataVizBox/components/Histogram.tsx
index edb1665f2..1d8ab8f2a 100644
--- a/src/client/views/nodes/DataVizBox/components/Histogram.tsx
+++ b/src/client/views/nodes/DataVizBox/components/Histogram.tsx
@@ -415,8 +415,8 @@ export class Histogram extends React.Component<HistogramProps> {
 
     updateBarColors = () => {
         var svg = this._histogramSvg;
-        if (svg) svg.selectAll('rect')
-            .attr('fill', (d: any) => {
+        if (svg)
+            svg.selectAll('rect').attr('fill', (d: any) => {
                 var barColor;
                 const barColors = StrListCast(this.props.layoutDoc.dataViz_histogram_barColors).map(each => each.split('::'));
                 barColors.forEach(each => {
@@ -428,7 +428,7 @@ export class Histogram extends React.Component<HistogramProps> {
                 });
                 return barColor ? StrCast(barColor) : StrCast(this.props.layoutDoc.dataViz_histogram_defaultColor);
             });
-    }
+    };
 
     render() {
         this.updateBarColors();
diff --git a/src/client/views/nodes/DataVizBox/components/LineChart.tsx b/src/client/views/nodes/DataVizBox/components/LineChart.tsx
index 206169c13..8967f27b8 100644
--- a/src/client/views/nodes/DataVizBox/components/LineChart.tsx
+++ b/src/client/views/nodes/DataVizBox/components/LineChart.tsx
@@ -76,7 +76,7 @@ export class LineChart extends React.Component<LineChartProps> {
         // return selected x and y axes
         // otherwise, use the selection of whatever is linked to us
         const incomingVizBox = DocumentManager.Instance.getFirstDocumentView(this.parentViz)?.ComponentView as DataVizBox;
-        const highlitedRowIds = (incomingVizBox && incomingVizBox.rootDoc)? NumListCast(incomingVizBox.rootDoc.dataViz_highlitedRows) : [];
+        const highlitedRowIds = incomingVizBox && incomingVizBox.rootDoc ? NumListCast(incomingVizBox.rootDoc.dataViz_highlitedRows) : [];
         return this._tableData.filter((record, i) => highlitedRowIds.includes(this._tableDataIds[i])); // get all the datapoints they have selected field set by incoming anchor
     }
     @computed get rangeVals(): { xMin?: number; xMax?: number; yMin?: number; yMax?: number } {
diff --git a/src/client/views/nodes/DataVizBox/components/PieChart.tsx b/src/client/views/nodes/DataVizBox/components/PieChart.tsx
index 8be8b7c7c..de6263198 100644
--- a/src/client/views/nodes/DataVizBox/components/PieChart.tsx
+++ b/src/client/views/nodes/DataVizBox/components/PieChart.tsx
@@ -52,7 +52,7 @@ export class PieChart extends React.Component<PieChartProps> {
     // organized by specified number percentages/ratios if one column is selected and it contains numbers
     // otherwise, assume data is organized by categories
     @computed get byCategory() {
-        return !/\d/.test(this.props.records[0][this.props.axes[0]]);
+        return this.props.axes.length === 1 || !/\d/.test(this.props.records[0][this.props.axes[0]]);
     }
     // filters all data to just display selected data if brushed (created from an incoming link)
     @computed get _pieChartData() {
@@ -265,7 +265,7 @@ export class PieChart extends React.Component<PieChartProps> {
                 var sliceColor;
                 if (dataPoint) {
                     const sliceTitle = dataPoint[this.props.axes[0]];
-                    const accessByName = StrCast(sliceTitle)? StrCast(sliceTitle).replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '') : sliceTitle;
+                    const accessByName = StrCast(sliceTitle) ? StrCast(sliceTitle).replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '') : sliceTitle;
                     var sliceColors = StrListCast(this.props.layoutDoc.dataViz_pie_sliceColors).map(each => each.split('::'));
                     sliceColors.forEach(each => each[0] == accessByName && (sliceColor = each[1]));
                 }
@@ -289,35 +289,31 @@ export class PieChart extends React.Component<PieChartProps> {
         // adding labels
         trackDuplicates = {};
         data.forEach((eachData: any) => (!trackDuplicates[eachData] ? (trackDuplicates[eachData] = 0) : null));
-        arcs.append('text')
-            .attr('transform', function (d) {
-                var centroid = arc.centroid(d as unknown as d3.DefaultArcObject);
-                var heightOffset = (centroid[1] / radius) * Math.abs(centroid[1]);
-                return 'translate(' + (centroid[0] + centroid[0] / (radius * 0.02)) + ',' + (centroid[1] + heightOffset) + ')';
-            })
-            .attr('text-anchor', 'middle')
-            .text(function (d) {
-                var possibleDataPoints = pieDataSet.filter((each: { [x: string]: any | { valueOf(): number } }) => {
-                    try {
-                        return Number(each[percentField].replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '')) == Number(d.data);
-                    } catch (error) {
-                        return each[percentField] == d.data;
+        arcs.size() < 100 &&
+            arcs
+                .append('text')
+                .attr('transform', function (d) {
+                    var centroid = arc.centroid(d as unknown as d3.DefaultArcObject);
+                    var heightOffset = (centroid[1] / radius) * Math.abs(centroid[1]);
+                    return 'translate(' + (centroid[0] + centroid[0] / (radius * 0.02)) + ',' + (centroid[1] + heightOffset) + ')';
+                })
+                .attr('text-anchor', 'middle')
+                .text(function (d) {
+                    var dataPoint;
+                    const possibleDataPoints = possibleDataPointVals.filter((pval: any) => pval[percentField] === Number(d.data));
+                    if (possibleDataPoints.length == 1) dataPoint = possibleDataPoints[0];
+                    else {
+                        dataPoint = possibleDataPoints[trackDuplicates[d.data.toString()]];
+                        trackDuplicates[d.data.toString()] = trackDuplicates[d.data.toString()] + 1;
                     }
+                    return dataPoint ? dataPoint[percentField]! + (!descriptionField ? '' : ' - ' + dataPoint[descriptionField])! : '';
                 });
-                var dataPoint;
-                if (possibleDataPoints.length == 1) dataPoint = possibleDataPoints[0];
-                else {
-                    dataPoint = possibleDataPoints[trackDuplicates[d.data.toString()]];
-                    trackDuplicates[d.data.toString()] = trackDuplicates[d.data.toString()] + 1;
-                }
-                return dataPoint ? dataPoint[percentField]! + (!descriptionField ? '' : ' - ' + dataPoint[descriptionField])! : '';
-            });
     };
 
     @action changeSelectedColor = (color: string) => {
         this.curSliceSelected.attr('fill', color);
         const sliceTitle = this._currSelected[this.props.axes[0]];
-        const sliceName = StrCast(sliceTitle)? StrCast(sliceTitle).replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '') : sliceTitle;
+        const sliceName = StrCast(sliceTitle) ? StrCast(sliceTitle).replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '') : sliceTitle;
 
         const sliceColors = Cast(this.props.layoutDoc.dataViz_pie_sliceColors, listSpec('string'), null);
         sliceColors.map(each => {
@@ -336,7 +332,7 @@ export class PieChart extends React.Component<PieChartProps> {
         var curSelectedSliceName = '';
         if (this._currSelected) {
             const sliceTitle = this._currSelected[this.props.axes[0]];
-            curSelectedSliceName = StrCast(sliceTitle)? StrCast(sliceTitle).replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '') : sliceTitle;
+            curSelectedSliceName = StrCast(sliceTitle) ? StrCast(sliceTitle).replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '') : sliceTitle;
             selected = '{ ';
             Object.keys(this._currSelected).map(key => {
                 key != '' ? (selected += key + ': ' + this._currSelected[key] + ', ') : '';
@@ -346,7 +342,9 @@ export class PieChart extends React.Component<PieChartProps> {
         } else selected = 'none';
         var selectedSliceColor;
         var sliceColors = StrListCast(this.props.layoutDoc.dataViz_pie_sliceColors).map(each => each.split('::'));
-        sliceColors.forEach(each => { if (each[0] == curSelectedSliceName!) selectedSliceColor = each[1] });
+        sliceColors.forEach(each => {
+            if (each[0] == curSelectedSliceName!) selectedSliceColor = each[1];
+        });
 
         if (this._pieChartData.length > 0 || !this.parentViz) {
             return this.props.axes.length >= 1 ? (