Google Charts / visualisations column width

google-visualization

Solution

You can set a maximum width by setting the `bar.groupWidth` option to an integer number (the number of pixels to use for a bar group). Setting this option makes the API attempt to draw all bar groups (the set of bars at a given axis value) this width, though it may be forced to draw them smaller if the setup of the chart requires it.

bar: {
    groupWidth: 20
}

Problem

I am using the Google Chart API, and converted a line chart (see below) into a column chart, however the column widths change depending on the quantity of data columns. If I hover over, it tells me the correct date, however because of the changing width of the column you cannot actually accurately see the date the column should represent. A point would work, so I could revert to a line chart however, a column does look better for the data set I am using. Any idea how to solve this issue? Date is dynamic, so the X axis has to be variable. Thanks ``` // Create a line chart, passing some options var LineChart = new google.visualization.ChartWrapper({ 'chartType': 'ColumnChart', 'containerId': 'chart_div', 'options': { 'vAxis': {'title': 'Species Abundance', 'minValue': 0, 'maxValue': 32}, 'width': 300, 'height': 300, 'legend': 'top', 'title': 'Selected Site and Species abundance over time' }, 'view': {'columns': [0, 1]}, }); ```

Original source