配信イベント

ビジュアリゼーションでは、ホストページで登録して受信できるイベントを起動できます。イベントは、グラフのクリックなどのユーザー アクションによって呼び出すことも、内部イベント（10 秒ごとにイベントを発生させるなど）によってトリガーすることもできます。JavaScript メソッドを登録して、特定のイベントが発生したときに呼び出すことができます。場合によっては、そのイベントに固有のデータを使用して呼び出すこともできます。

可視化ではそれぞれ独自のイベントが定義されます。その可視化のドキュメントでは、各イベントが発生したタイミング、意味、イベント ハンドラに送信する情報（orgchart の可視化など）について説明する必要があります。このページでは、ビジュアリゼーションの作成者がイベントを発生させる方法について説明します。クライアントを登録してイベントを受信する方法については、イベントの処理のページをご覧ください。

選択可能なビジュアリゼーションは、select イベントという 1 つのイベントを発生させます。 ただし、このイベントの動作と意味は、可視化ごとに定義されます。

draw メソッドがユーザーにコントロールを返した直後にビジュアリゼーションがインタラクションの準備ができていない場合は、ビジュアリゼーションを起動する必要があります（つまり、Ready イベント）。このイベントの正確な動作と意味は、Ready Event セクションで定義されています。

可視化 API イベントは、標準の DOM イベントとは別個であることに注意してください。

目次

  1. イベントを発生させる
  2. イベントの選択
  3. Ready イベント
  4. 詳細情報

イベントを発生させる

ビジュアリゼーションからイベントを発生させるには、google.visualization.events.trigger() 関数を呼び出します。この関数には、次のパラメータが必要です。

  1. ソースの可視化（通常は this 値）。
  2. イベント名（文字列）。
  3. イベントの詳細（オブジェクト）。特定のイベントの詳細のマップ（名前/値）（省略可）。

次の例は、ビジュアリゼーションが select イベントをスローする方法を示しています。

MyVisualization.prototype.onclick = function(rowIndex) {
  this.highlightRow(this.selectedRow, false); // Clear previous selection
  this.highlightRow(rowIndex, true); // Highlight new selection

  // Save the selected row index in case getSelection is called.
  this.selectedRow = rowIndex;

  // Fire a select event.
  google.visualization.events.trigger(this, 'select', {});
};

Hosting のページでは、google.visualization.events.addListener() または google.visualization.events.addOneTimeListener() を呼び出すことで、イベントを受信するための登録を行うことができます。発生したイベントについても、すべて詳しく記録してください。

Select Event（選択イベント）

「select」イベントは、ユーザーのマウスクリックに応答して多くの可視化からスローされる標準イベントです。マウスのクリックに応じてイベントを起動する場合は、ここで説明する標準的な方法で「select」イベントを実装する必要があります。

  1. ユーザーがビジュアリゼーション内のデータを選択したときに、「select」という名前のイベントを発生させます。このイベントは、リッスン関数に引数を送信しません。
  2. リンク先のドキュメント セクションの説明に沿って、getSelection() メソッドを公開します。このメソッドは、ユーザーが選択した data 要素のインデックスを返します。
  3. リファレンス セクションに記載されているように、setSelection() メソッドを公開します。イベントの処理方法については、イベントの処理ページをご覧ください。

Ready イベント

どのビジュアリゼーションも、呼び出されたメソッドを処理する準備が整ったことをデベロッパーに通知するために、標準的な方法で機能する「ready」イベントを発生させる必要があります。（ただし、ビジュアリゼーションがこのように動作する絶対的な要件はありません。ビジュアリゼーションのドキュメントをご確認ください）。

一般に、「ready」イベントを公開するビジュアリゼーションは、次の仕様で設計されています。

  • ready イベントは、ハンドラにプロパティを渡しません（関数ハンドラでは、パラメータが渡されることを想定していません）。
  • ビジュアリゼーションでインタラクションの準備が整ったら、Ready イベントが発生する必要があります 。 可視化の描画が非同期である場合は、draw メソッドが終了したときだけでなく、インタラクション メソッドを呼び出すことができたときにイベントが発生することが重要です。
  • このイベントへのリスナーの追加は、draw メソッドを呼び出す前に行う必要があります。追加しないと、リスナーが設定される前にイベントが発生してしまい、イベントをキャッチできないからです。
  • ready イベントが発生する前にインタラクション メソッドを呼び出すと、これらのメソッドが正常に動作しないリスクがあります。

慣例では、「ready」イベントを発生させない可視化は、draw メソッドが終了してユーザーにコントロールを返した直後にインタラクションの準備が整います。

詳細情報