Google chart in IE7

Question

I use the visualization library, diagrams work fine in Firefox / Chrome, however, when I test in IE7, I get a different font that appears on the diagram. Different computers give different results.

So, it’s known that I run IE9, but I use IE7 "browser mode" for testing.

In addition, I use the new "corepackage" in Google Charts, so it uses both VML and SVG when necessary so that it displays in IE. But for some reason, I get weird fonts in IE7.

Can someone explain what could happen?

Screenshot from Google: Full Image Graph http://i56.tinypic.com/14aye5s.png

EDIT: Here is the script graph for the chart:

<script type="text/javascript"> function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Column1'); data.addColumn('number', 'Column2'); data.addRows(12); // Removed data for NDA puroses var chart = new google.visualization.ColumnChart(document.getElementById('Project')); var formatter = new google.visualization.NumberFormat( {prefix: '&#163;', negativeParens: true, decimalSymbol: '.', groupingSymbol: ',' }); formatter.format(data,0); formatter.format(data,1); chart.draw(data, {colors: ['#FFC6A5','#FFFF42','#DEF3BD','#00A5C6','#DEBDDE'], width: 600, height: 300, min: 0, max:0, is3D: false, legend: 'bottom', title: 'Project Variance', isVertical:true, isStacked:true});}google.setOnLoadCallback(drawChartProjectVariance);</script> 

Answer 1

Wrapping the font name in single and then double quotes seems to fix the font problem (although it still appears in bold and italics, which doesn't seem to be fixed).

eg. -

var options = {'fontName' : '"Arial"'}

Answer 2

IE7 does not support SVG. You can see some alternatives in this thread:

https://stackoverflow.com/questions/3163479/what-is-a-good-alternative-to-svg-in-ie7