차트 요소 강조 표시

전제 조건

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

구문

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

charts.setHighlight(selectionFilter);

dashboard.getChart('<chartID>');

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

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

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

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

const highlight = chart.getHighlight();

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

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

• $eq (equality) 지원되는모든 차트 유형에 대한 일치입니다.

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

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

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

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

차트 유형

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

• 단계구분도 차트
• 열 및 막대 차트
• 테이블
• 도넛 차트
• 선형 및 꺾은선형 차트

• 비지역 히트맵