I've recently started testing Google Charts, mostly just by hard-wiring data right into the code. One problem I've encountered as I play is with boundaries. If I have any data that bumps against the vaxis baseline, it cuts off the bubble. Yet, if I force the issue, in some cases, the data just doesn't make sense. Here is a quick visualization of some NCAA numbers. But as you can see, I had to force a -5 vaxis value so the bubbles of teams not making any Sweet Sixteens (0) were not cut because it rendered half of it below 0. But displaying -5 as an option is, well, dumb. And I really would prefer to display vaxis data; I don't just want to hide it. Is there any setting which forces the grid to flex to include the full boundaries of all data?
Data and markup: <https://lh3.googleusercontent.com/-DpRoIVCWudk/Uy5UPaLPeVI/AAAAAAAAAJc/NlYMISiD7fE/s1600/bubble.jpg> <html> <head> <script type="text/javascript" src="https://www.google.com/jsapi";></script> <script type="text/javascript"> google.load("visualization", "1", {packages:["corechart"]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualization.arrayToDataTable([ ['ID', 'Last appearance', 'Sweet Sixteen', 'Final Four', 'Total appearances'], ['U of I', 2013, 11, 5, 30], ['DePaul', 2004, 10, 2, 18], ['SIU', 2011, 0, 0, 10], ['Bradley', 2006, 3, 2, 8], ['ISU', 1998, 0, 0, 6], ['Loyola', 1985, 3, 1, 5], ['NIU', 1996, 0, 0, 3], ['UIC', 2004, 0, 0, 3], ['EIU', 2001, 0, 0, 2], ]); var options = { colors: ['#79BEDB', '#266A2E'], legend: {position: 'none'}, title: 'Illinois colleges in the NCAA tournament', hAxis: {format: '####', title: "Last tournament appearance", minorGridlines:{count:2}, viewWindowMode: 'pretty' }, vAxis: {baseline: -5, title: "Sweet Sixteen appearances", minorGridlines:{count:1}, viewWindowMode: 'pretty'}, bubble: {textStyle: {fontSize: 11}, stroke: "transparent", opacity: 0.7 } }; var chart = new google.visualization.BubbleChart(document.getElementById('chart_div')); chart.draw(data, options); } </script> </head> <body> <div id="chart_div" style="width: 900px; height: 500px;"></div> </body> </html> -- You received this message because you are subscribed to the Google Groups "Google Chart 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-chart-api. For more options, visit https://groups.google.com/d/optout.
