A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://developers.google.com/chart/interactive/docs/dev/events below:

Firing Events | Charts | Google for Developers

Firing Events

Stay organized with collections Save and categorize content based on your preferences.

Your visualization can fire events that a host page can register to receive. Events can be fired by user actions: for example a user clicks on a chart, or can be internal: for example, firing an event every 10 seconds. You can register a Javascript method to be called whenever certain events are fired, possibly with data specific to that event.

Every visualization defines its own events, and the documentation for that visualization should describe when each event is fired, what it means, and what information it sends to your event handler (for example, see the orgchart visualization). This page describes how a visualization creator can fire events. To learn how clients can register to receive events, see the Handling Events page.

There is one event that any selectable visualization should fire: the select event. However, the behavior and meaning of this event is defined by each visualization.

If a visualization is not ready for interaction immediately after the draw method returns control to the user, the visualization should fire: the ready event. The exact behavior and meaning of this event is defined in The Ready Event section.

It is important to note that the Visualization API events are separate and distinct from the standard DOM events.

Contents Firing an Event

To fire an event from your visualization, call the google.visualization.events.trigger() function. The function expects the following parameters:

  1. Source visualization (typically this is the this value).
  2. Event name (string).
  3. Event details (Object). An optional map (name/value) of specific event details.

The following example shows how a visualization throws the select event:

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 pages can register to receive your events by calling google.visualization.events.addListener() or google.visualization.events.addOneTimeListener(). Be sure to document thoroughly any events that you fire.

The Select Event

The "select" event is a standard event thrown by many visualizations in response to a user mouse click. If you choose to fire an event in response to mouse clicks, you should implement the "select" event in the standard way described here:

  1. Fire an event with the name 'select' when the user selects some data within the visualization. The event does not send any arguments to the listening functions.
  2. Expose the getSelection() method as described in the linked document section. This method should return the indexes of data elements that the user selected.
  3. Expose a setSelection() method as described in the reference section. Also see the handling events page to learn how to handle events.
The Ready Event

Any visualization should fire a "ready" event that works in a standard way to let the developer know when the visualization is ready to process called methods. (However, there is no absolute requirement that a visualization behave this way; check the documentation for your visualization).

In general, visualizations that expose the "ready" event are designed with the following specifications:

The convention is that visualizations which do not fire a "ready" event are ready for interaction immediately after the draw method ends and returns control to the user.

More Information

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2024-07-10 UTC.

[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-07-10 UTC."],[[["Visualization creators can fire custom events or standard events like 'select' and 'ready' using `google.visualization.events.trigger()`."],["The 'select' event is fired when a user interacts with data, requiring `getSelection()` and `setSelection()` methods for data retrieval and manipulation."],["The 'ready' event signals that a visualization is ready for user interaction, typically fired after the `draw()` method completes; any interaction before this event might not work as expected."],["Host pages can listen for these events using `google.visualization.events.addListener()` or `google.visualization.events.addOneTimeListener()` to respond accordingly."],["While each visualization defines its own events, the 'select' and 'ready' events follow specific guidelines for consistency and usability."]]],[]]


RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4