Dodawanie warstwy wielokąta do mapy (zestaw Android SDK)

W tym artykule pokazano, jak renderować obszary geometrii Polygon i MultiPolygon cech na mapie przy użyciu warstwy wielokątnej.

Uwaga

Wycofanie zestawu SDK systemu Android w usłudze Azure Maps

Zestaw SDK natywny usługi Azure Maps dla systemu Android jest teraz przestarzały i zostanie wycofany w dniu 3/31/25. Aby uniknąć przerw w działaniu usługi, przeprowadź migrację do zestawu Web SDK usługi Azure Maps przez 3/31/25. Aby uzyskać więcej informacji, zobacz Przewodnik migracji zestawu SDK systemu Android usługi Azure Maps.

Wymagania wstępne

Pamiętaj, aby wykonać kroki opisane w przewodniku Szybki start: tworzenie dokumentu aplikacji dla systemu Android. Bloki kodu w tym artykule można wstawić do programu obsługi zdarzeń map onReady .

Używanie warstwy wielokątnej

Gdy warstwa wielokąta jest połączona ze źródłem danych i ładowana na mapie, renderuje obszar za pomocą Polygon funkcji i MultiPolygon . Aby utworzyć wielokąt, dodaj go do źródła danych i renderuj go za pomocą warstwy wielokątnej PolygonLayer przy użyciu klasy .

//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"
)

Poniższy zrzut ekranu przedstawia powyższy kod renderujący obszar wielokąta przy użyciu warstwy wielokąta.

Używanie wielokąta i warstwy liniowej

Warstwa liniowa służy do renderowania konturu wielokątów. Poniższy przykładowy kod renderuje wielokąt podobny do poprzedniego przykładu, ale teraz dodaje warstwę liniową. Ta warstwa liniowa jest drugą warstwą połączoną ze źródłem danych.

//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)
    )
)

Poniższy zrzut ekranu przedstawia powyższy kod renderujący wielokąt z jego konturem renderowany przy użyciu warstwy liniowej.

Napiwek

Podczas tworzenia wielokąta z warstwą liniową należy zamknąć wszystkie pierścienie w wielokątach, tak aby każda tablica punktów ma ten sam punkt początkowy i końcowy. Jeśli nie zostanie to zrobione, warstwa liniowa może nie połączyć ostatniego punktu wielokąta z pierwszym punktem.

Wypełnianie wielokąta wzorcem

Oprócz wypełnienia wielokąta kolorem można użyć wzorca obrazu do wypełnienia wielokąta. Załaduj wzorzec obrazu do zasobów sprite obrazu mapy, a następnie odwołaj się do tego obrazu z fillPattern opcją warstwy wielokątnej.

//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"
)

W tym przykładzie poniższy obraz został załadowany do folderu drawable aplikacji.

fill-checker-red.png

Na poniższej ilustracji przedstawiono zrzut ekranu przedstawiający powyższy kod, który renderuje wielokąt z wzorcem wypełnienia na mapie.

Następne kroki

Więcej przykładów kodu do dodania do map można znaleźć w następujących artykułach:

Tworzenie źródła danych

Używanie wyrażeń stylu opartych na danych

Dodawanie warstwy liniowej

Dodawanie warstwy ekstruzji wielokąta