Polyline

지도에 선형으로 된 다양한 도형을 표시할 수 있습니다.

1. Polyline 생성하기

Polyline 은 두 개 이상의 포인트로 구성되어 있으며, 이 포인트들의 생성방식과 쓰임에 따라 모델좌표계로 구성하는 DotPoints 과 실제 위치좌표로 구성하는 MapPoints 2가지 방식이 있습니다. 행정구역 표시와 같이 정확한 위치좌표를 가지고 복잡한 형태를 그려야 할 때는 MapPoints 방식이 적합니다.

MapPoints - 지도의 위치 좌표들을 꼭지점으로 이어서 도형을 그리는 방식
DotPoints - 지도의 특정 위치 좌표를 x, y 축의 (0, 0) 으로 놓고 좌표 상의 포인트들을 이어서 도형을 그리는 방식

MapPoints 로 그리는 방식	DotPoints 로 그리는 방식

1. MapPoints 로 Polyline 생성하는 방식

// 분당구 수내동 좌표 - 좌표는 시계방향
List<LatLng> areaPoints = Arrays.asList(LatLng.from(37.38223932551648, 127.12175541356355),
    LatLng.from(37.38004826841279, 127.11873788114828),
    LatLng.from(37.37998825970411, 127.11865560901997),
    LatLng.from(37.37759015963305, 127.12026455589091),
    LatLng.from(37.37554127232343,127.12166649422632),
    LatLng.from(37.375376651560764, 127.1218294448716),
    LatLng.from(37.37529063800645, 127.12170987089243),
    LatLng.from(37.37476435496199, 127.12097413037237),
    LatLng.from(37.371637030851865, 127.11659848251716),
    LatLng.from(37.375492190509185, 127.11234063682852),
    LatLng.from(37.37851222905698, 127.10900509657834),
    LatLng.from(37.38164690817991, 127.11175544541744),
    LatLng.from(37.386705773112425, 127.11655221282123),
    LatLng.from(37.38223932551648, 127.12175541356355));

PolylineOptions.from(MapPoints.fromLatLng(areaPoints),
    Color.parseColor("#80ff2c35"), 3, Color.RED);

2. DotPoints 로 Polyline 생성하는 방식

// 반지름 200미터의 원형 폴리라인
PolylineOptions.from(DotPoints.fromCircle(LatLng.from(37.367317, 127.111764), 200))
    .setStyles(Color.parseColor("#078c03"));

// 가로 세로 200미터의 사각형 폴리라인
PolylineOptions.from(DotPoints.fromRectangle(LatLng.from(37.367317, 127.111764), 200, 200))
     .setStyles(Color.parseColor("#104D73"));

// 반지름 200미터의 원형에 반지름 170미터의 구멍이 있는 원형 폴리라인
PolylineOptions.from(DotPoints.fromCircle(LatLng.from(37.367317, 127.111764), 200)
    .setHoleCircle(170))
    .setStyles(Color.parseColor("#abd904"));     

// 가로, 세로 변의 길이가 200미터인 삼각형 폴리라인 - 포인트는 시계방향
PolylineOptions.from(DotPoints.fromPoints(LatLng.from(37.367317, 127.111764), 
    new PointF(0, 0), new PointF(-200, 0), new PointF(0, 200), 
    new PointF(0, 0)), Color.parseColor("#f55d44"));

2. PolylineStyles 설정하기

PolylineStyles 은 Polyline 의 스타일을 정의하며 1개 이상의 PolylineStyle 로 구성되어 있습니다. 하나의 PolylineStyle 은 지도의 확대/축소 줌레벨마다 스타일을 정의하고 지도의 줌레벨에 따라서 다른 스타일을 적용할 수 있습니다.

확대/축소 줌레벨 마다 다른 스타일 설정 예제

확대/축소 줌레벨의 값이 낮은것부터 순차적으로 넣어야 정상적으로 동작합니다.

// 줌레벨 12, 14, 16 마다 다른 색깔의 스타일의 육각형 폴리곤을 만드는 예제 
PolylineOptions options = PolylineOptions.from(DotPoints.fromPoints(pos, new PointF(-75, 150), new PointF(75, 150),
        new PointF(150, 0), new PointF(75, -150), new PointF(-75, -150),
        new PointF(-150, 0), new PointF(-75, 150)))
        .setStyles(PolylineStyle.from(20, Color.parseColor("#511f73")).setZoomLevel(12),
                PolylineStyle.from(20, Color.parseColor("#26a699")).setZoomLevel(14),
                PolylineStyle.from(20, Color.parseColor("#f28705"),
                        3, Color.parseColor("#f20530")).setZoomLevel(16));

Polyline polyline = shapeManager.getLayer().addPolyline(options);

스타일 및 도형 바꾸기

Polyline 생성 후 스타일과 포인트 데이터를 변경 할 수 있습니다.

// 1. 스타일만 변경하는 경우
polyline.changeStyles(PolygonStyles.from(Color.GREEN));

// 2. 스타일과 폴리곤의 데이터도 같이 변경하는 경우 - DotPoints 로 넣을 경우 
DotPoints dotPoints = DotPoints.fromPoints(LatLng.from(37.367317, 127.111764),
                        new PointF(0, 0), new PointF(-200, 0), new PointF(0, 200),
                        new PointF(0, 0));
polyline.changeStylesAndData(PolygonStyles.from(Color.GREEN), dotPoints);

// 3. 스타일과 폴리곤의 데이터도 같이 변경하는 경우 - MapPoints 로 넣을 경우 
List<LatLng> areaPoints = Arrays.asList(LatLng.from(37.38223932551648, 127.12175541356355),
        LatLng.from(37.38004826841279, 127.11873788114828),
        LatLng.from(37.37998825970411, 127.11865560901997),
        LatLng.from(37.37759015963305, 127.12026455589091),
        LatLng.from(37.37554127232343,127.12166649422632),
        LatLng.from(37.375376651560764, 127.1218294448716),
        LatLng.from(37.37529063800645, 127.12170987089243),
        LatLng.from(37.37476435496199, 127.12097413037237),
        LatLng.from(37.371637030851865, 127.11659848251716),
        LatLng.from(37.375492190509185, 127.11234063682852),
        LatLng.from(37.37851222905698, 127.10900509657834),
        LatLng.from(37.38164690817991, 127.11175544541744),
        LatLng.from(37.386705773112425, 127.11655221282123),
        LatLng.from(37.38223932551648, 127.12175541356355));
MapPoints mapPoints = MapPoints.fromLatLng(areaPoints);
polyline.changeStylesAndData(PolygonStyles.from(Color.GREEN), mapPoints);