diff options
| author | srichman333 <sarah_n_richman@brown.edu> | 2023-08-02 13:00:18 -0400 |
|---|---|---|
| committer | srichman333 <sarah_n_richman@brown.edu> | 2023-08-02 13:00:18 -0400 |
| commit | e94534bc9f9dd44980e7574b860ea0b7912371bd (patch) | |
| tree | 0a3cb9e74f571ae0272a98c66ddb67a3662c8ad3 | |
| parent | 49fa6721e2a7af21db5da339cd3c7d90d3e8bf8b (diff) | |
linking default histogram color bug fix
| -rw-r--r-- | src/client/views/nodes/DataVizBox/components/Histogram.tsx | 10 |
1 files changed, 6 insertions, 4 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/Histogram.tsx b/src/client/views/nodes/DataVizBox/components/Histogram.tsx index e5e3ccd53..46a264386 100644 --- a/src/client/views/nodes/DataVizBox/components/Histogram.tsx +++ b/src/client/views/nodes/DataVizBox/components/Histogram.tsx @@ -424,7 +424,7 @@ export class Histogram extends React.Component<HistogramProps> { return height - y(d.length)}) .attr("width", eachRectWidth) .attr("class", 'histogram-bar') - .attr("fill", (d)=>{ return this.props.layoutDoc['histogramBarColors-'+d[0]]? StrCast(this.props.layoutDoc['histogramBarColors-'+d[0]]) : this.props.layoutDoc.defaultHistogramColor? StrCast(this.props.layoutDoc.defaultHistogramColor): '#69b3a2'}) + .attr("fill", (d)=>{ return this.props.layoutDoc['histogramBarColors-'+d[0]]? StrCast(this.props.layoutDoc['histogramBarColors-'+d[0]]) : StrCast(this.props.layoutDoc['defaultHistogramColor'])}) }; @action changeSelectedColor = (color: string) => { @@ -439,16 +439,16 @@ export class Histogram extends React.Component<HistogramProps> { else return true; }) defaultColorBars.attr("fill", color); - this.props.layoutDoc.defaultHistogramColor = color; + this.props.layoutDoc['defaultHistogramColor'] = color; }; render() { - this.componentDidMount(); var curSelectedBarName; var titleAccessor: any=''; if (this.props.axes.length==2) titleAccessor = 'histogram-title-'+this.props.axes[0]+'-'+this.props.axes[1]; else if (this.props.axes.length>0) titleAccessor = 'histogram-title-'+this.props.axes[0]; if (!this.props.layoutDoc[titleAccessor]) this.props.layoutDoc[titleAccessor] = this.defaultGraphTitle; + if (!this.props.layoutDoc['defaultHistogramColor']) this.props.layoutDoc['defaultHistogramColor'] = '#69b3a2'; var selected: string; if (this._currSelected){ curSelectedBarName = StrCast(this._currSelected![this.props.axes[0]].replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, '')) @@ -460,6 +460,8 @@ export class Histogram extends React.Component<HistogramProps> { selected += ' }'; } else selected = 'none'; + + this.componentDidMount(); return ( this.props.axes.length >= 1 ? ( <div className="chart-container" > @@ -476,7 +478,7 @@ export class Histogram extends React.Component<HistogramProps> { tooltip={'Change Default Bar Color'} type={Type.SEC} icon={<FaFillDrip/>} - selectedColor={this.props.layoutDoc.defaultHistogramColor? StrCast(this.props.layoutDoc.defaultHistogramColor): '#69b3a2'} + selectedColor={StrCast(this.props.layoutDoc['defaultHistogramColor'])} setSelectedColor={color => this.changeDefaultColor(color)} size={Size.XSMALL} /> |