The first two issues are because you are loading the old, deprecated "columnchart" package, which did not support these features. Loading the "corechart" package instead fixes the problem (note, though, that 3d columns are not supported in the new version). To fix the axis scaling, set the viewWindow.min and viewWindow.max options to the minimum and maximum values you want for your chart (note that these are explicit minimum and maximum values, any chart values outside this range will be cropped). To make each bar have its own color, you need to put each data point in its own series and set the "isStacked" option to true. You can use a DataView with calculated columns to put the data in the right format. See an example of all of these using your code here: http://jsfiddle.net/asgallant/X8BmB/
The last item on your list can't be done, though. On Thursday, August 16, 2012 8:34:08 AM UTC-4, jaav wrote: > > I am new in Google Graphs, I need a solution for the following problems: > > 1. My Ghaph doesn't show The hAxis Title. > 2. My Ghaph doesn't show The vAxis Title. > 3. The vAxis scale start in the 4.3 value I need that starts in 0 and > maximun value = 5. > 4. I need each bar appears with diferent colors. > 5. I need to show the column value at the either at th top of bootn of the > bar > > Any Ideas? my code is: > > <html> > <head> > <script type="text/javascript" src="https://www.google.com/jsapi > "></script> > <script type="text/javascript"> > //load the Google Visualization API and the chart > google.load('visualization', '1', {'packages':['columnchart']}); > > //set callback > google.setOnLoadCallback (createChart); > > //callback function > function createChart() { > > var data = new google.visualization.DataTable( > { > "cols": [ > > {"id":"","label":"Topping","pattern":"","type":"string"}, > > {"id":"","label":"Promedio","pattern":"","type":"number"} > ], > "rows": [ > {"c":[{"v":"1", > "f":null},{"v":4.31,"f":null}]}, > {"c":[{"v":"2", > "f":null},{"v":4.84,"f":null}]}, > {"c":[{"v":"3", > "f":null},{"v":4.77,"f":null}]}, > {"c":[{"v":"4", > "f":null},{"v":4.80,"f":null}]}, > {"c":[{"v":"5", > "f":null},{"v":4.78,"f":null}]}, > {"c":[{"v":"6", > "f":null},{"v":4.80,"f":null}]}, > {"c":[{"v":"7", > "f":null},{"v":4.79,"f":null}]}, > {"c":[{"v":"8", > "f":null},{"v":4.83,"f":null}]}, > {"c":[{"v":"9", > "f":null},{"v":4.77,"f":null}]}, > > {"c":[{"v":"10","f":null},{"v":4.85,"f":null}]}, > > {"c":[{"v":"11","f":null},{"v":4.52,"f":null}]} > > ] > } > ) > > //instantiate our chart objects > var chart = new google.visualization.ColumnChart > (document.getElementById('chart_div')); > > > //define options for visualization > var options = { > > width: 900, > height: 500, > is3D: true, > legend: 'none', > title: 'My Graphic', > > hAxis: { > title: 'hAxis Title', > titleTextStyle: {color: 'red'}, > textPosition: 'out' > }, > > vAxis: { > title: 'vAxis Title', > minValue: 0, > maxValue: 5 > > } > }; > > //draw my chart > chart.draw(data, options); > > } > > </script> > </head> > <body> > <div id="chart_div"></div> > </body> > </html> > > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/OApAsW0luLkJ. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
