Google Maps Android API v2 도형 그리기 순서 (zIndex) 탐색

Google Maps Android API v1에서는 레이어처럼 Overlay를 사용하여 도형 그룹의 전후 관계를 제어할 수 있었지만 v2에서는 Polyline 또는 Polygon 클래스에 zIndex가 도입되었습니다.

몇 가지 도형을 겹쳐서 그려, zIndex 가 주는 영향을 조사해 보았습니다.

zIndex 없음의 경우

먼저 zIndex를 지정하지 않는 경우.

마커

선(굵은)

선(가는)

폴리곤(파랑)

다각형 (녹색)

의 순서로 GoogleMap 에 추가하고 있습니다.

NoZindex.java

final LatLng TOKYO = new LatLng(35.691, 139.693);
final LatLng NAGOYA = new LatLng(35.1805, 136.9073);
final LatLng TOYOHASHI = new LatLng(34.770, 137.391);
final LatLng MATSUMOTO = new LatLng(36.239, 137.969);
final LatLng SHIZUOKA = new LatLng(34.99, 138.39);
final LatLng MAEBASHI = new LatLng(36.38, 139.04);

// マーカー
mMap.addMarker(new MarkerOptions()
    .position(new LatLng(35.47, 138.71))
    .title("富士山"));

// ライン
mMap.addPolyline(new PolylineOptions()
    .add(TOKYO, NAGOYA)
    .width(40)
    .color(Color.BLUE));
mMap.addPolyline(new PolylineOptions()
    .add(TOKYO, NAGOYA)
    .width(10)
    .color(Color.RED));

// ポリゴン
mMap.addPolygon(new PolygonOptions()
    .add(TOKYO, MATSUMOTO, TOYOHASHI)
    .fillColor(Color.CYAN));
mMap.addPolygon(new PolygonOptions()
    .add(TOKYO, MAEBASHI, SHIZUOKA)
    .fillColor(Color.GREEN));

결과, 이렇게 되었습니다.



전후 관계를 보면 안쪽에서

폴리곤(파랑)

다각형 (녹색)

선(굵은)

선(가는)

마커

되었습니다. 그리기 순서 = 추가한 순서이면 마커와 선은 다각형에 의해 가려져 버립니다만, 그렇게 되지 않았습니다.
도형에 따라 전후 관계가 정해져 있으며,
안쪽에서 다각형 → 라인 → 마커가되는 것 같습니다.
덧붙여서, zindex 를 지정하지 않을 때의 디폴트치는 0 입니다.

zIndex 설정하기

다음으로 zIndex를 다음과 같이 설정해 보겠습니다.

WithZindex.java

// マーカー
mMap.addMarker(new MarkerOptions()
    .position(new LatLng(35.47, 138.71))
    .title("富士山"));

// ライン
mMap.addPolyline(new PolylineOptions()
    .add(TOKYO, NAGOYA)
    .width(40)
    .color(Color.BLUE)
    .zIndex(1));
mMap.addPolyline(new PolylineOptions()
    .add(TOKYO, NAGOYA)
    .width(10)
    .color(Color.RED)
    .zIndex(2));

// ポリゴン
mMap.addPolygon(new PolygonOptions()
    .add(TOKYO, MATSUMOTO, TOYOHASHI)
    .fillColor(Color.CYAN)
    .zIndex(3));
mMap.addPolygon(new PolygonOptions()
    .add(TOKYO, MAEBASHI, SHIZUOKA)
    .fillColor(Color.GREEN)
    .zIndex(4));

결과는 다음과 같습니다.

선(굵은)

선(가는)

폴리곤(파랑)

다각형 (녹색)

마커

음, 라인, 폴리곤에 관계없이, zIndex 로 지정한 순서대로 안쪽으로부터 묘화 되어 있는 것 같습니다.

Developer Guide 설명

언제나 시도하고 보는 공식 가이드 w

Customize a Polyline - Google Maps Android API v2

Z-index
The stack order of this Polyline, relative to other overlays (polylines, polygons, ground overlays and tile overlays) in the map. A Polyline with a high z-index is drawn above overlays with lower z-indexes. Two overlays with the same z -index are drawn in an arbitrary order. Set this property with PolylineOptions.zIndex(). You can change this after the Polyline has been added to the map with the Polyline.setZIndex() method.

글쎄, 그런 글이 쓰여져있어.
아무래도 GroundOverlay 이나 TileOverlay 에도 zIndex 가 있어, 전후 관계를 컨트롤 할 수 있는 것 같네요.

요약

Google Maps Android API v2의 Polyline과 Polygon의 zIndex는 다음과 같습니다.

지정하지 않으면 ( 0 ), 추가의 순서에 관계없이 Polyline 가 Polygon 보다 앞에 draw 된다. Polyline끼리, Polygon끼리는, 추가 순서로 안쪽으로부터 묘화 된다.

지정했을 경우, Polyline, Polygon 의 구별 없이, zIndex 의 순서로 안쪽으로부터 draw 된다.

마커는 항상 가장 앞에 그려집니다.

그렇다면 zIndex를 잘 설정하면 도형 그룹의 전후 관계를 조정하고 변경할 수 있습니다.