1 files changed, 7 insertions, 1 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/PieChart.tsx b/src/client/views/nodes/DataVizBox/components/PieChart.tsx
index 98c79f95a..d3d16aa4c 100644
--- a/src/client/views/nodes/DataVizBox/components/PieChart.tsx
+++ b/src/client/views/nodes/DataVizBox/components/PieChart.tsx
@@ -43,6 +43,7 @@ export class PieChart extends React.Component<PieChartProps> {
     private byCategory: boolean = true; // whether the data is organized by category or by specified number percentages/ratios
     @observable _currSelected: any | undefined = undefined;
     private curSliceSelected: any = undefined;
+    private selectedTry: any = undefined;
     // TODO: nda - some sort of mapping that keeps track of the annotated points so we can easily remove when annotations list updates
 
     @computed get _piechartData() {
@@ -328,6 +329,7 @@ export class PieChart extends React.Component<PieChartProps> {
                         : 
                         this._currSelected===showSelected;
                     this._currSelected = sameAsCurrent? undefined: showSelected;
+                    this.selectedTry = sameAsCurrent? undefined: d;
                     return true;
                 }
                 return false;
@@ -343,6 +345,7 @@ export class PieChart extends React.Component<PieChartProps> {
             }
         });
 
+        var selected = this.selectedTry;
         var arcs = g.selectAll("arc")
             .data(pie(data))
             .enter()
@@ -363,7 +366,10 @@ export class PieChart extends React.Component<PieChartProps> {
                 }
                 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("class", selected? 
+                function(d) {
+                    return (selected && d.startAngle==selected.startAngle && d.endAngle==selected.endAngle)? 'slice hover' : 'slice';
+                }: function(d) {return 'slice'})
             .attr("d", arc)
             .on('click', onPointClick)