Přidání mnohoúhelníkové vrstvy do mapy (Android SDK)

Článek
11/30/2021
3 min ke čtení

Tento článek ukazuje, jak vykreslit oblasti Polygon MultiPolygon geometrií vlastností a na mapě pomocí mnohoúhelníkové vrstvy.

Požadavky

Nezapomeňte provést kroky v dokumentu Rychlý start: Vytvoření aplikace pro Android. Bloky kódu v tomto článku je možné vložit do obslužné rutiny onReady události maps.

Použití mnohoúhelníkové vrstvy

Když je mnohoúhelníková vrstva připojená ke zdroji dat a načtena do mapy, vykreslí oblast pomocí prvků Polygon MultiPolygon a . Pokud chcete vytvořit mnohoúhelník, přidejte ho do zdroje dat a vykreslte ho pomocí mnohoúhelníkové vrstvy pomocí PolygonLayer třídy .

//Create a data source and add it to the map.
DataSource source = new DataSource();
map.sources.add(source);

//Create a rectangular polygon.
source.add(Polygon.fromLngLats(
    Arrays.asList(
        Arrays.asList(
            Point.fromLngLat(-73.98235, 40.76799),
            Point.fromLngLat(-73.95785, 40.80044),
            Point.fromLngLat(-73.94928, 40.79680),
            Point.fromLngLat(-73.97317, 40.76437),
            Point.fromLngLat(-73.98235, 40.76799)
        )
    )
));

//Create and add a polygon layer to render the polygon on the map, below the label layer.
map.layers.add(new PolygonLayer(source, 
    fillColor("red"),
    fillOpacity(0.7f)
), "labels");

//Create a data source and add it to the map.
val source = DataSource()
map.sources.add(source)

//Create a rectangular polygon.
source.add(
    Polygon.fromLngLats(
        Arrays.asList(
            Arrays.asList(
                Point.fromLngLat(-73.98235, 40.76799),
                Point.fromLngLat(-73.95785, 40.80044),
                Point.fromLngLat(-73.94928, 40.79680),
                Point.fromLngLat(-73.97317, 40.76437),
                Point.fromLngLat(-73.98235, 40.76799)
            )
        )
    )
)

//Create and add a polygon layer to render the polygon on the map, below the label layer.
map.layers.add(
    PolygonLayer(
        source,
        fillColor("red"),
        fillOpacity(0.7f)
    ), "labels"
)

Následující snímek obrazovky ukazuje výše uvedený kód, který vykreslí oblast mnohoúhelníku pomocí mnohoúhelníkové vrstvy.

Mnohoúhelník s vykreslenou oblastí výplně

Použití mnohoúhelníku a vrstvy čáry společně

Vrstva čáry se používá k vykreslení obrysu mnohoúhelníků. Následující ukázka kódu vykreslí mnohoúhelník jako v předchozím příkladu, ale teď přidá vrstvu čáry. Tato vrstva přímky je druhou vrstvou připojenou ke zdroji dat.

//Create a data source and add it to the map.
DataSource source = new DataSource();
map.sources.add(source);

//Create a rectangular polygon.
source.add(Polygon.fromLngLats(
    Arrays.asList(
        Arrays.asList(
            Point.fromLngLat(-73.98235, 40.76799),
            Point.fromLngLat(-73.95785, 40.80044),
            Point.fromLngLat(-73.94928, 40.79680),
            Point.fromLngLat(-73.97317, 40.76437),
            Point.fromLngLat(-73.98235, 40.76799)
        )
    )
));

//Create and add a polygon layer to render the polygon on the map, below the label layer.
map.layers.add(new PolygonLayer(source,
    fillColor("rgba(0, 200, 200, 0.5)")
), "labels");

//Create and add a line layer to render the outline of the polygon.
map.layers.add(new LineLayer(source,
    strokeColor("red"),
    strokeWidth(2f)
));

//Create a data source and add it to the map.
val source = DataSource()
map.sources.add(source)

//Create a rectangular polygon.
source.add(
    Polygon.fromLngLats(
        Arrays.asList(
            Arrays.asList(
                Point.fromLngLat(-73.98235, 40.76799),
                Point.fromLngLat(-73.95785, 40.80044),
                Point.fromLngLat(-73.94928, 40.79680),
                Point.fromLngLat(-73.97317, 40.76437),
                Point.fromLngLat(-73.98235, 40.76799)
            )
        )
    )
)

//Create and add a polygon layer to render the polygon on the map, below the label layer.
map.layers.add(
    PolygonLayer(
        source,
        fillColor("rgba(0, 200, 200, 0.5)")
    ), "labels"
)

//Create and add a line layer to render the outline of the polygon.
map.layers.add(
    LineLayer(
        source,
        strokeColor("red"),
        strokeWidth(2f)
    )
)

Následující snímek obrazovky ukazuje výše uvedený kód, který vykresluje mnohoúhelník s obrysem vykreslením pomocí vrstvy čáry.

Mnohoúhelník s vykreslenou oblastí výplně a obrysem

Tip

Při osnově mnohoúhelníku s vrstvou čáry nezapomeňte zavřít všechny okruhy v mnohoúhelníkech tak, aby každé pole bodů mělo stejný počáteční a koncový bod. Pokud to není hotové, vrstva čáry nemusí propojit poslední bod mnohoúhelníku k prvnímu bodu.

Vyplnění mnohoúhelníku vzorem

Kromě vyplnění mnohoúhelníku barvou můžete použít vzor obrázku k vyplnění mnohoúhelníku. Načtěte do prostředků sprite obrázku mapy vzor obrázku a pak na tento obrázek odkazovat pomocí možnosti fillPattern mnohoúhelníkové vrstvy.

//Load an image pattern into the map image sprite.
map.images.add("fill-checker-red", R.drawable.fill_checker_red);

//Create a data source and add it to the map.
DataSource source = new DataSource();
map.sources.add(source);

//Create a polygon.
source.add(Polygon.fromLngLats(
    Arrays.asList(
        Arrays.asList(
            Point.fromLngLat(-50, -20),
            Point.fromLngLat(0, 40),
            Point.fromLngLat(50, -20),
            Point.fromLngLat(-50, -20)
        )
    )
));

//Create and add a polygon layer to render the polygon on the map, below the label layer.
map.layers.add(new PolygonLayer(source,
        fillPattern("fill-checker-red"),
        fillOpacity(0.5f)
), "labels");

//Load an image pattern into the map image sprite.
map.images.add("fill-checker-red", R.drawable.fill_checker_red)

//Create a data source and add it to the map.
val source = DataSource()
map.sources.add(source)

//Create a polygon.
source.add(
    Polygon.fromLngLats(
        Arrays.asList(
            Arrays.asList(
                Point.fromLngLat(-50, -20),
                Point.fromLngLat(0, 40),
                Point.fromLngLat(50, -20),
                Point.fromLngLat(-50, -20)
            )
        )
    )
)

//Create and add a polygon layer to render the polygon on the map, below the label layer.
map.layers.add(
    PolygonLayer(
        source,
        fillPattern("fill-checker-red"),
        fillOpacity(0.5f)
    ), "labels"
)

Pro tuto ukázku se do složky drawable aplikace načetl následující obrázek.