<Chart
width={'auto'}
// height={'100%'}
// width={'auto'}
chartType="BarChart"
loader={this.renderLoadingSign()}
data={data}
options={{
chartArea: {
// width: '50%',
height: '80%'
},
backgroundColor: 'white',
bar: { groupWidth: 16 },
fontFamily: variables.fontRegular,
annotations: {
alwaysOutside: true,
datum: {
stem: {
color: 'transparent'
}
},
domain: {
stem: {
color: 'red'
}
},
textStyle: {
fontName: variables.title14
}
},
hAxis: {
ticks: [0, 1],
fontSize: 1,
baselineColor: 'transparent',
textStyle: {
color: 'transparent',
fontSize: 1
},
gridlines: {
color: 'transparent'
}
},
vAxis: {
gridlines: {
color: 'transparent'
}
},
highlightOnMouseOver: false,
enableInteractivity: false,
legend: { position: 'none' }
}}
chartEvents={[
{
eventName: 'select',
callback: ({ chartWrapper }) => {
chartWrapper.getChart().setSelection([]);
}
},
{
eventName: 'ready',
callback: ({ chartWrapper }) => {
topItemsChart = chartWrapper.getChart();
this.updateTextStyles();
if (callback) callback();
}
}
]}
/>