API
WaffleSeriesOptions

WaffleSeriesOptions extends SparkSeriesOptions

value로 지정된 연관된 값들을 waffle 차트로 표시한다.
type'waffle'이다.

Options

callout: boolean (opens in a new tab) | DataPointCalloutOptions

데이터포인트 위치에서 선을 그어 떨어뜨려 표시하는 옵션.
데이터가 밀집된 지역이나 겹치는 값들 사이에서 분리하여 배치하기 위해 사용한다.
data의 offset 속성에서 [경도 변화량, 위도 변화량]으로 지정한 값들로 선을 남기며 이동시킨다.
ex) [{ offset: [[0, 2], [1, -1]], value: 100 }, ...]

default :undefined

categories: Array (opens in a new tab)<SparkSeriesCategory>

데이터포인트의 값이 복수개일 때 값별 색상을 순서대로 지정한다.
color 항목이 설정되지 않으면 데이터포인트의 기본 색상이 사용된다. 또, legendByCategorytrue이면 여기에 지정된 색상별로 legend에 표시된다.

default :undefined

colCount: number (opens in a new tab)

default :10

color: string (opens in a new tab) | number (opens in a new tab)

데이터 포인트 기본 색.
숫자로 지정하면 정수로 변환된 값에 해당하는 팔레트 색상으로 설정된다. 'var(--color-n)'으로 지정한 것과 동일하며, 1 ~ 12 사이의 값으로 지정한다.
style로 지정된 색상보다는 우선하지만, pointColorsstyleCallback으로 설정된 색상이 이 속성으로 설정한 색상보다 우선한다.

default :undefined

colorField: string (opens in a new tab)

data로 전달되는 데이터포인트 생성 객체들의 'color' 속성 값 대신, 이 속성으로 지정된 값을 데이터포인트 기본 색상으로 적용한다.

default :undefined

data: any (opens in a new tab)

데이터포인트 목록을 생성하는 데 참조되는 데이터셋.
createChartAsync를 호출해서 비동기로 맵차트를 생성할 때는 dataUrl로 원격 데이터 소스를 지정할 수 있다.

default :undefined

dataUrl: string (opens in a new tab)

시리즈 데이터의 외부 경로.
createChartAsync 호출 시, 해당 url로 GET 요청을 전송하여 데이터를 다운받고, 해당 시리즈의 data 속성에 저장한다.
data가 설정되면 이 속성은 무시된다. 또, 비동기 함수가 아닌 createChart로 차트를 생성할 때 이 속성으로 data를 설정하려는 경우 콘솔에 경고 메시지가 표시된다.

default :undefined

fields: Array (opens in a new tab)<string (opens in a new tab)>

data가 array로 제공되어 datapoint로 생성될 때, array의 각 항목에 해당하는 이름으로 datapoint source의 값을 사용한다.

default :undefined

fillDirection: 'col' | 'row'

cell 들을 채워나가는 방향을 지정한다.

  • 'col' 왼쪽 행(column)부터 오른쪽로 채워가면서 fillThreshold에 도달하면 위쪽으로 채워 나간다.
  • 'row' 야래쪽 행(row)부터 위로 채워가면서 fillThreshold에 도달하면 오른쪽으로 채워 나간다.

default :'col'

fillThreshold: number (opens in a new tab)

fillDirection'colFirst''rowFirst'일 때, 방향을 바꾸게 하는 기준 셀 개수.
1 이상이어야 하고, fillDirection에 따라 rowCountcolCount 미만 크기로 지정해야 한다.

default :1

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

데이터포인트 위에 마우스가 있을 때 적용되는 스타일셋 혹은 class selector.

default :undefined

idField: string (opens in a new tab)

data로 전달되는 데이터포인트 생성 객체들의 'id' 속성 값 대신, 이 속성으로 지정된 값을 데이터포인트 id로 설정한다.

default :'id'

label: string (opens in a new tab)

이 시리즈를 나타내는 텍스트.
레전드나 툴팁에서 시리즈를 대표한다. 이 속성이 지정되지 않으면 name이 사용된다.

default :undefined

latField: string (opens in a new tab)

data로 전달되는 데이터포인트 생성 객체들의 'lat' 속성 값 대신, 이 속성으로 지정된 값을 데이터포인트 위도 값으로 설정한다.

default :'lat'

legendByCategory: boolean (opens in a new tab)

true로 지정되고 categories가 지정되면 차트 legend에 category별로 항목이 표시된다.

default :undefined

lonField: string (opens in a new tab)

data로 전달되는 데이터포인트 생성 객체들의 'lon' 속성 값 대신, 이 속성으로 지정된 값을 데이터포인트 경도 값으로 설정한다.

default :'lon'

map: string (opens in a new tab) | number (opens in a new tab)

명시적으로 이 속성을 지정하면, 관련된 맵이 차트에 활성됐을 때만 시리즈가 표시된다.

default :undefined

maxValue: number (opens in a new tab)

valueDomain 설정에 따라 개별 데이터포인트나 시리즈의 전체 데이터포인트 값들로 부터 계산된 최대값 보다 이 속성에 지정한 값이 크면 그 값을 기준 최대값으로 한다.

default :undefined

minCount: number (opens in a new tab)

최소 cell 개수.

default :1

minSize: number (opens in a new tab)

이 값을 0보다 크고 1보다 작은 값으로 지정하면, 데이터포인트 최대값을 기준으로 기본 크기에 대한 상대 크기로 표시된다.

default :undefined

minValue: number (opens in a new tab)

valueDomain 설정에 따라 개별 데이터포인트나 시리즈의 전체 데이터포인트 값들로 부터 계산된 최소값 보다 이 속성에 지정한 값이 작으면 그 값을 기준 최소값으로 한다.

default :undefined

name: string (opens in a new tab)

시리즈 이름.
시리즈를 구분하기 위한 이름으로 사용된다.

default :undefined

nameField: string (opens in a new tab)

data로 전달되는 데이터포인트 생성 객체들의 'name' 속성 값 대신, 이 속성으로 지정된 값을 데이터포인트 이름으로 설정한다.

default :'name'

onPointClick: PointClickCallback

데이터 point가 클릭될 때 호출되는 이벤트 콜백.
명시적 true를 리턴하면 기본 동작이 진행되지 않는다.

default :undefined

onPointHover: PointHoverCallback

마우스가 데이터 point 위에 올라가거나 빠져나갈 때 호출되는 이벤트 콜백.
빠져나가는 경우 args 매개변수는 null이다.

default :undefined

onPointsLoaded: (series: object (opens in a new tab), firstTime: boolean (opens in a new tab)) => void (opens in a new tab)

default :undefined

pointColors: string (opens in a new tab) | Array (opens in a new tab)<string (opens in a new tab) | >>

color 속성이 명시적으로 지정되지 않은 데이터포인터의 color 속성을 지정한다.
색 배열로 지정하거나, 'colors' asset으로 등록된 이름을 지정할 수 있다.
시리즈 style이나 color로 지정된 색 보다는 우선하지만, styleCallback에서 설정된 색상이나 데이터포인트별로 지정한 색상이 이 속성으로 설정된 색상보다 우선한다.

default :undefined

pointLabel: boolean (opens in a new tab) | DataPointLabelOptions

데이터포인트 label 설정 옵션.

default :undefined

position: 'bottom' | 'center' | 'left' | 'right' | 'top'

데이터포인트 좌표 기준 spark chart 표시 위치.

  • 'bottom' 데이터포인트 위치가 이미지 등 아이템의 위쪽이 되도록 표시한다.
  • 'center' 데이터포인트 위치가 이미지 등 아이템의 중앙이 되도록 표시한다.
  • 'left' 데이터포인트 위치가 이미지 등 아이템의 오른쪽이 되도록 표시한다.
  • 'right' 데이터포인트 위치가 이미지 등 아이템의 왼쪽이 되도록 표시한다.
  • 'top' 데이터포인트 위치가 이미지 등 아이템의 아래쪽이 되도록 표시한다.

default :'top'

rotation: number (opens in a new tab)

데이터포인트 도형 회전 각도.

default :undefined

roundingMethod: 'round' | 'trunc'

default :'round'

rowCount: number (opens in a new tab)

default :10

showNull: boolean (opens in a new tab)

true로 지정하면 값에 포함되지 않는 셀들을 nullStyle을 적용해서 표시한다.

default :false;

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

스타일셋 혹은 class selector.

default :undefined

styleCallback: PointStyleCallback

데이터 point의 동적 스타일 콜백.
style, pointColors 등 다른 스타일 지정들 보다 우선한다.

default :undefined

tooltipText: string (opens in a new tab)

데이터포인트 툴팁 텍스트.

default :undefined

valueDomain: 'point' | 'series'

  • 'point'
  • 'series'

default :'series'

valueField: string (opens in a new tab)

data로 전달되는 데이터포인트 생성 객체들의 'value' 속성 값 대신, 이 속성으로 지정된 값을 데이터포인트 값으로 적용한다.

default :undefined

visible: boolean (opens in a new tab)

표시 여부.

default :true

visibleInLegend: boolean (opens in a new tab)

명시적 false로 지정하면 legend에 표시하지 않는다.

default :true