[GIS] Mr.Tiler-Xr 3.0의 편집 기능 소개

맵 디자인 툴이자 타일맵 가공툴인 Mr.Tiler-Xr이 3.0으로 버전업 되었습니다. 대용량의 수치지도에 대해서도 빠른 속도로 도형 및 속성 데이터를 편집할 수 있으며 스냅핑 기능과 편집에 대한 Undo/Redo가 가능합니다.

편집 데이터는 일반적인 SHP을 그대로 사용함으로써 편집된 데이터를 SHP로 변환해 데이터를 교환할 필요가 없습니다. 아래의 링크는 Mr.Tiler-Xr의 편집 기능에 대한 시연 동영상에 대한 URL입니다.

http://www.gisdeveloper.co.kr/Mr.Tiler-Xr/mrtiler_demo2

Mr.Tiler의 편집 기능에 대한 시연에서 사용한 데이터는 2.5GB에 이르는 대한민국에 대한 전국 데이터입니다. 이미 잘 디자인된 지도 위에서 바로 데이터를 편집하고 추가할 수 있습니다.

하나의 툴만으로 공간 데이터를 편집하고 디자인하며 이를 타일맵으로 가공할 수 있는 툴은 지오서비스(GEOSERVICE)의 Mr.Tiler-Xr이 최초이며 가장 빠르고 뛰어납니다.

지오서비스는 웹기반의 GIS 솔루션 개발을 위한 맵엔진인 핑거아이즈와 모바일 기반의 맵엔진인 블랙포인트를 자체 기술력만으로 개발하여 지자체의 다양한 시스템 개발에 적용한, GIS 분야에서 최고의 기술력을 갖춘 GIS 소프트웨어 개발회사입니다.

[JavaScript] 클래스 상속

자바스크립트에서 클래스의 상속 개념을 정리해 보고자 합니다. 먼저 크기값(width, height) 만을 갖는 Rectangle라는 클래스가 있고 이 클래스를 상속받으면서 위치값(x, y)를 갖는 PositionedRectangle 클래스를 만들어 보는 예를 통해 정리하고자 합니다. (이 글은 인사이트의 자바스크립트 완벽가이드 내용을 읽고 이해하여 짧게 요약한 글입니다)

가장 먼저 Rectangle이라는 클래스 정의 코드입니다.
function Rectangle(w, h)
{
    this.width = w;
    this.height = h;
}

Rectangle.prototype.area = function()
{
    return this.width * this.height;
}

Rectangle.prototype.toString = function() 
{
    return "[" + this.width + ", " + this.height + "]";
}

생성자 함수에서 크기값에 대한 인자 w, h를 받습니다. 그리고 area라는 매서드와 toString이라는 매서드를 정의하고 있습니다. 이후에 Rectangle 클래스를 상속받아 toString 함수를 재정의할때 부모 클래스의 toString을 호출하는 방법을 살펴보도록 하겠습니다.

자, 이제 PositionedRectangle이라는 클래스를 Rectangle 클래스를 상속받아 정의하는 코드를 보겠습니다.
function PositionedRectangle(x, y, w, h)
{
    Rectangle.call(this, w, h);
    
    this.x = x;
    this.y = y;
}

3번 코드에서 상속받을 Rectangle 클래스를 지정합니다. 그리고 PositionedRectangle의 부모 클래스가 Rectangle이라는 것을 명확히 하도록 다음 코드를 추가합니다.

PositionedRectangle.prototype = new Rectangle();

위의 코드의 문제점은 PositionedRectangle의 생성자 함수까지도 Rectangle로 지정된다는 점입니다. PositionedRectangle의 생성자 함수를 다시 자기의 것으로 지정되도록 다음 코드를 추가합니다.

PositionedRectangle.prototype.constructor = PositionedRectangle;

또 한가지 문제가 있는데, 그것은 중복된 데이터입니다. PositionedRectangle는 Rectangle로부터 상속을 받았으므로 Rectangle의 width와 height 데이터를 갖습니다. 그런데 이 값이 각각 2개씩 중복(PositionedRectangle에 하나, PositionedRectangle.prototype에 하나)되어 갖고 있습니다. 해서 중복되지 않도록 제거해 주는 코드가 필요합니다.

delete PositionedRectangle.prototype.width;
delete PositionedRectangle.prototype.height;

이제 옵션으로 PositionedRectangle 자신의 함수를 추가하는 코드입니다.

PositionedRectangle.prototype.contains = function(x y)
{
    return (x > this.x && x < this.x + this.width 
        && y > this.y && y < this.y + this.height);
}

끝으로 부모 클래스의 메서드 함수를 재정의할때 부모 클래스의 메서드 함수를 호출하는 방법입니다. toString 함수를 예로 정리하면, PositionedRectangle에 다음처럼 toString 함수를 재정의할 수 있습니다.

PositionedRectangle.prototype.toString = function()
{
    return "(" + this.x + ", " + this.y + ") " 
        + Rectangle.prototype.toString.apply(this);
}