Google Charts / visualisations column width

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]},
                });

Answers


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
}

Need Your Help

How can I order a Dictionary in C#?

c# dictionary

edit: Thanks Jason, the fact that it was a dictionary isn't that important. I just wanted the runtime to have a low runtime. Is that LINQ method fast? Also, I know this is off topic but what doe...

How can I use $.ajax to retrieve normal JSON as JSONP?

jquery ajax json jsonp cross-domain-policy

I have a normal JSON feed that I am polling at a url (normalJSONfeed). I am getting the cross origin policy error each time. How can I alter the $.ajax function to get around this limitation when ...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.