aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DataVizBox/components/Histogram.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/DataVizBox/components/Histogram.tsx')
-rw-r--r--src/client/views/nodes/DataVizBox/components/Histogram.tsx28
1 files changed, 18 insertions, 10 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/Histogram.tsx b/src/client/views/nodes/DataVizBox/components/Histogram.tsx
index a9be151bc..2a47abf32 100644
--- a/src/client/views/nodes/DataVizBox/components/Histogram.tsx
+++ b/src/client/views/nodes/DataVizBox/components/Histogram.tsx
@@ -400,6 +400,14 @@ export class Histogram extends React.Component<HistogramProps> {
barColors.map(each => { if (each.split('::')[0] == barName) barColors.splice(barColors.indexOf(each), 1) });
barColors.push(StrCast(barName + '::' + color));
};
+
+ @action eraseSelectedColor= () => {
+ this.curBarSelected.attr("fill", this.props.layoutDoc.defaultHistogramColor);
+ var barName = StrCast(this._currSelected[this.props.axes[0]].replace(/\$/g, '').replace(/\%/g, '').replace(/\</g, ''))
+
+ const barColors = Cast(this.props.layoutDoc.histogramBarColors, listSpec("string"), null);
+ barColors.map(each => { if (each.split('::')[0] == barName) barColors.splice(barColors.indexOf(each), 1) });
+ };
render() {
var curSelectedBarName;
@@ -445,28 +453,28 @@ export class Histogram extends React.Component<HistogramProps> {
setSelectedColor={color => this.props.layoutDoc.defaultHistogramColor = color}
size={Size.XSMALL}
/>
- &nbsp;
- <IconButton
- icon={<FontAwesomeIcon icon={'eraser'} />}
- size={Size.XSMALL}
- color={'black'}
- type={Type.SEC}
- tooltip={'Revert all bars to the default color'}
- onClick={action(() => {this.props.layoutDoc.histogramBarColors = new List<string>()})}
- />
</div>
{selected != 'none' ?
<div className={'selected-data'}>
Selected: {selected}
&nbsp; &nbsp;
<ColorPicker
- tooltip={'Change Slice Color'}
+ tooltip={'Change Bar Color'}
type={Type.SEC}
icon={<FaFillDrip/>}
selectedColor={selectedBarColor? selectedBarColor : this.curBarSelected.attr("fill")}
setSelectedColor={color => this.changeSelectedColor(color)}
size={Size.XSMALL}
/>
+ &nbsp;
+ <IconButton
+ icon={<FontAwesomeIcon icon={'eraser'} />}
+ size={Size.XSMALL}
+ color={'black'}
+ type={Type.SEC}
+ tooltip={'Revert to the default bar color'}
+ onClick={action(() => this.eraseSelectedColor())}
+ />
</div>
: null}
<div ref={this._histogramRef} />