실행 이벤트

시각화는 호스트 페이지에서 수신하도록 등록할 수 있는 이벤트를 실행할 수 있습니다. 이벤트는 사용자 작업(예: 사용자가 차트 클릭)에 의해 시작되거나 내부 이벤트(예: 10초마다 이벤트 실행)로 시작될 수 있습니다. 특정 이벤트가 발생할 때마다 해당 이벤트와 관련된 데이터를 사용하여 호출되도록 JavaScript 메서드를 등록할 수 있습니다.

모든 시각화는 자체 이벤트를 정의하며, 해당 시각화를 위한 문서에서는 각 이벤트가 실행되는 시점, 의미, 이벤트 핸들러에 전송하는 정보를 설명해야 합니다 (예: 조직 차트 시각화 참고). 이 페이지에서는 시각화 생성자가 이벤트를 실행하는 방법을 설명합니다. 클라이언트가 이벤트를 수신하기 위해 등록하는 방법을 알아보려면 이벤트 처리 페이지를 참고하세요.

선택 가능한 시각화에서 실행해야 하는 하나의 이벤트, 즉 select 이벤트가 있습니다. 그러나 이 이벤트의 동작과 의미는 각 시각화에 의해 정의됩니다.

draw 메서드가 사용자에게 컨트롤을 반환한 직후 시각화가 상호작용할 준비가 되지 않았다면 준비 이벤트인 시각화가 실행되어야 합니다. 이 이벤트의 정확한 동작과 의미는 준비된 이벤트 섹션에 정의되어 있습니다.

시각화 API 이벤트는 표준 DOM 이벤트와 별개이며 서로 다르다는 점에 유의해야 합니다.

목차

이벤트 실행

시각화에서 이벤트를 실행하려면 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', {});
};

호스팅 페이지는 google.visualization.events.addListener() 또는 google.visualization.events.addOneTimeListener()를 호출하여 이벤트를 수신하도록 등록할 수 있습니다. 발생하는 모든 이벤트를 철저히 기록해야 합니다.

Select Event

'select' 이벤트는 사용자 마우스 클릭에 대한 응답으로 많은 시각화에서 발생하는 표준 이벤트입니다. 마우스 클릭에 대한 응답으로 이벤트를 실행하려면 아래에 설명된 표준 방식으로 'select' 이벤트를 구현해야 합니다.

  1. 사용자가 시각화에서 일부 데이터를 선택하면 이름이 'select'인 이벤트를 실행합니다. 이벤트는 수신 대기 함수에 인수를 보내지 않습니다.
  2. 연결된 문서 섹션에 설명된 대로 getSelection() 메서드를 노출합니다. 이 메서드는 사용자가 선택한 data 요소의 색인을 반환해야 합니다.
  3. 참조 섹션에 설명된 대로 setSelection() 메서드를 노출합니다. 또한 이벤트 처리 방법을 알아보려면 이벤트 처리 페이지를 참고하세요.

준비 이벤트

모든 시각화는 표준 방식으로 작동하는 '준비됨' 이벤트를 실행하여 메서드라는 시각화를 처리할 준비가 되었음을 개발자에게 알려야 합니다. (그러나 시각화가 이러한 방식으로 작동해야 한다는 절대적인 요구사항은 없습니다. 시각화 문서를 확인하세요.)

일반적으로 'ready' 이벤트를 노출하는 시각화는 다음 사양에 따라 디자인됩니다.

  • 준비 이벤트는 어떤 속성도 핸들러에 전달하지 않습니다 (함수 핸들러는 매개변수가 전달될 것으로 예상해서는 안 됨).
  • 시각화가 상호작용할 준비가 되면 시각화가 준비된 이벤트를 실행해야 합니다 . 시각화 그리기가 비동기식인 경우 draw 메서드가 종료될 때뿐만 아니라 상호작용 메서드를 실제로 호출할 수 있을 때 이벤트가 실행되는 것이 중요합니다.
  • draw 메서드를 호출하기 전에 이 이벤트에 리스너를 추가해야 합니다. 그러지 않으면 리스너가 설정되기 전에 이벤트가 발생할 수 있고 이를 포착할 수 없기 때문입니다.
  • 준비된 이벤트가 실행되기 전에 상호작용 메서드를 호출하면 이러한 메서드가 제대로 작동하지 않을 위험이 있습니다.

'준비됨' 이벤트를 실행하지 않는 시각화는 draw 메서드가 종료되고 사용자에게 제어권을 반환하는 즉시 상호작용할 준비가 되는 것이 규칙입니다.

추가 정보