차트 요소 강조 표시

전제 조건

시작 하기 전에 버전 2.1.0 이상 차트 임베딩 JavaScript SDK.

구문

강조 표시를 활성화하는 차트 임베딩 JavaScript SDK 메서드의 구문은 다음과 같습니다.

charts.setHighlight(selectionFilter);

dashboard.getChart('<chartID>');

setHighlight 메서드는 MQL 필터를 사용합니다. 아래 예제에 표시된 대로 setHighlight 메서드에 직접 MQL 필터를 제공하거나 클릭 이벤트 페이로드 selectionFilter 를 통해 제공하여 특정 요소와 클릭 이벤트를 강조 표시할 수 있습니다.

chart.setHighlight(
  {
    city: { $nin: ['New York', 'London', 'Paris'] }
  }
)

selectionFilter 은(는) 차트의 카테고리 또는 시리즈 채널에 사용된 값과 일치해야 합니다.

Atlas Charts 임베딩 JavaScript SDK에는 강조 표시 쿼리를 검색하기 위한 highlight 옵션도 포함되어 있습니다.

const highlight = chart.getHighlight();

highlight 옵션은 MQL 필터를 나타내는 Javascript 객체의 매개 변수를 사용합니다. 차트를 만들 때 또는 차트가 렌더링된 후에 highlight 옵션을 설정할 수 있습니다.

다음 쿼리 요소를 포함할 수 있습니다.

• 지원되는 모든 차트 유형 에 대해 $eq(동등성) 이 일치합니다.

• 지원되는 모든 차트 유형 에 대해 $in 을 입력합니다.

• 선형 및 영역 Charts , 열 차트 및 막대 Charts, 비 지역 히트맵 을$nin 확인합니다.

• 선형 및 영역 Charts , 열 차트와 막대 Charts , 비 지역 히트맵 에 대해 지정된 범위 내의 숫자 또는 날짜 빈과 일치하는$gte 및 $lt 범위 를 닫습니다.

• 연속형 선형 및 영역 Charts 의 경우 X축의 $gt, $gte, $lt 및 $lte열린 범위 .

차트 유형

프로그래밍 방식 강조 표시를 지원하는 차트 유형은 다음과 같습니다.

• 단계구분도 차트

• 열 및 막대 차트

• 테이블

• 도넛 차트

• 선형 및 꺾은선형 차트

• 비지역 히트맵