Bar Chart Horizontal Scale Weirdness

[phpn1b]

I'm able to get my bar chart working as I would like with one minor
issue. All the values in my chart go from 0 to 10, however the chart's
horizontal scale defaults to a maximum value of 12. I've found how I
can override that and make 10 the maximum value, however when I do
this the chart doesn't draw 10 on the chart. It draws 0, 2, 4, 6, and
8, and leaves room for 10, but no 10 is drawn even when there is a bar
with a value of 10. Also, it doesn't draw the vertical line indicating
that there is a 10. Just me or a bug?

[asgallant]

If the right edge of the chartArea is too close to the edge of the chart div, the final axis value will not draw.  Try giving your chart a bit larger margin there (can be adjusted with the chartArea: {left, width} options) and see if that works.

[phpn1b]

Hmmm, doesn't seem to make a difference. My chart div code is <div
style="border:1px solid #666" id="chart_div"></div>

and my chart script is:

<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {'packages':['corechart']});

// Set a callback to run when the Google Visualization API is
loaded.
google.setOnLoadCallback(drawChart);

// Callback that creates and populates a data table,
// instantiates the pie chart, passes in the data and
// draws it.
function drawChart() {

// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Category');
data.addColumn('number', 'Score');
data.addRows([
['A1', 1.335],
['A2', 8.75],
['A3', 4],
['A4', 7.5],
['A5', 6.844],
['A6', 6],
['A7', 0.268],
['A8', 6.593],
['A9', 5.268],
['A10', 2.263],
['A11', 6],
['A12', 0],
['A13', 10]
]);

// Set chart options
var options = {'title':'Results',
width:550,
hAxis: {minValue: 0, maxValue: 10},
hAxis: {viewWindow:{max:10,min:0},viewWindowMode:'explicit'},
chartArea: {top:50,left:130,width:400},
titleTextStyle:{color: "black", fontName: "Arial", fontSize: "20"},
height:400};

// Instantiate and draw our chart, passing in some options.
var chart = new
google.visualization.BarChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>

[Jinji]

Is this valid Javascript, to define 'hAxis' twice on the same object?

Anyway, there are sometimes Javascript rounding errors which are very annoying. Can you try setting viewWindow.max to something that's a big larger than 10 (say, 10.01)? Alternatively, if possible, you can change your largest value in the data to be slightly smaller than 10 (9.99), but changing the data is not always possible...

                       chartArea: {top:50,left:130,width:400},
                       titleTextStyle:{color: "black", fontName: "Arial", fontSize: "20"},
                       height:400};

     // Instantiate and draw our chart, passing in some options.
     var chart = new
google.visualization.BarChart(document.getElementById('chart_div'));
     chart.draw(data, options);
   }
</script>

On Sep 12, 3:43 pm, asgallant <drew_gall...@abtassoc.com> wrote:
> If the right edge of the chartArea is too close to the edge of the chart
> div, the final axis value will not draw.  Try giving your chart a bit larger
> margin there (can be adjusted with the chartArea: {left, width} options) and
> see if that works.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.

To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

[asgallant]

I suspect the culprit in this case is the viz API's burning hatred for decimal axis values.  When you set the viewWindow.max to 10, the chart tries to draw the axis with values of 0, 2.5, 5. 7.5, 10, but then has an apoplectic fit and redraws the tick marks as 0, 2, 4, 6, 8.  You'd think there could be a 10 after that, but the API only draws 5 tick marks, never more, never less.

[phpn1b]

I tried using integers instead of real numbers and got the same
result, even though in the real world I couldn't do this but I thought
I'd test it anyway. I also tried changing the max value to 10.01 which
also made no difference. Weird.

[asgallant]

It has nothing to do with your data.  The axis doesn't want to have any decimal values on it.  If you multiply all your data by 10 and set the max axis value to 100, it would work fine (sets ticks marks at 0, 25, 50, 75, 100).

[phpn1b]

Ug. So basically I need a way to specify the values and/or the number
of divisions on the horizontal axis and there's no way to do it? Even
with this issue with fractions on the axis it still seems odd that the
chart won't draw the final vertical line for the value of 10 while it
leaves space for it. So close...

On Sep 13, 11:14 am, asgallant <drew_gall...@abtassoc.com> wrote:
> It has nothing to do with your data.  The *axis* doesn't want to have any