IE7中的谷歌圖表 (Google Chart's in IE7)


問題描述

IE7中的谷歌圖表 (Google Chart's in IE7)

I am using the visualization library the charts works fine in Firefox/Chrome, however when I test in IE7 I am getting a different font showing up on the chart. Different computers yield different results.

So it is known, I am running IE9 but using the IE7 "browser mode" to test.

Also, I am using the new "corepackage" in Google Charts, so it utilizes both VML and SVG when needed so it does render in IE. But for whatever reason I get weird fonts in IE7.

Can anyone explain what might be happening?

Screenshot From Google: Full Image

EDIT: Here is the script 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>

‑‑‑‑‑

參考解法

方法 1:

Wrapping the font name in single, and then double quotes seems to fix the font issue (though it still displays in bold and italic, which there doesn't seem to be a way to fix).

e.g. ‑ 

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

方法 2:

IE7 doesn't support SVG. You can see some alternatives in this thread:

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

(by ChrisRogerRag)

參考文件

  1. Google Chart's in IE7 (CC BY‑SA 3.0/4.0)

#google-visualization #fonts #internet-explorer #internet-explorer-7






相關問題

帶有坐標的谷歌地理圖表? (Google geocharts with coordinates?)

通過 JavaScript 客戶端 API Auth 使用 Google 電子表格作為“已驗證”數據源的 Google 可視化 API (Google Visualization API using Google Spreadsheet as "Authenticated" Data Source via JavaScript Client API Auth)

在 PHP 中壓縮 JSON 字符串並在 Javascript 中解壓縮以進行 Google API 的數據庫查詢 (Compress JSON string in PHP and decompress in Javascript for Database query for Google API)

用於創建 innerHTML 的 JavaScript 循環(Google 表格) (JavaScript loop to create innerHTML (Google Sheet))

相當於 GViz setVisibleChartRange 的 Dygraphs? (Dygraphs equivalent for GViz setVisibleChartRange?)

避免 Google 圖表中 X 軸的小數點 (Avoid decimal points in X-axis in Google charts)

如何從 Google 的 Visualization API 生成的條形圖中刪除 x 軸? (How do you remove the x-axis from a bar chart produced by Google's Visualization API?)

谷歌圖表 API 加載 (Google Chart API loading)

為 Google Charts Api 編寫自定義格式化程序 (Write a custom formatter for Google Charts Api)

IE7中的谷歌圖表 (Google Chart's in IE7)

谷歌圖表 - 直方圖:刪除項目的水平劃分 (google charts - histograms: remove horizontal division of items)

與 jquery 一起使用時,Google 圖表上的 Vaxis 不顯示 (Vaxis on Google chart not showing when used with jquery)







留言討論