Hi, In order for the bar.groupWidth option to register, you need to run your options through the options converter. To reduce the height of the labels, you'll need to change their font size, which you can do using the domainAxis.textStyle.fontSize option. Here's an example of a Bar chart using both these options and the options converter: http://jsfiddle.net/hr56z87y/
On Fri, Oct 23, 2015 at 10:51 AM Chris Cole <[email protected]> wrote: > I am drawing a barchart with data from [here][1], but I am not able to set > the bars' labels' width and reduce the spacing between each bar. How do I > do that? > > The result (You can find corresponding HTML page of the result attached): > > > <https://lh3.googleusercontent.com/-SruMhJlbbRk/VipJD8MqHcI/AAAAAAAAD2c/_n-vMcvzNHY/s1600/Screen%2BShot%2B2015-10-23%2Bat%2B14.03.47.png> > > This is my code: > > function drawVisualization() { > var chart = new google.charts.Bar(document.getElementById( > 'columnchart_material')); > > > var data = new google.visualization.DataTable(); > data.addColumn('string', 'Country'); > data.addColumn('number', 'Migrants entering a country'); > data.addColumn('number', 'Migrants leaving a country'); > > > loadMigrationData(); > > > function loadMigrationData() { > // console.log(countrySelected.value); > > > d3.csv("NetMigrationRate.csv", function(csv) { > csv = csv.filter(function(row) { > return row; > }) > console.log(csv.length); > > > data.setColumns([csv.length, { > calc: cmToInches, > type: 'number', > label: 'Height in Inches' > }]); > data.addRows(csv.length); > > > var migrants; > for (var index in csv) { > country = csv[index]['Country']; > migrants = csv[index]['Migrants']; > > > var ind = parseInt(index); > data.setCell(ind, 0, country); > > > if (migrants > 0) { > > > data.setCell(ind, 1, migrants); > > > } else if (migrants < 0) { > > > data.setCell(ind, 2, migrants); > } > } > var optionsCount = { > isStacked: "true", > bar: { > groupWidth: "100%" > }, > bars: 'horizontal', > width: 600, > height: 2600, > legend: { > position: "none" > }, > }; > chart.draw(data, optionsCount); > }); > } > } > > > > I have already tried to set > > bar: {groupWidth: "100%"}, > > to increase the bars' width but with no results. > How do I reduce the bar's labels' height and at the same time reduce the > bars' width, in order to beautify the whole chart? > > Thank you in advance helpers! > > [1]: > https://www.cia.gov/library/publications/the-world-factbook/rankorder/2112rank.html > [3]: http://i.stack.imgur.com/tHoke.png > > -- > You received this message because you are subscribed to the Google Groups > "Google Visualization API" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to > [email protected]. > Visit this group at > http://groups.google.com/group/google-visualization-api. > To view this discussion on the web visit > https://groups.google.com/d/msgid/google-visualization-api/52910a5d-df84-4b35-9b3b-d2968a0bb246%40googlegroups.com > <https://groups.google.com/d/msgid/google-visualization-api/52910a5d-df84-4b35-9b3b-d2968a0bb246%40googlegroups.com?utm_medium=email&utm_source=footer> > . > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAEwwup4Oasvj8SX%3DJTe9JoE%3DbNWD0O%3Dn78XCJbNQiV_Lqb_Luw%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
