Note that there are some explanatory texts on larger screens.

plurals
  1. POGoogle Visualization Column and Bar chart vaxis and haxis labels overlap in firefox 3.6.12 and IE
    primarykey
    data
    text
    <p>Can anyone help me on this problem I am having with chart labels on firefox and IE8, on chrome and safari the labels are working as they are expected to, but on Firefox and IE, the axis labels will overlap each other and won't obey any of the haxis or vaxis options. I am coding in ruby on rails and using an erb template partial to write out my javascript. As I said before, it works great on chrome and safari but on firefox and IE8 I run into these axis label problems. Any help would be grateful. </p> <p>This is the code I am doing </p> <pre><code>&lt;script type="text/javascript" src="https://www.google.com/jsapi"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; google.load('visualization', '1', {'packages':['corechart']}); google.setOnLoadCallback(drawBarChart); function drawBarChart() { var bar_data = new google.visualization.DataTable(); bar_data.addColumn('string', 'yaxis'); bar_data.addColumn('number', 'xaxis'); bar_data.addRows(5); var col = 0; &lt;% array.each do |value| %&gt; bar_data.setValue(col, 0, 'realllly longggggggggggggggggggggggggg'); bar_data.setValue(col, 1, &lt;%= value %&gt;); col++; &lt;% end %&gt; var bar_chart = new google.visualization.BarChart(document.getElementById('&lt;%= element %&gt;')); bar_chart.draw( bar_data, { width: 870, height: 350, title: 'Quantity per Suspect Code', legend: 'none', vAxis: { textStyle: { fontSize: 11 } }, hAxis: { title: 'Quantity' } } ) }; &lt;/script&gt; </code></pre> <p>Notes: The element id is passed to this partial, so in this case the element would be 'line_chart' and the id on the template rendering this partial is #line_chart</p> <p>Thanks</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload