개발 Guide

RealMap 라이브러리 사용 개요 및 주의 사항들

javascript로 작성된 예제 코드 부분을 제외하고, Api 문서는 정확한 자료형이 표시되는 typescript 스타일로 설명되어 있다. 업무용 앱의 신뢰성을 위해 최대한 자료형에 맞게 Api를 사용해야 한다.
기본적으로 OOP(객체지향 프로그래밍) 기반으로 설계되고 구현되었다. Api 문서에는 base 클래스, 계승된 메소드 및 속성 등이 명시되어 있다.

Namespace

RealMap 라이브러리의 네임스페이스는 RealMap 이다.

const mapChart = await RealMap.createChartAsync(document, 'realmap', config);

차트 생성 함수(createChart, createChartAsync)

createChartAsync

const config = {
    map: {
        url: 'https://unpkg.com/realmap-collection/world-low.geo.json'
    }
}
 
const mapChart = await RealMap.createChartAsync(document, 'realmap', config);

• 해당 함수는 차트를 생성하기 전에, url, dataUrl 옵션을 읽고 필요한 데이터를 요청한다.(fetch).
• CDN에서 지도 데이터를 가져오거나, 시리즈 데이터를 url로 가져와야 하는 경우 사용한다.
• 단, 비동기 함수이므로 await를 앞에 붙여야, 차트 인스턴스를 리턴받아 사용할 수 있다.
  붙이지 않는 경우, Promise 객체가 리턴된다.
• 맵차트를 작업하는 경우, 대부분 이 함수를 사용하게 된다.

createChart

const config = {
    map: {
        source: geoJsonData // 미리 로드한 geoJson 데이터
    }
}
 
const mapChart = RealMap.createChart(document, 'realmap', config);

• 동기 함수이다.
• config에서 url, dataUrl 옵션을 사용할 수 없다. 지도 데이터나 시리즈 데이터를 미리 로드해 놓아야 한다.
• 이 때 config에 url, dataUrl 옵션이 있으면 에러가 발생한다.
• 대부분의 경우 createChartAsync를 사용하는 것이 편리하다.

주의 사항

1. Api 문서에 공개되지 않은 숨겨진 클래스나 함수 및 속성 등을 사용해서는 안된다. 특히,'$'나 '_'로 시작하는 함수나 속성 및 객체는 내부 구현 상황에 따라 언제든 변경될 수 있으므로 절대 접근(호출, 수정)해서는 안된다.
2. Api에 명시된 자료형대로 매개변수나 속성 값을 지정해야 한다.
3. Api에 명시된 enum (opens in a new tab) 타입이나 string literal union (opens in a new tab) 타입에 포함되지 않은 값을 사용해서는 안된다.

See Also

• 차트 Configuration
• API 개요