よくある質問

スタートガイド

Google Visualization API とは
Google Visualization API を使用すると、構造化データを使用してグラフやレポート アプリケーションを作成し、ウェブサイトに直接統合することができます。
Visualization API でできること
Google Visualization API では、ブラウザでローカルに作成した構造化データにアクセスしたり、サポートされているデータソースからシンプルな表形式の構造化データにアクセスしたりできます。また、独自のデータソースを Visualization API のデータソースとして実装し、可視化準拠の可視化やアプリケーションがデータにアクセスできるようにすることもできます。レポート、分析、グラフのアプリケーションで使用できる形式です。これにより、データを視覚化したり、Google スプレッドシートなどの新機能をアプリケーションに追加したりできます。
可視化 API のドキュメントはどこで確認できますか?
デベロッパー ガイドやその他すべての関連ドキュメントについては、https://developers.google.com/chart/interactive/docs をご覧ください。
新しいグラフを作成するにはどうすればよいですか?
ご利用にあたっては、概要クイックスタートのセクションをご覧いただくことをおすすめします。
データソースの URL とは何ですか?
データソース URL は、Visualization API データソースの一意の URL 識別子です。データソースの URL に、グラフのクエリ言語パラメータを含めることもできます。この場合、データの取得前に、データソースに対してクエリ(並べ替え、グループ化など)が実行されます。
Visualization API を使用する Chart アプリのサンプルコードは、どこで確認できますか?
サンプルコードについては、Visualization API のサンプルコードをご覧ください。
Flash アプリケーションから Visualization API にアクセスできますか?
もちろん可能です。 Visualization API は JavaScript API を使用しますが、Flash アプリが JavaScript コードに接続できるようにするライブラリもあります。有用なライブラリについては、http://code.google.com/p/noreplyobject をご覧ください。Flash に影響する開発問題については、下記をご覧ください。
データソースを実装するにはどうすればよいですか?
グラフの使用と作成に関するセクションを読み、グラフの仕組みを確認してから、データソースの実装でデータソースの作成方法をご確認ください。また、Java を使用する場合は、Google Chart Data Source Java Library を使ってみるのも簡単です。
Java アプリケーションからグラフにアクセスできますか?
はい。Google Web Toolkit(GWT)用の Google 可視化ライブラリを使用すると、GWT コンパイラでコンパイルされた Java コードから API 準拠の可視化にアクセスし、GWT コンパイラを使用して Visualization API 準拠の可視化を Java で記述できます。リリース候補ライブラリは、Visualization API イベントモデルもサポートしています。
Google Web Toolkit(GWT)コンパイラで記述したアプリケーションからグラフにアクセスできますか?
はい。Google Web Toolkit(GWT)用の Google 可視化ライブラリを使用すると、GWT コンパイラでコンパイルされた Java コードから API 準拠の可視化にアクセスし、GWT コンパイラを使用して Visualization API 準拠の可視化を Java で記述できます。リリース候補ライブラリは、Visualization API イベントモデルもサポートしています。
上記とは異なる質問や問題がある場合、詳細を知るにはどこに問い合わせればよいですか?
Google Visualization API のディスカッション グループに質問を投稿すると、可視化デベロッパー コミュニティからサポートを受けることができます。Google 可視化チームもこのグループに参加して、質問に回答します。

API の使用

Google Chart API と Google Visualization API の違いは何ですか?

Chart API を使うと、データとグラフの設定オプションの両方を含む書式設定された URL を Google サーバーに送信して、各種の画像グラフを簡単に作成できます。Chart API には、さまざまなオプションが設定された閉じたグラフがあります。Chart API のデータセットは、URL のサイズ(約 2,000)に制限されています。

Visualization API は、ウェブでグラフとデータソースを接続し、公開する方法を提供します。

  • Visualization API には、グラフにアクセスするための JavaScript API が用意されています。
  • グラフのギャラリーには Google が作成したグラフが含まれていますが、サードパーティのビジュアリゼーション API に準拠したビジュアリゼーションを作成することもできます。
  • 可視化 API のグラフとグラフは、ブラウザでレンダリングできるものであれば何でもかまいません。これには、画像、JavaScript、ベクター グラフィック、Flash などが含まれます。
  • かなりの数の Chart API グラフに Visualization API を使用してアクセスできますが、一部の構成オプションは使用できない場合があります。
  • また、API により、ドキュメントに記述されているワイヤ プロトコルと、データソースを API のビジュアリゼーションに公開するための手段も提供されます。
  • この API には、グラフがイベントをスローしたり受信したりできるため、ホストページおよびページ上の他のグラフと通信できるイベント モデルが定義されています。
Visualization API では、どのようなデータソースにアクセスできますか?
Visualization API を使用すると、API の標準 DataTable 形式を作成して、ブラウザからローカルのデータにアクセスできます。また、API をサポートする任意のデータソースにアクセスできます。すでに API をサポートしている既知のアプリケーションは、Google スプレッドシートと、Force.com デベロッパー プラットフォーム上の Salesforce.com です。また、独自のデータをグラフのデータソースとして実装することもできます。
アプリケーションでは、受信するデータが特定の形式であると想定しています。例外に対処する方法
クラス google.visualization.DataTablegetNumberOfColumns() メソッドと getColumnType() メソッドを使用して、取得するデータが想定どおりであることをテストして、不一致についてエラー メッセージを発行できます。
ウェブサイトにグラフを埋め込むのは安全ですか?
サードパーティのコードをウェブサイトで直接実行すると、固有のリスクが発生します。 Google は、アプリのパフォーマンス、品質、セキュリティ、コンテンツについていかなる保証や表明も行いません。Google Visualization API の利用規約を遵守していないグラフ アプリケーションは、ギャラリーから削除される場合があります。
グラフをオフラインで使用できますか?
Google Chart のインタラクティブ機能を使用するには、ユーザーのパソコンが https://www.gstatic.com/charts/loader.js にアクセスできる必要があります。 これは、ページに必要な可視化ライブラリが、使用前に動的に読み込まれるためです。適切なライブラリを読み込むためのコードは付属のスクリプトの一部であり、google.charts.load() メソッドを呼び出すときに呼び出されます。Google の利用規約では、google.charts.load または google.visualization コードをダウンロードしてオフラインで使用することはできません。
グラフのコードをローカルまたはイントラネットでダウンロードしてホストすることはできますか?
Google の利用規約では、google.charts.load コードまたは google.visualization コードのダウンロードと保存が許可されていません。ただし、Google グラフのインタラクティビティが不要な場合は、グラフのスクリーンショットを作成して、必要に応じて使用できます。

トラブルシューティング

グラフが表示されない理由

まず、JavaScript コンソールを確認します。Chrome で JavaScript コンソールにアクセスするには、Chrome -> [表示] -> [デベロッパー] -> [JavaScript コンソール] に移動するか、[Chrome] -> [ツール] -> [JavaScript コンソール] を選択します。最新のブラウザはすべて JavaScript コンソールを使用しています。そのため、[Advanced] や [Developer Tools] などの名前が付いたメニューを探してみてください。

うまくいけば、コンソールですぐにこの問題を解決できます。ただし、コンソールのメッセージを根本原因に翻訳するのが難しい場合があります。よくある間違いとして、次のようなものがあります。

  • Google ローダを誤って使用している可能性があります。
    • chart/loader.js の読み込みは 1 回にしてください。 ウェブページにグラフがいくつあっても、次のように 1 回だけ呼び出しを行う必要があります。
      <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> // Do this ONCE.
      負荷の発生タイミングに応じて、ウェブページの head または body で設定できます。
    • 理想的には、ウェブページに必要なすべてのパッケージを指定して、google.charts.load を 1 回だけ呼び出します。
      <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
      <script>
        google.charts.load("current", {packages: ["corechart", "timeline"]});
      
        google.charts.setOnLoadCallback(drawBarChart1);
        function drawBarChart1() {
          ...
          var barChart1 = new google.visualization.BarChart(document.getElementById('chart1'));
          ...
        }
      
        google.charts.setOnLoadCallback(drawBarChart2);
        function drawBarChart2() {
          ...
          var barChart2 = new google.visualization.BarChart(document.getElementById('chart2'));
          ...
        }
      
        google.charts.setOnLoadCallback(drawTimeline);
        function drawTimeline() {
          ...
          var timeline = new google.visualization.Timeline(document.getElementById('chart3'));
          ...
        }
      
      </script>
      <div id="chart1"></div>
      ...
      <div id="chart2"></div>
      ...
      <div id="chart3"></div>
  • すべてのグラフに一意の要素 ID が必要です(chart1(上記の例では chart2)です。
  • 入力ミスを探します。JavaScript では大文字と小文字が区別されることに注意してください。

それでも問題が解決しない場合は、Google Visualization API のディスカッション グループを検索して、他のユーザーが同様の問題に遭遇していないか確認してください。質問に対する投稿が見つからない場合は、その問題を紹介するウェブページへのリンクを投稿してください。可能であれば、jsfiddle を含めます。

月と日が 1 つずつずれているのはなぜですか?
Google Chart では JavaScript を使用します。JavaScript ではゼロベースのインデックスが使用されます。月の初日は 0 で、範囲は 0(1 月)~ 11(12 月)です。コードが 1 から始まるインデックス登録を想定している場合は、データを減算して、データを JavaScript 日付オブジェクトに配置してください。
一部のブラウザでのみグラフが表示されるのはなぜですか?
ブラウザの非互換性の問題については、caniuse.com を使用することをおすすめします。Google Chart では、Internet Explorer 8 以前で次の 2 つの理由により問題が生じることがあります。
  • IE8 は SVG をサポートしていないため、グラフは VML にフェイルオーバーしますが、VML には制限があります。
  • IE8 の JavaScript では、リストの末尾にカンマを含めることはできません。
  • テスト時に Flash ベースのグラフが表示されないのはなぜですか?
    Flash ベースのセキュリティ設定が原因で、ウェブサーバーの URL(例: http://www.myhost.com/myviz.html)ではなく、ブラウザのファイルの場所(file:///c:/webhost/myhost/myviz.html)から Flash ベースのグラフが正しく表示されない場合があります。これは通常、テストのみの問題です。http:// アドレスからグラフにアクセスする場合、問題はありません。この問題は、Macromedia のウェブサイトで説明されているとおり解決できます。一般的には、Flash の開発はできるだけ避けることをおすすめします。

    Google 可視化プログラム ポリシー

    Google 可視化プログラム ポリシーとは何ですか?
    利用規約に記載のとおり、Google のプログラム ポリシーに違反するコンテンツについては、以下の内容を表示するかリンクすることにより、そのようなコンテンツの表示や表示を拒否することがあります。
    • 不正なコンテンツ。
    • 個人的なプライバシーの侵害。
    • ポルノやわいせつな表現
    • ユーザーのパソコンやホストのウェブページの機能に干渉する、または有害となる悪意のあるコードなどのコンテンツ。
    • ヘイトや暴力の扇動。
    • 著作権の違反。詳しくは、DMCA ポリシーをご覧ください。
    • 商標の違反。
    • 第三者のなりすまし。

    データを収集するグラフを作成するデベロッパーは、法的に適切なプライバシー ポリシーを維持し、プライバシー ポリシーにリンクすることに同意します。また、デベロッパーは、グラフの安全性を確保し、Chart ディレクトリにある限りアプリケーションをメンテナンスする必要があります。

    本ポリシーは、予告なく変更される場合があります。

    Google Visualization API は商用利用できますか?
    はい。印刷方法については、Google Visualization API の利用規約をご覧ください。
    Google Visualization API でクライアントサイド ソフトウェアを作成できますか?
    現在、Visualization API を使用してクライアントサイド ソフトウェアを作成することは許可されていません。Visualization API は、提供されているインターフェースでのみ使用できます。注意事項については、Google Visualization API の利用規約をご覧ください。
    Google にグラフのデータがすべて記録されるのですか?
    HTTP リクエストに含まれるグラフのデータは、内部テストとデバッグの目的で 2 週間まで一時ログに保存されます。当然ながら、チャートが公開ウェブページのイメージタグに表示される場合、クロールされる可能性があることを理解しておく必要があります。
    プログラム ポリシーの違反。
    これらのプログラム ポリシーに違反すると、チャートの無効化や削除、今後のチャートのアップロード拒否、Google アカウントの停止、すべてのチャートの削除につながる可能性があります。

    コミュニティで積極的に活動する

    グラフ アプリケーションを他のユーザーと共有する方法
    まず、グラフ ギャラリーにグラフを配置します。 必要に応じて、自分のサイトへのリンクを設置したり、ソースコードを提供したりできます。ディスカッション グループに参加して、コミュニティからフィードバックを得ましょう。
    グラフ ギャラリーには、Visualization API を使用するアプリケーションの一覧が表示されます。ビジュアリゼーションのデベロッパー コミュニティで、チャート アプリケーションを共有するための一元的な場所を提供します。グラフの申請書をギャラリーに送信するには、オンラインで申請します。
    グラフのデータソースを宣伝するにはどうすればよいですか?
    ビジュアリゼーション グループに実装を投稿する。気に入ったら、自分たちの言葉で呼ぶこともあります。