Trying to get a map from URL in Flutter

johnwiese 0 Reputation points Microsoft Employee
2023-05-03T21:00:00.3266667+00:00

I am trying to integrate Azure Maps into a Flutter application. I am using the flutter_map package from pub.dev. I do not think this is a Flutter issue or an issue with the plugin. I can provide this URL along with my key and a location and it will display just fine:

'https://atlas.microsoft.com/map/tile/png?api-version=1&layer=basic&style=dark&tileSize=256&view=Auto&zoom={z}&x={x}&y={y}&subscription-key={subscriptionKey}'

But if I pass this as the URL I get the same map as the previous URL, no pins??

'https://atlas.microsoft.com/map/tile/png?api-version=1&layer=basic&style=dark&tileSize=256&view=Auto&zoom={z}&x={x}&y={y}&subscription-key={subscriptionKey}&pins=default%7C%7C47.57486513608924+-122.31074501155426'

and yes, the pin is on the map in the area I am showing to start with, so I should see it. Any idea how I can fix this? I would also love to understand if I can further customize the map, like changing the color of the background and such, similar to how Google Maps lets you create your own "style" to show.

Azure Maps
Azure Maps
An Azure service that provides geospatial APIs to add maps, spatial analytics, and mobility solutions to apps.
633 questions
{count} votes

1 answer

Sort by: Most helpful
  1. rbrundritt 16,156 Reputation points Microsoft Employee
    2023-05-04T06:10:47.1133333+00:00

    The first URL it appears you are using a URL to retrieve map tiles from Azure Maps. The second URL you appear to be mixing options from the tile service API with the static map image API which are not supported. There is not pins parameter available on the tile service API, that API servers map tiles from Azure Maps, it does not generate map images with pins drawn on it. Here are the docs:

    Map tile service: https://learn.microsoft.com/en-us/rest/api/maps/render/get-map-tile?tabs=HTTP

    Static map service: https://learn.microsoft.com/en-us/rest/api/maps/render/get-map-image?tabs=HTTP

    The static map service can be used to retrieve a map with pins drawn on it, but note that is an image of a specific map for a specific location and not map tiles that can be used in a dynamic map control such as flutter maps.

    1 person found this answer helpful.
    0 comments No comments