Apply colors dynamically to bars in barchart

plotly.js
1

Is it possible to apply color to the barchart based on the value of data.
I would like to make some bars blue and some red. But the coloring needs to be based on the value in data array. The array size could be large so I don’t want to hardcode the array with colors.

26%20PM

If in data object, the value of a field is “true” then bar needs to be blue and else it needs to be red.
The way I am applying color currently is :
constructor(props) {
super(props);
this.state = {
defaultColor: ‘#1984CD’,
currentColorsArray: ‘#1984CD’,
startTime: ‘1493374820’,
endTime:‘1530947227’,
showSummaryPanel: false
}
const data= [{
x:x,
y:y,
type: ‘bar’,
marker: { color: this.state.currentColorsArray },
name: ‘number of days’,
text: this.getHoverInfo(),
hoverInfo: ‘text’
}];

How should I apply to the condition ?

2

You can use local variable for this and assign the color based on condition it’s basic programming ie
let markerColor = ‘someDefaultColor’;
if(condition){
markerColor = ‘someOtherColor’
}
then in trace object set
{
x:x,
y:y,
type: ‘bar’,
marker: { color: markerColor},
name: ‘number of days’,
text: this.getHoverInfo(),
hoverInfo: ‘text’
}