diff options
author | srichman333 <sarah_n_richman@brown.edu> | 2023-08-02 17:50:25 -0400 |
---|---|---|
committer | srichman333 <sarah_n_richman@brown.edu> | 2023-08-02 17:50:25 -0400 |
commit | de064a6b0acf7f3dff04c579afc2562d782472d2 (patch) | |
tree | 9148ad271da5d3c3462833a2e01762757f372ba9 | |
parent | 9fc748e6b09783f6bb375a68d10040141ac502f2 (diff) |
selected fix
-rw-r--r-- | src/client/views/nodes/DataVizBox/components/Histogram.tsx | 26 | ||||
-rw-r--r-- | src/client/views/nodes/DataVizBox/components/PieChart.tsx | 15 |
2 files changed, 9 insertions, 32 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/Histogram.tsx b/src/client/views/nodes/DataVizBox/components/Histogram.tsx index 68cb768d1..89dcf87db 100644 --- a/src/client/views/nodes/DataVizBox/components/Histogram.tsx +++ b/src/client/views/nodes/DataVizBox/components/Histogram.tsx @@ -45,7 +45,7 @@ export class Histogram extends React.Component<HistogramProps> { private maxBins = 15; // maximum number of bins that is readable on a normal sized doc @observable _currSelected: any | undefined = undefined; private curBarSelected: any = undefined; - private selectTry: any = undefined; + private selectedData: 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 _histogramData() { @@ -377,32 +377,17 @@ export class Histogram extends React.Component<HistogramProps> { && showSelected[yAxisTitle]==this._currSelected![yAxisTitle]) : false; this._currSelected = sameAsCurrent? undefined: showSelected; - this.selectTry = sameAsCurrent? undefined: d; + this.selectedData = sameAsCurrent? undefined: d; return true } return false; }); - // console.log(this.curBarSelected.groups[0][0].data==selected) - const elements = document.querySelectorAll('.histogram-bar'); - for (let i = 0; i < elements.length; i++) { - elements[i].classList.remove('hover'); - } - if (!sameAsCurrent!) selected.attr('class', 'histogram-bar hover'); - if (sameAsCurrent!) { - selected.attr('class', 'histogram-bar') - this.curBarSelected = undefined; - } - else { - selected.attr('class', 'histogram-bar hover') - selected.attr('stroke', 'blue') - this.curBarSelected = selected; - } - console.log(this._currSelected) - console.log(this.selectTry) + if (sameAsCurrent!) this.curBarSelected = undefined; + else this.curBarSelected = selected; }); svg.on('click', onPointClick); - var selected = this.selectTry; + var selected = this.selectedData; svg.append("text") .attr("transform", "translate(" + (width/2) + " ," + (height+40) + ")") .style("text-anchor", "middle") @@ -435,7 +420,6 @@ export class Histogram extends React.Component<HistogramProps> { .attr("width", eachRectWidth) .attr("class", selected? function(d) { - console.log(d[0]==selected[0], d) return (selected && selected[0]==d[0])? 'histogram-bar hover' : 'histogram-bar'; }: function(d) {return 'histogram-bar'}) .attr("fill", (d)=>{ return this.props.layoutDoc['histogramBarColors-'+d[0]]? StrCast(this.props.layoutDoc['histogramBarColors-'+d[0]]) : StrCast(this.props.layoutDoc['defaultHistogramColor'])}) diff --git a/src/client/views/nodes/DataVizBox/components/PieChart.tsx b/src/client/views/nodes/DataVizBox/components/PieChart.tsx index d3d16aa4c..d01d4429f 100644 --- a/src/client/views/nodes/DataVizBox/components/PieChart.tsx +++ b/src/client/views/nodes/DataVizBox/components/PieChart.tsx @@ -43,7 +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; + private selectedData: 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() { @@ -329,23 +329,16 @@ export class PieChart extends React.Component<PieChartProps> { : this._currSelected===showSelected; this._currSelected = sameAsCurrent? undefined: showSelected; - this.selectedTry = sameAsCurrent? undefined: d; + this.selectedData = sameAsCurrent? undefined: d; return true; } return false; }); - const elements = document.querySelectorAll('.slice'); - for (let i = 0; i < elements.length; i++) { - elements[i].classList.remove('hover'); - } if (sameAsCurrent!) this.curSliceSelected = undefined; - else { - selected.attr('class', 'slice hover') - this.curSliceSelected = selected; - } + else this.curSliceSelected = selected; }); - var selected = this.selectedTry; + var selected = this.selectedData; var arcs = g.selectAll("arc") .data(pie(data)) .enter() |