문서
리포트 아이템
Map
Series
시리즈 공통 속성

시리즈 공통 속성

리얼맵차트 시리즈의 공통 속성에 대한 설명입니다.

Basic

이름타입설명필수여부
Visibleboolean시리즈의 표시 여부를 설정합니다.yes
Typestring시리즈의 타입을 보여줍니다.yes
Namestring시리즈에 고유한 이름을 설정합니다.no

Visible

시리즈의 표시 여부를 설정합니다.

  • 타입: boolean
  • 기본값: true

Type

시리즈의 타입을 보여줍니다.

  • 타입: string
  • 기본값: string

Name

시리즈에 고유한 이름을 설정합니다.

  • 타입: string
  • 기본값: undefined

Data

이름타입설명필수여부
Datastring시리즈에 존재하는 데이터를 연결합니다.no

Data

시리즈에 리포트에 존재하는 데이터를 연결합니다.

  • 타입: string
  • 기본값: undefined

Series

이름타입설명필수여부
Value FieldstringData 속성에서 연결한 데이터 중 값으로 사용할 필드를 선택합니다.no
Data URLstring시리즈에 외부 경로로 데이터를 연결합니다.no
Map Keysstring[]맵 area와 연결할 키값들을 지정합니다.no
Legendstringlegend는 "이 시리즈가 어느 범례에 속하는지"를 알려주는 그룹 이름입니다.no
Point ColorsPointColorsCallback데이터에 해당하는 컬러를 지정하기 위한 콜백함수를 지정합니다.no
Style CallbackStyleCallback데이터에 스타일을 지정하기 위한 콜백함수를 지정합니다.no

Value Field

Data 속성에서 연결한 데이터 중 값으로 사용할 필드를 선택합니다.

  • 타입: string
  • 기본값: undefined

Data URL

시리에 외부 경로를 통해 전달받은 데이터를 연결합니다.

  • 타입: string
  • 기본값: undefined

Map Keys

맵 area와 연결할 키값들을 지정합니다. 두 값을 배열로 지정하면 첫번째 문자열은 맵소스 "properties"의 속성명, 두번째는 데이터포인트의 속성명입니다. 값을 하나만 지정하면 양쪽 같은 속성명으로 연결합니다.

  • 타입: string[]
  • 기본값: undefined

입력시 ,로 구분하여 여러 값을 입력할 수 있습니다.

사용예
'b-code', 'code'

Legend

legend는 "이 시리즈가 어느 범례에 속하는지"를 알려주는 그룹 이름입니다.

💡

Legend 속성 목록에 설정한 이름(Name)으로 설정해야합니다.

Legend By Category 속성을 비활성화 할 경우 Name 속성의 값이 범례에 포함됩니다. 반대로 속성을 활성화 하면 Category로 설정한 이름이 범례에 모두 포함됩니다.

  • 타입: string
  • 기본값: undefined

사용 가능한 시리즈

Point Colors

데이터에 해당하는 컬러를 지정합니다.

  • 타입: PointColorsCallback
  • 기본값: undefined

콜백함수로 전달 받은 DataPoint 값을 통해서 컬러를 반환하면 지도에 해당 컬러로 지정됩니다.

사용예
const ratio = point.source.genderRatio;
if (ratio < 1) return '#FFD5A3';
 
return '#FCE7C8';

Style Callback

데이터에 스타일을 지정하기 위한 콜백함수를 지정합니다.

  • 타입: StyleCallback
  • 기본값: undefined

콜백함수로 전달 받은 DataPoint 값을 통해서 스타일을 반환하면 지도에 해당 스타일로 지정됩니다. style, pointColors 등 다른 스타일 설정들 보다 우선합니다.

사용예
const { source } = args;
const { id, name } = source;
 
switch (name) {
  case '서울특별시':
    return {
      fill: '#d3f9d8',
    };
  case '세종특별자치시':
    return {
      fill: '#f3d9fa',
    };
}
 
return {
  stroke: '#1c7ed6',
  strokeWidth: '0.5',
  fill: '#f1f3f5'
};

Styles

이름타입설명필수여부
Fillstring배경 색상을 설정합니다.no
Strokestring테두리를 설정합니다.no
Stroke Widthnumber테두리 두께를 설정합니다.no

Fill

데이터가 표시되는 도형의 내부를 채우는 색상을 지정합니다.

  • 타입: string
  • 기본값: undefined

Stroke

데이터 도형의 테두리 색상을 지정합니다.

  • 타입: string
  • 기본값: undefined

Stroke Width

데이터 도형의 테두리 두께을 지정합니다.

  • 타입: number
  • 기본값: undefined