How to make bar chart not be crushed with a lot of data in google bar chart?

Question

Using a bar chart: https://developers.google.com/chart/interactive/docs/gallery/barchart when you have a lot of data, it crushes the bars to be very thin and the text to overlap each other. What options are there to get the data to render in the container properly (maybe guarantee each bar to be of a certain height if possible)? I want to avoid explicitly setting the height to say "1000px", then looking at the bar chart to determine whether it is scrunched up or not.

Answer 1

You can calculate a height for your BarChart dynamically, based on the number of rows of data in your DataTable:

// set inner height to 30 pixels per row
var chartAreaHeight = data.getNumberOfRows() * 30;
// add padding to outer height to accomodate title, axis labels, etc
var chartHeight = chartAreaHeight + 80;
var chart = new google.visualization.BarChart(document.querySelector('#chart_div'));
chart.draw(data, {
    height: chartHeight,
    chartArea: {
        height: chartAreaHeight
    }
});