realmap

declare const PI: number; declare const PI_2: number; declare const ORG_ANGLE: number; declare const DEG_RAD: number; declare const RAD_DEG: number; type Path = string | any[]; declare const floor: (x: number) => number; declare const ceil: (x: number) => number; declare function fixnum(value: number): number; declare function pixel(v: number): string; /** * 123, '10%' 형식으로 크기를 지정한다. */ type PercentSize = string | number; interface IPercentSize { size: number; fixed: boolean; } declare function parsePercentSize(sv: PercentSize, enableNull: boolean): IPercentSize; declare function calcPercent(size: IPercentSize, domain: number, def?: number): number; /** * SVG 스타일 속성. * {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute SVG 속성}을 참조한다. */ interface SVGStyles { transform?: string; transformBox?: string; transformOrigin?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/fill fill} 스타일 속성. */ fill?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/filter filter} 스타일 속성. */ filter?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/fill-opacity fill-opacity} 스타일 속성. */ fillOpacity?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke stroke} 스타일 속성. */ stroke?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-width stroke-width} 스타일 속성. */ strokeWidth?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray stroke-dasharray} 스타일 속성. */ strokeDasharray?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/font-family font-family} 스타일 속성. */ fontFamily?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/font-size font-size} 스타일 속성. */ fontSize?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/font-weight font-weight} 스타일 속성. */ fontWeight?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/font-style font-style} 스타일 속성. */ fontStyle?: string; /** * SVG에 적용되는 css {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/rx rx} 스타일 속성. * {@link https://realmap.co.kr/config/config/seires/bar bar} 시리즈의 데이터포인트 bar의 모서리를 지정하는 데 사용된다. */ rx?: string; /** * 텍스트 정렬을 지정한다. * **SVG에 적용되는 정식 css style 속성이 아니다.** * 즉, HTML이나 realmap-style.css 등의 외부 css 파일에서 사용할 수 없고, * RealMap 내부에서 {@link https://realmap.co.kr/config/config/title title} 등의 inline 스타일 속성으로 지정할 수 있다. * * ```js * const config = { * subtitle: { * style: { * textAlign: 'left', * }, * }, * }; * ``` */ textAlign?: Align; /** * **SVG에 적용되는 정식 css style 속성이 아니다.** * 데이터포인트 라벨등 몇 요소의 배경 간격 설정으로 사용할 수 있다. */ padding?: string; } /** {@link it.SVGStyles SVGStyles} 또는 class 이름 */ type SVGStyleOrClass = SVGStyles | string; /** * CSS 선언 블록을 나타내는 객체로, 스타일 정보뿐만 아니라 다양한 스타일 관련 메서드와 속성들을 제공한다. * https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration */ interface CSSStyles extends Partial<CSSStyleDeclaration> { } /** @private */ interface CSSStyles2 extends CSSStyles { display?: string; position?: string; alignItems?: string; justifyContent?: string; flexDirection?: string; flexWrap?: string; gap?: string; flex?: string; width?: string; height?: string; minHeight?: string; minWidth?: string; maxWidth?: string; left?: string; top?: string; overflow?: string; marginRight?: string; whiteSpace?: string; margin?: string; marginLeft?: string; pointerEvents?: string; transform?: string; } interface ISides { left: number; right: number; top: number; bottom: number; horz?: number; vert?: number; } /** * 스와이프 제스처 등의 진행 방향. * * * @see {@link RtListControl.onRowSwipe onRowSwipe} */ declare enum RmDirection { /** * 위쪽으로 진행. */ UP = "up", /** * 아래쪽으로 진행. */ DOWN = "down", /** * 왼쪽으로 진행. */ LEFT = "left", /** * 오른쪽으로 진행. */ RIGHT = "right" } /** * 수평 정렬. * @enum */ declare const _Align: { /** * 왼쪽으로 정렬한다. */ readonly LEFT: "left"; /** * 영역 가운데로 정렬한다. */ readonly CENTER: "center"; /** * 오른쪽으로 정렬한다. */ readonly RIGHT: "right"; }; /** @dummy */ type Align = typeof _Align[keyof typeof _Align]; /** * 수직 정렬. * @enum */ declare const _VerticalAlign: { /** */ readonly TOP: "top"; /** */ readonly MIDDLE: "middle"; /** */ readonly BOTTOM: "bottom"; }; /** @dummy */ type VerticalAlign = typeof _VerticalAlign[keyof typeof _VerticalAlign]; /** * @enum */ declare const _AlignBase: { /** * */ readonly CHART: "chart"; /** * */ readonly MAP: "map"; /** * 상위 모델이 존재하는 경우 상위 모델 영역 기준.\ * 상위가 없으면 기본값(대부분 'body')과 동일. * ex) subtitle인 경우 title 기준. * * */ readonly PARENT: "parent"; }; /** @dummy */ type AlignBase = typeof _AlignBase[keyof typeof _AlignBase]; /** * @enum */ declare const _WritingMode: { /** */ readonly HORIZONTAL_TB: "horizontal-tb"; /** */ readonly VERTICAL_LR: "vertical-lr"; /** */ readonly VERTICAL_RL: "vertical-rl"; }; /** @dummy */ type WritingMode = typeof _WritingMode[keyof typeof _WritingMode]; /** * @enum */ declare const _TextOrientation: { /** */ readonly MIXED: "mixed"; /** */ readonly UPRIGHT: "upright"; }; /** @dummy */ type TextOrientation = typeof _TextOrientation[keyof typeof _TextOrientation]; interface ColorRange { minValue?: number; maxValue?: number; minColor?: string; maxColor?: string; /** * 2 이상의 값으로 지정하면, * 데이터포인트 값들을 이 속성값을 base로 하는 log 값으로 변환해서 표시한다. */ logBase?: number; } interface IPaddings { l: number; r: number; t: number; b: number; } /** * @enum * * Legend나 ColorScale 등 맵차트 구성 요소들의 표시 위치. * 위치를 지정한 후 다른 속성들로 정렬시킬 수 있다. */ declare const _ChartItemLocation: { /** * 맵차트 본체 아래 표시한다. * */ readonly BOTTOM: "bottom"; /** * 맵차트 타이틀 아래 표시한다. * */ readonly TOP: "top"; /** * 맵차트 본체 오른쪽에 표시한다. * */ readonly RIGHT: "right"; /** * 맵차트 본체 왼쪽에 표시한다. * */ readonly LEFT: "left"; /** * 맵차트 본체 영역 내부에 표시한다. * */ readonly BODY: "body"; }; /** @dummy */ type ChartItemLocation = typeof _ChartItemLocation[keyof typeof _ChartItemLocation]; /** * 구성 요소 위치. */ type Positions = 'top' | 'right' | 'bottom' | 'left'; interface ConfigObject { [key: string]: any; } type ShapeDrawer = (rd: number, rd2: number) => (string | number)[]; /** * 맵 좌표. [경도, 위도] */ type MapCoord = [number, number]; type MapRect = { h1: number; h2: number; v1: number; v2: number; }; type MapArc = MapCoord[]; type MapPolygon = MapArc[]; type MapProps = any; declare function parseCoord(v: any): MapCoord; /** * RealReport-Chart 라이브러리 클래스 모델의 최상위 base 클래스. * * * @see concepts.dev_guide 개발 가이드 * @see concepts.about RealTouch 개요 */ declare abstract class RmObject { private $_hash; private $_destroyed; private $_destroying; constructor(noHash?: boolean); /** * 객체가 소유한 참조 등을 해제하고 null을 리턴한다. * * ``` * list = lis.destroy(); * ``` * * @returns null */ destroy(): null; protected _doDestory(): void; get destroying(): boolean; get orphaned(): boolean; get hash(): string; isMe(hash: string): boolean; toString(): string; /** * @private * * template param으로부터 생성되는 값은 문자열일 수 있다. */ toBool(v: any): boolean; toNum(v: any, def?: number): number; } declare abstract class RmEventProvider<T> extends RmObject { private _listeners; _addListener(listener: T): void; _removeListener(listener: T): void; /** * event로 지정한 함수가 정의된 모든 리스너에 대해 실행한다. * 리스너 scope으로 실행하고, 첫번째 매개변수로 이 객체가 전달된다. * 다만, 리스너들 중 하나라도 undefined가 아닌 값을 리턴하면, * 그 값을 리턴하면서 멈춘다. */ protected _fireEvent(event: string, ...args: any[]): any; } interface MapInsetDisplay { /** * inset area 확대 비율. * 지정하지 않으면 1. * 0보다 큰 값이어야 한다. */ readonly scale?: number; /** * inset area의 [왼쪽, 위쪽] 기준으로, 표시 위치 [경도, 위도]를 도(°) 단위로 지정한다. * [주의] {@link MapInset.children children}으로 적용될 때는 이 값 대신 {@link offset}을 반드시 지정해야 한다. */ readonly coord?: MapCoord; /** * coord로 지정한 inset 위치에 더 추가되는 [경도, 위도] 값이거나 * coord가 지정되지 않은 경우 원래 위치에서 떨어진 위치 값. * 라이브러리에서 제공하는 미리 정의된 inset 위치를 조정하는 값으로 사용할 수 있다. * [주의] {@link MapInset.children children}으로 적용될 때는 {@link coord} 대신 반드시 이 값을 지정해야 한다. */ readonly offset?: MapCoord; /** * inset을 구분하는 경계선을 도(°)단위로 지정한다. * 값들은 space나 ','로 분리해서 x, y 순서대로 위치를 지정하고, * 닫힌 다각형으로 지정하고 싶은 경우 마지막에 'z'나 'Z'을 추가한다. * 또, {@link frame}이 지정되면 이 값은 무시된다. * 값들은 각각 area 전체를 감싸는 가상의 사각형을 기준으로 작성하는데, * 아래 값들을 상수로 사용할 수 있고, +,- 연산자로 offset을 지정할 수 있다. * x값은 사각형 왼쪽(경도 시작접), y값은 사각형 아래쪽(위도 시작점)이 원점이 된다. * w와 h는 각각 사각형의 너비와 높이다. * x값은 원점에서 오른쪽으로 증가하고, y값은 원점에서 위쪽으로 증가한다. * ex) '-0.1 h+0.05 +0.1 h+0.1 w+0.2 h' // 제주도 위쪽에 꺽인 line을 표시한다. * '-0.2 -0.1 -0.2 h+0.1' // 울릉도 좌측에 직선으로 표시한다. */ readonly border?: MapCoord[] | string; /** * inset을 감싸서 구분하는 사각형을 도(°)단위로 지정한다. * 이 값이 지정되면 {@link border}는 무시된다. * css padding이나 margin 지정 방식과 동일하게 지정한댜. * 지정된 값은 area의 전체를 포함하는 가상의 사각형과 frame 사이의 간격으로 표시된다. * ex) '0.05' // 좌위상하 0.05° * '0.05 0.01' // 상하 0.05°, 좌우 0.01° * '0.05 0.01 0.03' // 상 0.05°, 우 0.01°, 하 0.03, 좌 0.01° * '0.05 0.01 0.03 0.02' // 상, 우, 하, 좌 */ readonly frame?: string; /** * border나 frame에 적용할 스타일셋. * 기본으로 'rm-map-series-inset' 클래스 선택자가 적용된다. */ readonly style?: SVGStyleOrClass; /** * 명시적 false로 지정하면 이 inset이 포함하는 영역을 맵에서 제거한다. * 대개 두 번째 map에서 사용된다. */ readonly visible?: boolean; } /** * 본토에서 멀리 떨어진 영역들을 당겨서 표시하는 설정. * [주의] 아래쪽 계산값들을 제외하곤 모두 readonly로 취급해야 한다. * * @css 'rm-map-series-inset' */ interface MapInset extends MapInsetDisplay { /** * inset시킬 area id. * 이 area가 존재하지 않고, * {@link parent}가 지정되지 않으면 * 자식들을 모두 함께 이동시킨다. */ readonly area: string; readonly name?: string; /** * 이 area가 존재하지 않고, * {@link MapInset.parent parent}가 지정되지 않으면 * 이 속성에 지정된 자식들을 모두 함께 이동시킨다. * [주의] {@link frame}이나 {@link border}의 기준이 되는 child area의 id를 첫번째 항목으로 설정해야 한다. * [주의] parent 하나에 한 번만 지정할 수 있다. */ readonly children?: string[]; /** * {@link area}가 존재하지 않을 때, * 이 속성에 해당하는 area를 찾아서 {@link polygons}에 해당하는 영역들을 이동시킨다. * 콤마로 분리해서 둘 이상의 area를 지정할 수 있는데, 순서대로 해당되는 영역이 존재하면 사용한다. * [주의] parent 하나에 한 번만 지정할 수 있다. */ readonly parent?: string; /** * {@link area}가 존재하지 않고, {@link parent}가 지정됐을 때, * 이 속성에 지정하는 영역들을 동시에 이동시킨다. * [주의] {@link frame}이나 {@link border}의 기준이 되는 polygon의 index를 첫번째 항목으로 설정해야 한다. * [주의] {@link parent}가 복수개로 지정되면 이 속성도 [[], [],..] 형태로 복수 개 지정해야 한다. * [주의] parent 하나에 한 번만 지정할 수 있다. */ readonly polygons?: number[] | number[][] | number; /** * @private * 계산된 값들. */ off?: MapCoord; box?: MapCoord[]; pts?: any[]; bounds?: MapRect; } type MapSourceMeta = { license?: { license?: string; author?: string; url?: string; etc?: "맵차트 최적화를 위해 좌표계 변환 및 Feature Polygon 수정"; }; dokdo?: { group?: string; parent?: number; index?: number; }; dummies?: string[]; }; /** * 접경선 정보. * 연결된 선으로 표시되므로, 반드시 접경선이 그려지는 순서대로 양쪽 area(들)을 지정해야 한다. */ type MapBorderSource = [string | [string], string | [string]]; /** * 맵시리즈에서 사용할 기본 맵을 지정한다. */ interface MapSource { /** * 맵 이름. * 맵차트에 여러 개 맵이 지정될 수 있으며, * 맵차트 시리즈 등에서 맵을 참조할 때 사용된다. */ name?: string; /** * 명시적 false로 지정하면 맵차트에서 맵으로 사용되지 않는다. * * @default true */ enabled?: boolean; /** * @deprecated use {@link source} **/ map?: any; /** * 영역들의 정보가 포함된 지도 데이터 소스. */ source?: any; /** * 외부 {@link source}를 가져올 위치. */ url?: string; /** * 맵 모델의 area를 구성할 때 area id로 사용할 소스의 속성 이름. */ idKey?: string; /** * 맵 모델의 area를 구성할 때 area name으로 사용할 소스의 속성 이름. */ nameKey?: string; /** * 맵차트 맵 모델을 구성할 때 제외시킬 영역들의 id 목록. */ exclude?: string[]; /** * 맵 인셋 목록을 지정한다. * 이름을 문자열로 지정하면 라이브러기가 기본 제공하는 인셋들이 사용된다. * 또, 이름앞에 '-'를 추가하면 visible이 false로 설정된다. */ insets?: (string | MapInset)[]; /** * 맵 상하좌우 주변에 추가할 영역의 크기를 도(°) 단위로 지정한다. * css padding이나 margin 지정 방식과 동일하게 지정한댜. */ padding?: string; /** * 지도에 독도에 대한 meta 정보가 있는 경우, * 독도와 울릉도 사이의 거리를 지정한 비율만큼으로 줄이거나 늘여서 표시한다. * 0 ~ 1 사이의 값으로 원래 간격에 대한 상대 거리를 지정한다. * 0 이하의 값으로 지정하면 dokdo를 표시하지 않는다. * [lon, lat] 형식으로 지정할 수도 있다. */ dokdo?: number | MapCoord; /** * dummy 영역들을 표시할지 여부. */ showDummies?: boolean; /** * @ignore * 로컬 지도가 글로벌 투영좌표계 중앙으로 배치할지 여부. * 첫번째 기준 map에만 설절할 수 있다. */ useOffset?: boolean | MapCoord; /** * 부극 취고위까지 지도에 포함되면 90도까지 그려진 것으로 간주한다. * 명시적 false로 지정하면 계산된 영역까지만 포함한다. */ alignArctic?: boolean; /** * 내부 경계(internal boundary)선 정보를 별도로 생성할 지 여부. */ needInternal?: boolean; /** * {@link needInternal 내부 경계선}에서 제외할 영역 목록. */ excludeInternal?: string[]; /** * 외부 경계선 정보를 별도로 생성할 지 여부. */ needExternal?: boolean; /** * {@link needInternal 내부 경계선}에서 제외할 영역 목록. */ excludeExternal?: string[]; /** * 접경선 목록. */ borders?: [{ name: string; border: MapBorderSource; closed?: boolean; }]; } declare abstract class MapSourceItem { id: string; constructor(id: string); } declare class AreaItem extends MapSourceItem { props: MapProps; polygon: MapPolygon; polygons: MapPolygon[]; internal?: MapPolygon[]; internals?: MapPolygon[][]; external?: MapPolygon[]; externals?: MapPolygon[][]; dummy: boolean; constructor(id: string, props: MapProps); } declare class MapBorderInfo { name: string; closed: boolean; border: [string[], string[]]; constructor(name: string, source: MapBorderSource, closed: boolean); } declare class BorderItem extends MapSourceItem { polygon: MapPolygon; constructor(id: string, polygon: MapPolygon); } declare abstract class MapSourceImpl extends RmObject { static createStockInset(area: string, display?: boolean | MapInsetDisplay): MapInset; readonly name: string; readonly enabled: boolean; readonly idKey: string; readonly nameKey: string; readonly meta: MapSourceMeta; readonly dokdo: number; readonly dummies: string[]; readonly useOffset: boolean | MapCoord; readonly internals: boolean; readonly externals: boolean; readonly alignArctic: boolean; readonly borders: MapBorderInfo[]; items: MapSourceItem[]; insets: { [area: string]: MapInset; }; paddings: IPaddings; private _excludes; constructor(options: MapSource, index: number); included(area: string): boolean; private $_load; protected abstract _doLoad(source: object, options: MapSource): MapSourceItem[]; } /** * 어노테이션 배치 기준. * [주의]body에 설정된 annoation에는 적용되지 않는다. * @enum */ declare const _AnnotationScope: { /** * container에서 padding을 적용한 영역을 기준으로 표시한다. * * */ readonly CHART: "chart"; /** * container 전체 영역을 기준으로 표시한다. * * */ readonly CONTAINER: "container"; }; /** @dummy */ type AnnotationScope = typeof _AnnotationScope[keyof typeof _AnnotationScope]; interface AnnotationAnimationOptions { type: string; duration?: number; } type AnnotationType = 'image' | 'shape' | 'text' | 'html' | 'chart'; /** * Annotation 모델. * * */ interface AnnotationOptions extends PositionableItemOptions { type?: AnnotationType; /** * true로 지정하면 시리즈들 위에 표시된다. * 명시적으로 false로 지정해야 시리즈들 아래 표시된다. * * @default false */ front?: boolean; /** * 어노테이션 배치 기준이 되는 맵차트 구성 요소. * 현재, 같은 영역(body 혹은 chart)에 포함된 다른 어노테이션의 {@link name 이름}을 지정할 수 있다. * */ anchor?: string; /** * 수평 배치. * * @default 'left' anchor가 지정되면 'center', 아니면 'left' */ align?: Align; /** * {@link align}과 {@link verticalAlign}으로 지정된 위치에서 실제 표시될 위치의 수평 간격. * 값이 양수일 때, {@link anchor}가 지정된 경우 anchor 아이템의 밖으로 멀어지고, 아니면 영역 경계 안쪽으로 멀어진다. * 또, {@link anchor}가 지정된 경우 **'0.5w'** 등으로 이 어노테이션의 너비를 기준으로 한 크기로 지정할 수 있다. * * @default 0 */ offsetX?: number | string; /** * {@link align}과 {@link verticalAlign}으로 지정된 위치에서 실제 표시될 위치의 수직 간격. * 값이 양수일 때, {@link anchor}가 지정된 경우 anchor 아이템의 밖으로 멀어지고, 아니면 영역 경계 안쪽으로 멀어진다. * 또, {@link anchor}가 지정된 경우 **'0.5h'**처럼 이 어노테이션의 너비를 기준으로 한 크기로 지정할 수 있다. * * @default 0 */ offsetY?: number | string; /** * 회전 각도. * 0 ~ 360 사이의 값으로 지정한다. * */ rotation?: number; /** * 어노테이션 배치 기준. * [주의]body에 설정된 annoation에는 적용되지 않는다. * * @default 'chart' */ scope?: AnnotationScope; /** * true로 지정하면 상위 영역을 벗어난 부분도 표시되게 한다. * body에 포함된 경우 body 영역, * chart에 포함되고 scope이 'chart'일 때 chart 영역. * */ noClip?: boolean; } declare const ImageAnnotationType = "image"; /** * 이미지 어노테이션. * {@link https://realmap.co.kr/docs/api/options/AnnotationOptions#type type}은 'image'이다. * * // TODO #fiddle annotation/image-annotation Image Annotation * @css 'rm-image-annotation' */ interface ImageAnnotationOptions extends AnnotationOptions { /** @dummy */ type?: typeof ImageAnnotationType; /** * true로 설정되고 {@link url}이 설정된 경우에만 표시된다. * * @default true */ visible?: boolean; /** * 이미지 경로. * */ imageUrl?: string; } declare const ShapeAnnotationType = "shape"; /** * Shape Annotation 모델. * {@link https://realmap.co.kr/docs/api/options/AnnotationOptions#type type}은 'shape'이다. * {@link shape} 속성에 표시할 도형 모양을 지정하거나, * {@link path}에 SVG path를 직접 지정할 수 있다. * * // TODO #fiddle annotation/shape-annotation Shape Annotation * @css 'rm-shape-annotation' */ interface ShapeAnnotationOptions extends AnnotationOptions { /** @dummy */ type?: typeof ShapeAnnotationType; /** * @default 64 */ width?: number; /** * @default 64 */ height?: number; /** * Shape 종류. * * circle: 원 * diamond: 다아이몬드 * square: 정사각형 * triangle: 삼각형 * star: 별 모양 * itriangle: * rectangle: 사각형 * * @default 'square' */ shape?: 'circle' | 'diamond' | 'square' | 'triangle' | 'star' | 'itriangle' | 'rectangle'; /** * Shape path. * 이 속성이 지정되면 {@link shape}는 무시된다. */ path?: string; series?: string; xRange?: number[]; yRange?: number[]; } declare const TextAnnotationType = "text"; /** * 텍스트 어노테이션. * {@link https://realmap.co.kr/docs/api/options/AnnotationOptions#type type}은 'text'이다. * * // TODO #fiddle annotation/text-annotation Text Annotation * @css 'rm-text-annotation' */ interface TextAnnotationOptions extends AnnotationOptions { /** @dummy */ type?: typeof TextAnnotationType; /** * true로 설정되고 {@link text}가 설정된 경우에만 표시된다. * * @default true */ visible?: boolean; /** * 표시할 텍스트. * * @default 'Text' */ text?: string; /** * {@link text}에 동적으로 전달되는 값이 숫자일 때 사용되는 표시 형식. * */ numberFormat?: string; /** * {@link text}에 동적으로 전달되는 값이 Date일 때 사용되는 표시 형식. * */ timeFormat?: string; /** * 텍스트를 가로 또는 세로로 배치할지 여부와 블록이 진행되는 방향을 지정한다. * * */ writingMode?: WritingMode; /** * 텍스트 문자 방향을 지정한다. * 세로 모드의 텍스트에만 적용된다. * * */ textOrientation?: TextOrientation; } declare const HtmlAnnotationType = "html"; /** * HTML 어노테이션. * {@link https://realmap.co.kr/docs/api/options/AnnotationOptions#type type}은 'html'이다. * * // TODO #fiddle annotation/html-annotation Html Annotation * @css 'rm-html-annotation' */ interface HtmlAnnotationOptions extends AnnotationOptions { /** @dummy */ type?: typeof HtmlAnnotationType; /** * true로 설정되고 {@link text}가 설정된 경우에만 표시된다. * * @default true */ visible?: boolean; /** * 이 속성으로 지정한 html 내용을 표시한다. * '.'나 '#'으로 시작되는 html selector로 지정하면 해당하는 dom의 {@link https://developer.mozilla.org/ko/docs/Web/API/Element/innerHTML innerHTML}을 가져와 표시한다. * 예를 들어 id가 'abc'인 dom인 경우 '#abc'로 지정한다. * 즉, document.{@link https://developer.mozilla.org/ko/docs/Web/API/Document/querySelector querySelector}(htmlFrom)로 리턴되는 dom의 내용을 표시한다. * 생성되는 dom의 스타일은 {@link htmlStyle}로 지정한다. */ html?: string; /** * 이 속성으로 지정한 selector에 해당하는 dom의 {@link https://developer.mozilla.org/ko/docs/Web/API/Element/innerHTML innerHTML}을 가져와 표시한다. * 예를 들어 id가 'abc'인 dom인 경우 '#abc'로 지정한다. * 즉, document.{@link https://developer.mozilla.org/ko/docs/Web/API/Document/querySelector querySelector}(htmlFrom)로 리턴되는 dom의 내용을 표시한다. * 이 속성이 {@link html}보다 우선한다. 다만, 존재하지 않은 dom을 지정한 경우 {@link html}에 지정한 내용을 대신 표시한다. * 생성되는 dom의 스타일은 {@link htmlStyle}로 지정한다. */ htmlFrom?: string; /** * {@link html}로 생성되는 최상위 dom에 적용되는 스타일셋. */ htmlStyle?: CSSStyleDeclaration; /** * @append * 너비를 반드시 지정해야 한다. * 지정하지 않으면 100 픽셀 너비로 표시한다. * {@link height 높이}를 지정하지 않으면 생성된 dom의 높이에 맞춰진다. * * @default 100 */ width?: PercentSize; /** * {@link html}로 지정된 html 텍스트에 포함된 param 값을 지정하는 객체나 콜백. #311 */ params?: { [key: string]: any; } | ((param: string) => any); } declare const ChartAnnotationType = "chart"; /** * Chart 어노테이션. * {@link https://realmap.co.kr/docs/api/options/AnnotationOptions#type type}은 'chart'이다. * * @css 'rm-chart-annotation' */ interface ChartAnnotationOptions extends AnnotationOptions { /** @dummy */ type?: typeof ChartAnnotationType; config?: any; } /** @dummy */ type AnnotationOptionsType = ImageAnnotationOptions | ShapeAnnotationOptions | TextAnnotationOptions | HtmlAnnotationOptions | ChartAnnotationOptions; /** * @enum */ declare const _ClickAction: { readonly NONE: "none"; readonly SELECT: "select"; /** * 맵차트가 zoom 가능한 상태일 때 zoom-in 한다. */ readonly ZOOM: "zoom"; /** * 표시된 지도 크기가 표시 영역보다 클 때, * 클릭한 위치가 표시 중앙이 되도록 한다. */ readonly CENTER: "center"; /** * 클릭한 영역이 포함된 맵시리즈가 drilldown 가능한 상태일 때, * drilldown을 실해하고 클릭한 영역의 상세가 표시되도록 한다. */ readonly DRILLDOWN: "drilldown"; /** * drilldow이 가능한 상태면 drilldown하거나, * 아니면 zoom-in 한다. */ readonly DRILL_OR_ZOOM: "drillOrZoom"; }; /** @dummy */ type ClickAction = typeof _ClickAction[keyof typeof _ClickAction]; /** * @enum */ declare const _DblClickAction: { readonly NONE: "none"; readonly SELECT: "select"; /** * 맵차트가 zoom 가능한 상태일 때 zoom-in 한다. */ readonly ZOOM: "zoom"; /** * 표시된 지도 크기가 표시 영역보다 클 때, * 클릭한 위치가 표시 중앙이 되도록 한다. */ readonly CENTER: "center"; /** * 더블클릭한 영역이 포함된 맵시리즈가 drilldown 가능한 상태일 때, * drilldown을 실해하고 클릭한 영역의 상세가 표시되도록 한다. */ readonly DRILLDOWN: "drilldown"; /** * drilldow이 가능한 상태면 drilldown하거나, * 아니면 zoom-in 한다. */ readonly DRILL_OR_ZOOM: "drillOrZoom"; }; /** @dummy */ type DblClickAction = typeof _DblClickAction[keyof typeof _DblClickAction]; declare const _DragAction: { /** * 구 지도이면 회전하고, 스크롤 가능한 세계지도면 스크롤하고, 아니면 지도를 이동(pan) 시킨다. */ readonly DEFAULT: "default"; /** * 드래그로 결정된 영역에 포함된 area들을 선택한다. * ctrl/cmd 키가 눌러진 상태가 아니면 기존 선택은 취소된다. */ readonly SELECT: "select"; /** * 드래그로 결정된 영역이 화면을 채우도록 zoom-in 한다. */ readonly ZOOM: "zoom"; }; type DragAction = typeof _DragAction[keyof typeof _DragAction]; interface OnClickArgs extends CommonCallbackArgs { x: number; y: number; coord: MapCoord; area?: string; } /** * 맵차트 전체에 영향을 미치는 옵션들. * */ interface ChartGlobalOptions extends ChartItemOptions { /** * false가 아닌 경우 첫번째 시리즈가 'map' 시리즈가 아니면 내부적으로 자동 추가한다. * * @default true */ alwaysMap?: boolean; /** * 맵 영역 등을 클릭하거나 tap했을 때 실행될 action. * * @default 'default' */ clickAction?: ClickAction; /** * 맵 영역 등을 더블 클릭하거나 더블 tap했을 때 실행될 action. * * @default 'zoom' */ dblClickAction?: DblClickAction; /** * 마우스 드래그 시 실행될 action. * * @default 'none' */ dragAction?: DragAction; /** * 맵차트 컨트롤의 배경 div 속성을 지정한다. * 스타일 속성은 svg가 아니라 html css 속성들로 지정한다. */ backgroundStyle?: CSSStyles; /** * legend, color scale 등의 위젯들이 표시되는 영역과 body 사이의 간격. * 숫자 값이나 css margin 지정 방식의 문자열로 지정할 수 있다. * * @default 8 */ widgetSectionGap?: number | string; /** * legend, color scale 등의 위젯들이 표시되는 영역 내에서 위젯 사이의 간격. * * @default 8 */ widgetGap?: number; /** * 차트 div 크기가 변경됐을 때 지정한 시간(밀리초) 이후에 다시 그린다. * 0 이하면 대기 없이 바로 다시 그리기를 요청한다. * * @default 50 밀리초 */ resizeDelay?: number; /** * 마우스 휠을 통한 줌인/아웃을 비활성화할지 여부. * true로 설정하면 줌 패널 버튼은 사용할 수 있지만 마우스 휠로는 줌 조절이 불가능하다. * * @default false */ wheelDisabled?: boolean; /** * 마우스 포인터가 클릭됐을 때 호출되는 콜백. */ onClick?: (args: OnClickArgs) => void; /** * 선택 변경 시 호출되는 콜백. */ onSelectionChanged?: (args: OnSelectionChangedArgs) => void; } /** * 맵차트 제목(title) 설정 모델. * 기본적으로 맵차트 중앙 상단에 표시되지만 {@link align}, {@link verticalAlign} 등으로 위치를 변경할 수 있다. * * {@link https://realmap.co.kr/guide/title 타이틀 개요} 페이지를 참조한다. */ interface TitleOptions extends ChartItemOptions { /** * true로 설정되고 {@link text}가 비어 있지 않은 텍스트로 설정된 경우에 표시된다. * * @default true */ visible?: boolean; /** * 제목 텍스트. * * @default 'Title' */ text?: string; /** * 정렬 기준. * 시리즈들이 그려지는 plotting 영역이나, * 맵차트 전체 영역을 기준으로 할 수 있다. * 또, {@link https://realmap.co.kr/config/config/subtitle 부제목}인 경우 제목을 기준으로 위치를 지정할 수 있다. * * @default 'map' */ alignBase?: AlignBase; /** * 수평 정렬. * * @default 'center' */ align?: Align; /** * 수직 정렬. * * @default 'middle' */ verticalAlign?: VerticalAlign; /** * 배경 {@link it.SVGStyles 스타일셋} 또는 css {@link https://developer.mozilla.org/ko/docs/Web/CSS/CSS_selectors selector}. */ backgroundStyle?: SVGStyleOrClass; /** * 주 제목과 부 제목이 표시되는 영역과 맵차트 본체 등 과의 간격을 픽셀 단위로 지정한다. * 주 제목이 표시되면 (부 제목의 값은 무시되고)주 제목의 값을 사용하고, * 부 제목만 표시될 때는 부 제목의 값을 사용한다. * * @default 10 */ gap?: number; } /** * 부제목 표시 위치. * @enum */ declare const _SubtitlePosition: { /** * 주제목 아래쪽에 표시. */ readonly BOTTOM: "bottom"; /** * 주제목 오른쪽에 표시. */ readonly RIGHT: "right"; /** * 주제목 왼쪽에 표시. */ readonly LEFT: "left"; /** * 주제목 위쪽에 표시. */ readonly TOP: "top"; }; /** @dummy */ type SubtitlePosition = typeof _SubtitlePosition[keyof typeof _SubtitlePosition]; /** * 맵차트 제목 주위에 표시되는 부제목 옵션. * 기본적으로 주제목(title)의 설정을 따르고, 몇가지 속성들이 추가된다. * 별도 설정이 없으면 표시되지 않는다. * * ```js * const config = { * title: {}, * subtitle: { * visible: true, * text: '출처: UN Data, 2020', * }, * }; * ``` * * {@link https://realmap.co.kr/guide/title 제목 개요} 페이지를 참조한다. * */ interface SubtitleOptions extends TitleOptions { /** * 부제목 표시 위치. * * @default 'bottom' */ position?: SubtitlePosition; /** * 주 제목과 사이의 간격을 픽셀 단위로 지정한다. * * @default 2 */ titleGap?: number; /** * @default '' */ text?: string; /** * @default 'bottom' */ verticalAlign?: VerticalAlign; } /** * 맵차트 개발 제작자 등을 표시하는 * 크레딧 영역에 대한 설정 모델. */ interface CreditsOptions extends ChartItemOptions { /** * 제작자 이름 등 표시 텍스트. */ text?: string; /** * 영역을 클릭했을 때 이 속성에 지정한 곳으로 창을 연다. */ url?: string; /** * credits 표시 위치. * 값을 지정하지 않으면 'bottom'에 표시된다. * * @default 'bottom' */ location?: ChartItemLocation; /** * 수평 배치. * 값을 지정하지 않으면, 기본값이 {@link location}이 'body'일 때는 'left', * 'top', 'bottom'일 때는 'right'이다. * 그 외는 무시된다. */ align?: Align; /** * 수직 배치. * 값을 지정하지 않으면, 기본값이 {@link location}이 'body'일 때는 'top', * 'left', 'right'일 때는 'middle'이다. * 그 외는 무시된다. */ verticalAlign?: VerticalAlign; /** * 설정에 따라 정해진 표시 위치에서 떨어진 수평 간격을 픽셀 단위로 지정한다. * {@link floating}이 true가 아니고, * {@link verticalAlign}이 'middle' 이면서 {@link align}이 'center'가 아닌 경우, * 이 값만큼 수평 영역을 차지한다. * * @default 2 */ offsetX?: number; /** * 설정에 따라 정해진 표시 위치에서 떨어진 수직 간격을 픽셀 단위로 지정한다. * {@link floating}이 true가 아니고, {@link verticalAlign}이 'middle'이 아닌 경우, * 이 값만큼 수직 영역을 차지한다. * * @default 1 */ offsetY?: number; /** * {@link floating}이 true가 아니고, 중앙이 아닌 곳에 표시될 때, * 맵차트 나머지 영역과의 간격을 픽셀로 지정한다. * {@link verticalAlign}이 'middle'이면 수평 간격, 아니면 수직 간격에 적용된다. * * @default 4 */ gap?: number; } /** * 툴팁에 표시할 데이터포인트들을 선택하는 방식. * * @enum */ declare const TooltipScopes: { readonly HOVER: "hover"; readonly POINT: "point"; readonly GROUP: "group"; readonly AXIS: "axis"; }; /** @dummy */ type TooltipScope = typeof TooltipScopes[keyof typeof TooltipScopes]; /** * @enum */ declare const TooltipModes: { readonly LINE: "line"; readonly CIRCLE: "circle"; readonly HEADER: "header"; }; /** * 툴팁 모드 */ type TooltipMode = typeof TooltipModes[keyof typeof TooltipModes]; /** * 데이터포인트 {@link https://realmap.co.kr/guide/tooltip Tooltip} 설정 모델. * */ interface TooltipOptions extends ChartItemOptions { scope?: TooltipScope; html?: string; /** * 툴팁에 표시할 텍스트 형식. * 시리즈에 {@link https://realmap.co.kr/config/config/base/series#tooltiptext tooltipText}가 시리즈 별 tooltip을 제공하지만, * 이 속성이 지정된 경우 우선 사용된다. * * `${param;default;format}` 형식으로 아래과 같은 변수로 데이터 포인트 및 시리즈 값을 지정할 수 있다. * |변수|설명| * |---|---| * |series|시리즈 이름| * |name|포인트 이름. 포인트가 속한 카테고리 이름이거나, 'x' 속성으로 지정한 값| * |x|'x' 속성으로 지정한 값| * |y|'y' 속성으로 지정한 값| * |xValue|계산된 x값| * |yValue|계산된 y값| * */ text?: string; /** * 목표 지점과 tooltip 사이의 간격. * */ offset?: number; /** * 툴팁이 점진적으로 닫히는 시간을 밀리초 단위로 지정한다. * * @default 700 */ hideDelay?: number; minWidth?: number; minHeight?: number; /** * true이면 툴팁 상자가 마우스 포인터를 따라 다닌다. * * false, true를 명시적으로 지정하지 않으면 시리즈 종류에 따라 자동 설정된다. * ex) pie 시리즈는 true, bar 시리즈는 false가 된다. * */ followPointer?: boolean; /** * 툴팁 텍스트 속 숫자 값이 NaN일 때 대신 표시되는 텍스트. * */ nanText?: string; /** * 툴팁에 표시될 숫자값의 기본 형식.\ * {@link text}예 표시 문자열을 지정할 때 `${yValue;;#,###.0}`와 같은 식으로 숫자 형식을 지정할 수 있다. * */ numberFormat?: string; /** * 툴팁에 표시될 날짜(시간)값의 기본 형식.\ * {@link text}예 표시 문자열을 지정할 때 `${x;;yyyy.MM}`와 같은 식으로 날짜(시간) 형식을 지정할 수 있다. * */ timeFormat?: string; /** * 툴팁 모드. * * 해당 속성으로 툴팁의 외형을 변경할 수 있다. * * @default 'line' */ mode?: TooltipMode; } /** * 지도 투영 방식. */ type ProjectionType = undefined | 'orthographic' | /*'naturealearth' |*/ 'equalearth' | 'miller' | 'mercator'; /** * 실제 지도가 차지한 영역의 background에 표시 설정. */ interface MapBackgroundOptions extends ChartItemOptions { /** * 표시 여부를 지정한다. * boolean 값으로 명시적 지정이 없으면 기본값을 따른다. * * @default undefined 구형 프로젝션이면 true, 아니면 false. */ visible?: boolean; /** * 구형 프로젝션일 때 적용할 기본 radial gradient의 색상. * {@link style} 속성으로 다르게 지정할 수 있다. * * @default 'lightblue' */ globeFill?: string; } /** * zoom, drilldown 패널 base 모델. */ interface BodyPanelOptions extends ChartItemOptions { /** * {@link https://realmap.co.kr/config/config/body body} 영역 내에서 panel의 수평 정렬. * * @default 'left' */ align?: Align; /** * {@link https://realmap.co.kr/config/config/body body} 영역 내에서 panel의 수직 정렬. * * @default 'top' */ verticalAlign?: VerticalAlign; /** * {@link https://realmap.co.kr/config/config/body body} 영역 경계와 panel 사이의 수평 간격. * * @default 8 픽셀 */ offsetX?: number; /** * {@link https://realmap.co.kr/config/config/body body} 영역 경계와 panel 사이의 수직 간격. * * @default 8 픽셀 */ offsetY?: number; /** * 패널에 표시되는 버튼이나 label들 사이의 간격. * * @default 3 pixel */ itemGap?: number; } interface ZoomButton { label?: string; icon?: string; } /** * zoom 버튼들이 표시되는 패널 설정 모델. * */ interface ZoomPanelOptions extends BodyPanelOptions { /** * 패널에 표시되는 zoom 버튼들. */ buttons?: ZoomButton[]; /** * 버튼 배치 방향. * * @default 'vertical' */ direction?: 'vertical' | 'horizontal'; /** * 버튼 클릭 시 증감될 zoom 변화율을 지정한다. * 값이 클수록 작은 변화량이 된다. * * @default 20 */ zoomFactor?: number; /** * 버튼 너비. * {@link buttonHeight}가 지정되지 않으면 이 속성값과 동일하게 표시된다. * * @default 28 픽셀 */ buttonWidth?: number; /** * 버튼 높이. * {@link buttonWidth}가 지정되지 않으면 이 속성값과 동일하게 표시된다. * * @default 28 픽셀 */ buttonHeight?: number; /** * 원래 크기 상태로 변경하는 버튼 표시 여부. * * @default true */ showReset?: boolean; /** * 버튼들에 적용할 스타일셋. */ buttonStyle?: SVGStyleOrClass; /** * @default 'left' */ align?: Align; /** * @default 'bottom' */ verticalAlign?: VerticalAlign; /** * true로 지정하면 맵이 zoom되지 않은 상태일 때도 표시한다. * 물론 {@link visible}이 false이면 이 속성과 무관하게 표시되지 않는다. * * @default true */ showAlways?: boolean; } /** * @enum */ declare const _DrilldownPanelType: { /** * 전후 이동 버튼을 표시한다. */ readonly BUTTON: "button"; /** * 진행된 시리즈들의 이름을 표시한다. */ readonly TEXT: "text"; }; /** @dummy */ type DrilldownPanelType = typeof _DrilldownPanelType[keyof typeof _DrilldownPanelType]; /** * drilldown 버튼들이 표시되는 패널 설정 모델. * */ interface DrilldownPanelOptions extends BodyPanelOptions { /** * @default 'text' */ type?: DrilldownPanelType; /** * @default 'left' */ align?: Align; /** * @default 'top' */ verticalAlign?: VerticalAlign; } /** * 콜백 매개변수 타입 base. * */ interface CommonCallbackArgs { /** * Realmap의 공개 {@link https://realmap.co.kr/docs/api/classes/MapChart MapChart} 모델 */ chart: MapChart; } interface OnHoverAreaArgs extends CommonCallbackArgs { area: any; oldArea: any; } interface OnClickAreaArgs extends CommonCallbackArgs { area: any; } interface OnZoomChangedArgs extends CommonCallbackArgs { zoom: number; oldZoom: number; } /** * 맵차트 본체(body) 설정 모델. * 투영 옵션과 지도 제어 옵션들을 설정할 수 있다. */ interface BodyOptions extends ChartItemOptions { /** * 지도 투영 옵션. * 투영 기법에 따라 지도 표시 방식이 달라진다. */ projection?: ProjectionType; mapBackground?: MapBackgroundOptions; /** * zoom 버튼들이 표시되는 패널 설정 모델. */ zoomPanel?: ZoomPanelOptions | boolean; /** * 드릴다운 경로를 표시하는 panel 설정 모델. */ drilldownPanel?: DrilldownPanelOptions | boolean; /** * 사용자가 마우스 wheel이나 zoom panel을 이용해 {@link zoom}을 변경할 수 있는 지 여부. * * @default false */ zoomable?: boolean; /** * zoom 상태를 백분율로 지정한다. * 100이면 원래 크기대로 표시한다. * * @default 100 */ zoom?: number; /** * 사용자가 zoom 패널 등으로 변경할 수 있는 최대 zoom. * @default 1000 */ maxZoom?: number; /** * 마우스 휠로 zooming할 때 이 속성에 지정한 값에 따라 wheel 변화량을 zoom 변화율로 반영한다. * 큰 값을 지정할 수록 작게 변화한다. * * @default 5 */ wheelZoomFactor?: number; /** * 'orthgraphic' 투영이 아닌 경우 true로 지정하면 좌우 스크롤로 지도 중심점을 변경할 수 있다. * 지도 데이터가 세계 전체 지도일 때만 적용된다. * * @default false */ scrollable?: boolean; /** * {@link scrollable}이 true인 경우 도(°) 단위 좌우 스크롤 크기. * 0보다 큰 값이면 중점이 아시아쪽으로 이동한다. */ scroll?: number; /** * 마우스 드래그로 panX/panY 를 변경할 수 있는 지 여부. * 명시적 false로 지정하면 드래그로 이동시킬 수 없다. * 초기 {@link zoom}을 설정하고 그 위치를 유지하려 할 때 사용할 수 있다. */ movable?: boolean; /** * 지도 중심으로부터 경도상으로 벗어난 지도 단위 크기. 양수이면 왼쪽으로 스크롤 된 상태 */ panX?: number; /** * 지도 중심으로부터 위도상으로 벗어난 지도 단위 크기. 양수이면 아래쪽쪽으로 스크롤 된 상태 */ panY?: number; rotationX?: number; rotationY?: number; fit?: any; points?: ([string, number, number] | { id: string; coord?: MapCoord; lon?: number; lat?: number; })[]; onZoomChanged?: (args: OnZoomChangedArgs) => void; onHoverArea?: (args: OnHoverAreaArgs) => void; onClickArea?: (args: OnClickAreaArgs) => void; /** * body 영역 내에 표시되는 어노테이션 옵션. * 옵션 객체 또는 옵션 객체 배열로 여러 어노테이션을 설정할 수 있다. * [주의] 이전 버전의 설정을 로드하기 위해, 이 속성이 지정되지 않고 'annotations' 설정이 존재하면 load 후 이 속성으로 설정한다. * * @expandable */ annotations?: AnnotationOptionsType | AnnotationOptionsType[]; /** * 차트에 표시할 내용이 존재하지 않을 때 표시되는 메시지 view. */ emptyView?: EmptyViewOptions | boolean; } interface BackgroundImageOptions extends ChartItemOptions { url?: string; } /** * 데이터가 없을 때 표시되는 뷰에 대한 옵션 */ interface EmptyViewOptions extends ChartTextOptions { /** * @append * * false로 지정하면 표시돼야할 상황에서도 표시되지 않는다. * * @default undefined */ visible?: boolean; /** * @append * * 표시할 텍스트. * 지정하지 않으면 '표시할 내용이 없습니다.'가 표시된다. * 또, split pane인 경우 지정하지 않으면 먼저 기본 body에 설정된 값으로 표시된다. * * @default undefined */ text?: string; } interface IPoint$1 { x: number; y: number; } interface ISize { width: number; height: number; } /** @private */ declare class Size { width: number; height: number; static readonly EMPTY: Size; static empty(): Size; static create(w?: number, h?: number): Size; constructor(width?: number, height?: number); /** isEmpty */ get isEmpty(): boolean; clone(): Size; equals(sz: Size): boolean; setEmpty(): Size; set(width: number, height: number): Size; round(): Size; toString(): string; } interface IRect { x: number; y: number; width: number; height: number; } declare const createRect: (x: number, y: number, width: number, height: number) => IRect; declare function rectToSize(r: IRect): ISize; declare function isEmptyRect(r: IRect): boolean; /** @private */ declare class Rectangle { x: number; y: number; width: number; height: number; static readonly Empty: Rectangle; static Temp: Rectangle; static create(x: any, y?: number, width?: number, height?: number): Rectangle; constructor(x?: number, y?: number, width?: number, height?: number); /** left */ get left(): number; set left(value: number); /** right */ get right(): number; set right(value: number); /** top */ get top(): number; set top(value: number); /** bottom */ get bottom(): number; set bottom(value: number); /** isEmpty */ get isEmpty(): boolean; get isValid(): boolean; clone(): Rectangle; getInner(): Rectangle; equals(r: Rectangle): boolean; leftBy(delta: number): Rectangle; rightBy(delta: number): Rectangle; topBy(delta: number): Rectangle; bottomBy(delta: number): Rectangle; shrink(dx: number, dy: number): Rectangle; expand(dx: number, dy: number): Rectangle; contains(x: number, y: number): boolean; setEmpty(): Rectangle; move(x?: number, y?: number): Rectangle; set(x: number, y: number, width: number, height: number): Rectangle; setWidth(value: number): Rectangle; copy(r: Rectangle): Rectangle; copyHorz(r: Rectangle): Rectangle; copyVert(r: Rectangle): Rectangle; inflate(left?: number, top?: number, right?: number, bottom?: number): Rectangle; offset(dx: number, dy: number): Rectangle; round(): Rectangle; union(r: Rectangle): Rectangle; normalize(): Rectangle; toString(): string; } /** @private */ declare class RmTool<T extends RmControl = RmControl> { private _control; private _touchElement; private _moveElement; private _draggable; private _dragTracker; private _clickX; private _clickY; private _prevX; private _prevY; protected _touches: { x: number; y: number; t: number; }[]; protected _tapped: number; private _firstTime; private _secondTime; private _longTimer; protected _primaryId: number; private _distance; private _pinching; constructor(control: T); get control(): T; /** * drag tracker */ get dragTracker(): DragTracker; setDragTracker(value: DragTracker): void; get dragging(): boolean; pointerDown(ev: PointerEvent): boolean; protected _stopEvent(ev: Event): void; private $_doDrag; private $_startMove; pointerMove(ev: PointerEvent): void; pointerUp(ev: PointerEvent): void; pointerCancel(ev: PointerEvent): void; pointerLeave(ev: PointerEvent): void; touchStart(ev: TouchEvent): void; touchMove(ev: TouchEvent): boolean; protected _isPinchTarget(dom: Element): boolean; protected _doPinch(dist: number): void; touchEnd(ev: TouchEvent): void; click(ev: PointerEvent): void; dblClick(ev: PointerEvent): void; keyPress(ev: KeyboardEvent): void; wheel(ev: WheelEvent): void; requestDrag(request: DragRequest): void; getTrackerFromRequest(request: DragRequest): DragTracker; protected _setDraggable(value: boolean): void; protected _doClick(ev: PointerEvent): void; protected _doDblClick(ev: PointerEvent): void; protected _doPointerDown(ev: PointerEvent): boolean; protected _doPointerMove(x: number, y: number, ev: PointerEvent): void; protected _doPointerUp(ev: PointerEvent): boolean; protected _doPointerCancel(ev: PointerEvent): void; protected _doPointerLeave(ev: PointerEvent): void; protected _doTouchStart(ev: TouchEvent, dom: Element): void; protected _doTouchMove(ev: TouchEvent, dom: Element): boolean; protected _doTouchEnd(ev: TouchEvent, dom: Element): void; protected _doLongPressed(dom: Element, x: number, y: number): void; protected _doKeyPress(ev: KeyboardEvent): void; protected _doWheel(ev: WheelEvent): boolean; protected _doSwipe(dom: Element, prevTracker: DragTracker, dir: RmDirection, duration: number, distance: number): boolean; protected _getDragTracker(dom: Element, dx: number, dy: number, shift: any): DragTracker; private $_startDrag; private $_drag; private $_stopDragTracker; protected _pointerToPoint(event: PointerEvent): IPoint$1; private $_checkSwipe; /** * 터치 시작 시점에 실행한 설정 등을 이 후 touch 이벤트가 발생하면 초기화한다. * ex) touch feedback, ... * iphone 메시지 편집 창에서 touch 하면 행을 선택하고 이 후 다른 이벤트가 발생하면 선택을 해제한다. */ protected _clearTouchEffects(): void; private $_getDistance; } declare abstract class DragRequest extends RmObject { } declare abstract class DragTracker<T extends RmControl = RmControl> extends RmObject { private _control; private _dragging; constructor(control: T); get control(): T; /** dragging */ get dragging(): boolean; /** startWhenCreated */ get startWhenCreated(): boolean; get cursor(): string; canSwipe(): boolean; start(eventTarget: Element, xStart: number, yStart: number, x: number, y: number): boolean; drag(eventTarget: Element, xPrev: number, yPrev: number, x: number, y: number): boolean; cancel(): void; drop(eventTarget: HTMLElement, x: number, y: number): void; swipe(dir: RmDirection, duration: number, distance: number): boolean; end(x?: number, y?: number): void; protected _doSwipe(dir: RmDirection, duration: number, distance: number): boolean; protected _showFeedback(x: number, y: number): void; protected _moveFeedback(x: number, y: number): void; protected _hideFeedback(): void; protected _doStart(eventTarget: Element, xStart: number, yStart: number, x: number, y: number): boolean; protected abstract _doDrag(eventTarget: Element, xPrev: number, yPrev: number, x: number, y: number): boolean; protected _doCanceled(): void; protected _canAccept(eventTarget: Element, x: number, y: number): boolean; protected _doCompleted(eventTarget: Element, x: number, y: number): void; protected _doEnded(x?: number, y?: number): void; } /** * @private * * Control base. */ declare abstract class RmControl extends RmObject { static readonly CLASS_NAME = "rm-control"; static readonly SHADOW_FILTER = "rm-shadow-filter"; private _activeTool; static _animatable: boolean; private _container; private _dom; private _htmlRoot; private _debugger; private _svg; private _defs; private _root; private _inited; private _testing; private _dirty; private _requestTimer; private _defaultTool; private _tool; private _toAnimation; private _invalidateLock; private _lockDirty; private _cssVars; private _resizeObserver; private _wSave; private _hSave; private _resizeTimer; private _resizeDelay; /** * 드래그를 차단할 지 여부를 나타내는 플래그. * * 맵 영역 밖에서 드래그가 시작되었을 때 맵이 회전되는 것을 방지하기 위해 사용된다. * pointerdown, touchstart 이벤트가 발생했을 때 이벤트 타겟이 맵 영역 안에 있는지 여부를 검사하여 설정된다. */ private _blockDrag; loaded: boolean; _padding: ISides; _scrolling: boolean; constructor(doc: Document, container: string | HTMLDivElement, className?: string); protected _doDestory(): void; isInited(): boolean; isTesting(): boolean; doc(): Document; dom(): HTMLElement; width(): number; height(): number; contentWidth(): number; contentHeight(): number; contentRight(): number; clipContainer(): SVGElement; activeTool(): RmTool; setSctiveTool(value: RmTool): void; isLoading(): boolean; /** * 드래그 가능 여부를 반환한다. * * 만약 드래그가 맵 영역 밖에서 시작되었다면 드래그가 차단된다.(false 반환) */ isDraggable(): boolean; clearDefs(): void; appendDom<T extends HTMLElement>(elt: T): T; addElement<T extends RmElement>(elt: T): T; removeElement(elt: RmElement): void; invalidate(force?: boolean): void; invalidateLayout(force?: boolean): void; setLock(): void; releaseLock(validate?: boolean): void; lock(func: (control: RmControl) => void): void; silentLock(func: (control: RmControl) => void): void; setResizeDelay(value: number): void; getBounds(): DOMRect; setAnimation(to?: number): void; fling(distance: number, duration: number): void; getCssVar(name: string): string; addDef(element: Element): void; removeDef(element: Element | string): void; hasDef(defId: string): boolean; /** * defs에 직사각형 clipPath를 등록한다. */ clipBounds(x?: number, y?: number, width?: number, height?: number, rd?: number): ClipRectElement; clip<T extends ClipElement>(clip: T): T; pointerToPoint(event: PointerEvent): IPoint$1; protected _setTesting(): void; protected _setSize(w: number, h: number): void; private $_addListener; protected _registerEventHandlers(dom: HTMLElement): void; protected _unresigterEventHandlers(dom: HTMLElement): void; protected abstract _creatDefaultTool(): RmTool; protected _prepareRenderers(dom: HTMLElement): void; protected _initControl(document: Document, container: string | HTMLDivElement, className: string): void; protected _initDefs(doc: Document, defs: SVGElement): void; protected _render(): void; private $_requestRender; updateNow(): void; private $_render; protected _setBackgroundStyle(style: CSSStyles): void; setDebug(message: any):