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]},
});
Right-click on any column inside your chart. Select 'Format data series'. Drag the slider under the 'Gap width' to the right to make the columns thinner and to the left to make the columns wider.
Specify Chart Size One very common option to set is the chart height and width. You can specify the chart size in two places: in the HTML of the container <div> element, or in the chart options.
A bar chart or bar graph is a chart or graph that presents categorical data with rectangular bars with heights or lengths proportional to the values that they represent. The bars can be plotted vertically or horizontally. A vertical bar chart is sometimes called a column chart.
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
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With