API
SeriesSelectionOptions

SeriesSelectionOptions extends ChartItemOptions

데이터포인트 선택 설정.
선택 상태는 포인터가 벗어나도 유지되며 hover와 독립적으로 동작한다.
선택 상태는 차트 전역으로 관리되므로 chart.selection으로 함께 다룰 수 있다.
선택 상태 스타일(style · unselectedStyle · focus의 style)은 지정한 것이 그 상태의 기본 표시보다 우선한다.

  • 스타일셋: 기본 표시(css) 위에 inline으로 얹혀 지정한 속성만 덮어쓴다. 시리즈의 hoverStyle보다 우선하므로 hover 중에도 유지된다.
  • css selector(class 이름): 그 상태의 기본 css(.rct-point-selected 등) 대신 .rct-point-selected-custom 같은 상태 class와 지정한 class가 붙어, 그 상태의 모양은 지정한 class가 정한다. hover 중에는 기본 hover 표시와 스타일셋으로 준 hoverStyle이 class보다 우선한다 (class로 준 hoverStyle과의 사이는 css 특이도 · 순서를 따른다). hover 중에도 유지하려면 스타일셋을 쓴다. 기본 hover 표시만 이기면 된다면 .rct-series .rct-point.my-class처럼 특이도를 높이고 !important를 붙여도 된다.
  • inline 스타일셋은 class보다 우선하므로 한 데이터포인트에 겹치는 선택 · focus 스타일은 같은 형태로 지정한다.
  • 옛 selectStyle · focusStyle에 준 class는 v1.5.1처럼 기본 표시 class와 함께 붙는다. 기본 표시가 !important로 정한 속성(테두리 · 흐리기 · 그림자)은 바뀌지 않으므로, 바꾸려면 이 설정의 style · focus의 style로 옮긴다.

[주의] bar · circlebar · pie 시리즈와 pictogram 모듈의 pictorialbar 시리즈에서 지원한다. waterfall · histogram · barrange · funnel 등 다른 시리즈는 지원하지 않는다.

Options

focus: boolean (opens in a new tab) | SelectionFocusOptions

가장 마지막에 선택된(focus) 데이터포인트의 표시 설정.
false를 지정하면 focus 표시를 하지 않는다.

default :undefined

style: SVGStyles | string (opens in a new tab)

선택된 데이터포인트에 적용되는 스타일셋 또는 css selector (opens in a new tab).
focus 데이터포인트에는 focus의 style이 이 스타일보다 우선 적용된다. 스타일셋과 class의 적용 방식(기본 표시 · hover와의 우선순위)은 이 설정의 설명을 참조한다.

default :undefined

unselectedStyle: SVGStyles | string (opens in a new tab)

차트에 선택된 데이터포인트가 하나라도 화면에 있을 때, 이 시리즈의 선택되지 않은 데이터포인트에 적용되는 스타일셋 또는 css selector (opens in a new tab).
지정하지 않으면 기본 css(.rct-point-unselected)만 적용된다. 기본 css의 흐리기(opacity)를 끄려면 { opacity: 1 }을 지정한다.
선택이 모두 해제되거나, 선택한 데이터포인트가 모두 숨겨지면(범례 · 그룹 숨김 · 확대 등) 적용하지 않는다. 선택할 수 없는 시리즈(visible이 false)는 흐리지 않는다.
스타일셋으로 지정하면 hover 표시보다 우선하므로 hover 중에도 이 스타일이 유지된다. class로 지정하면 기본 흐리기와 같이 hover 중에는 풀린다.

default :undefined

visible: boolean (opens in a new tab)

데이터포인트를 선택할 수 있는지 여부.
마우스 클릭과 chart.selection API에 모두 적용된다. false면 chart.selectAll과 chart.selection의 select · add도 이 시리즈의 데이터포인트를 고르지 않는다.

  • 클릭: 기존 선택을 해제하고 하나만 선택한다. 단독 선택된 포인트를 다시 클릭하면 해제된다.
  • Shift · Ctrl(Windows) · Cmd(macOS) + 클릭: 기존 선택을 유지하면서 선택을 toggle한다.
  • 터치에서 길게 누름: modifier + 클릭과 동일하게 toggle한다. 데이터포인트가 아닌 곳을 길게 누르면 선택은 그대로 둔다.
  • 터치 tap: 클릭과 같다. 다만 툴팁이 고정된 포인트를 다시 tap하면 먼저 툴팁만 닫히고 선택은 유지된다. 그다음 tap은 일반 클릭처럼 처리되어, 단독 선택된 포인트면 해제하고 여러 포인트가 선택되어 있으면 그 포인트만 선택한다. 툴팁 말풍선을 tap하거나 길게 눌러도 선택은 그대로 남는다. 말풍선 아래의 데이터포인트 · 범례 · 어노테이션 · 버튼은 그것을 누른 것과 같다. 툴팁이 언제 닫히는지는 tooltip.followTouch를 참조한다.
  • 빈 영역 클릭 · tap: 전체 선택과 focus를 해제한다. 빈 영역은 차트 안에서 범례 · 버튼 · 어노테이션 같은 클릭 대상이 아닌 곳으로, plot 의 빈 곳뿐 아니라 제목 · 축도 포함한다(split 도 같다). 데이터포인트 라벨 위와 선택을 쓰지 않는 시리즈의 데이터포인트는 빈 영역으로 보지 않는다.
  • 마우스로 끌고 놓기: 클릭이 아니므로 선택이 바뀌지 않는다. 포인트 위에서 줌 드래그를 시작해도 마찬가지다.

실행 중에 false로 바꾸면 이미 선택된 데이터포인트는 다음 렌더링에서 해제되고 onSelectionChanged가 호출된다. 한 번 해제된 선택은 다시 켜도 되살아나지 않는다. 다음 렌더링 전에 다시 켜면 선택은 그대로 남는다.
지정하지 않으면 시리즈의 selectable을 따른다.

default :false