Parallel Coordinates

평행 좌표(Parallel Coordinates)는 ParCoords를 이용해 제작한다. 해당 모듈은 ParCoords 타입을 그대로 노출하는 대신에 MarkerMap 인스턴스를 생성하는 함수를 반환한다. 클라이언트 단에서 전체 모듈을 번들링한 형태로 사용할 때는 daisy.parCoords()을 실행하여 ParCoords 인스턴스를 생성한다. 모듈별로 사용할 때에는 아래와 같이 ParCoords 모듈만을 불러와서 사용해도 좋다.

import parCoords from 'daisy-chart/src/layouts/par-coords'
parCoords().container('#chart-container')
  .data(dataset)
  .dimensions(['key'])
  .measures(['value1', 'value2'])
  .axis('y')
  .render();

평행 좌표의 유형은 범주(dimension), 수치(measure)의 조합과 형태 변형을 위한 옵션에 의해 형태가 결정된다. 그 예시는 아래와 같다.

• 수치 : 2개 이상의 수치를 추가해야하며, 각각의 수치는 개별 축으로 표현된다. 각각의 데이터 요소별로 수치 값을 연결하여 개별별 시리즈(series)로 표현한다.

• 범주 : 1개의 범주를 추가 가능하며, 해당 범주에 따라 시리즈를 다른 색상으로 표현한다.

• 형태 : parCoords.shape 설정에 따라 평행좌표나 스캐터플롯 매트랙스 형태로 변형된다.

API Reference

# parCoords.shape([shape]) <>

shape을 par-coords|scatter-matrix 중 선택하여 평행좌표나 스캐터플롯 매트릭스 형태로 변환한다. 기본 값은 par-coords 이다.

# parCoords.size([size]) <>

평행좌표 선의 굵기나 스캐터플롯 원의 반지름 형태를 px 단위로 전달한다. 기본 설정값은 1 이다.

# scatter.regionPadding([regionPadding]) <>

parCoords.shape이 scatter-matrix로 설정되었을 때, 영역간의 간격 비율을 d3.scaleBand.padding의 규칙에 따라 설정한다. 기본 설정값은 0.1 이다.