linking title bug fix

1 files changed, 27 insertions, 8 deletions

diff --git a/src/client/views/nodes/DataVizBox/components/PieChart.tsx b/src/client/views/nodes/DataVizBox/components/PieChart.tsx
index f0c27866d..98c79f95a 100644
--- a/src/client/views/nodes/DataVizBox/components/PieChart.tsx
+++ b/src/client/views/nodes/DataVizBox/components/PieChart.tsx
@@ -348,10 +348,27 @@ export class PieChart extends React.Component<PieChartProps> {
             .enter()
             .append("g")
         arcs.append("path")
-            .attr("fill", (data, i)=>{ return this.props.layoutDoc['pieSliceColors-'+data.data.valueOf()]? StrCast(this.props.layoutDoc['pieSliceColors-'+data.data.valueOf()]) : d3.schemeSet3[i]? d3.schemeSet3[i]: d3.schemeSet3[i%12] })
+            .attr("fill", (d, i)=>{ 
+                var possibleDataPoints = pieDataSet.filter((each: { [x: string]: any | { valueOf(): number; }; }) => {
+                    try {
+                        return each[percentField].replace(/[^0-9]/g,"")==d.data.toString().replace(/[^0-9]/g,"")
+                    } catch (error) {
+                        return each[percentField]==d.data
+                    }})
+                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;
+                }
+                var accessByName = descriptionField? dataPoint[descriptionField] : dataPoint[percentField];
+                return this.props.layoutDoc['pieSliceColors-'+accessByName]? StrCast(this.props.layoutDoc['pieSliceColors-'+accessByName]) : d3.schemeSet3[i]? d3.schemeSet3[i]: d3.schemeSet3[i%12] })
             .attr("class", 'slice')
             .attr("d", arc)
             .on('click', onPointClick)
+
+        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)
@@ -383,12 +400,15 @@ export class PieChart extends React.Component<PieChartProps> {
     };
 
     render() {
+        this.componentDidMount();
         var titleAccessor: any='';
-        if (this.props.axes.length==2) titleAccessor = StrCast(this.props.layoutDoc['pieChart-title-'+this.props.axes[0]+'-'+this.props.axes[1]]);
-        else if (this.props.axes.length>0) titleAccessor = StrCast(this.props.layoutDoc['pieChart-title-'+this.props.axes[0]]);
-        const title = titleAccessor? titleAccessor : this.defaultGraphTitle;
+        if (this.props.axes.length==2) titleAccessor = 'pieChart-title-'+this.props.axes[0]+'-'+this.props.axes[1];
+        else if (this.props.axes.length>0) titleAccessor = 'pieChart-title-'+this.props.axes[0];
+        if (!this.props.layoutDoc[titleAccessor]) this.props.layoutDoc[titleAccessor] = this.defaultGraphTitle;
         var selected: string;
+        var curSelectedSliceName;
         if (this._currSelected){
+            curSelectedSliceName = StrCast(this._currSelected![this.props.axes[0]].replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, ''))
             selected = '{ ';
             Object.keys(this._currSelected).map(key => {
                 key!=''? selected += key + ': ' + this._currSelected[key] + ', ': '';
@@ -402,9 +422,8 @@ export class PieChart extends React.Component<PieChartProps> {
             <div className="chart-container">
                 <div className="graph-title"> 
                     <EditableText
-                        val={title}
-                        setVal={action(val => {this.props.axes.length>1? this.props.layoutDoc['pieChart-title-'+this.props.axes[0]+"-"+this.props.axes[1]] = val as string
-                            : this.props.layoutDoc['pieChart-title-'+this.props.axes[0]] = val as string})}
+                        val={StrCast(this.props.layoutDoc[titleAccessor])}
+                        setVal={action(val => this.props.layoutDoc[titleAccessor] = val as string)}
                         color={"black"}
                         size={Size.LARGE}
                         fillWidth
@@ -418,7 +437,7 @@ export class PieChart extends React.Component<PieChartProps> {
                             tooltip={'Change Slice Color'} 
                             type={Type.SEC} 
                             icon={<FaFillDrip/>}
-                            selectedColor={this.curSliceSelected.attr("fill")}
+                            selectedColor={this.props.layoutDoc['pieSliceColors-'+curSelectedSliceName]? this.props.layoutDoc['pieSliceColors-'+curSelectedSliceName] : this.curSliceSelected.attr("fill")}
                             setSelectedColor={color => this.changeSelectedColor(color)}
                             size={Size.XSMALL}
                         />