Share via

@azure-rest/maps-render package

Interfaces

CircularPath

Specify a circular path.
CircularPathOptions

The options that modify the style of a circular path.
CopyrightCaptionOutput

This object is returned from a successful copyright call
CopyrightOutput

This object is returned from a successful copyright request
ErrorAdditionalInfoOutput

The resource management error additional info.
ErrorDetailOutput

The error detail.
ErrorResponseOutput

Common error response for all Azure Resource Manager APIs to return error details for failed operations. (This also follows the OData error response format.).
GetCopyrightCaption
GetCopyrightForTile
GetCopyrightForWorld
GetCopyrightFromBoundingBox
GetMapAttribution
GetMapStateTile
GetMapStaticImage
GetMapTile
GetMapTileset
MapAttributionOutput

Copyright attribution for the requested section of a tileset.
MapTilesetOutput

Metadata for a tileset in the TileJSON format.
MapsRenderClientOptions

The optional parameters for the client
Pin

Specify how the pin's position and label text.
PinOptions

The pin options for default/none image style..
PinSet
PolygonalPath

Specify a polygonal path.
PolygonalPathOptions

The options that modify the style of a polygonal path.
RegionCopyrightsCountryOutput

Country property
RegionCopyrightsOutput
RenderGetCopyrightCaption200Response

The Get Copyright Caption API is an HTTP GET request designed to serve copyright information to be used with tiles requested from the Render service. In addition to a basic copyright for the whole map, it can serve specific groups of copyrights for some countries/regions.

As an alternative to copyrights for map request, it can also return captions for displaying provider information on the map.
RenderGetCopyrightCaptionDefaultResponse

The Get Copyright Caption API is an HTTP GET request designed to serve copyright information to be used with tiles requested from the Render service. In addition to a basic copyright for the whole map, it can serve specific groups of copyrights for some countries/regions.

As an alternative to copyrights for map request, it can also return captions for displaying provider information on the map.
RenderGetCopyrightForTile200Response

To obtain the copyright information for a particular tile, the request should specify the tile's zoom level and x and y coordinates. For more information, see Zoom Levels and Tile Grid.

Copyrights API is designed to serve copyright information for Render service. In addition to basic copyright for the whole map, API is serving specific groups of copyrights for some countries/regions.
RenderGetCopyrightForTileDefaultResponse

To obtain the copyright information for a particular tile, the request should specify the tile's zoom level and x and y coordinates. For more information, see Zoom Levels and Tile Grid.

Copyrights API is designed to serve copyright information for Render service. In addition to basic copyright for the whole map, API is serving specific groups of copyrights for some countries/regions.
RenderGetCopyrightForTileQueryParam
RenderGetCopyrightForTileQueryParamProperties
RenderGetCopyrightForWorld200Response

Returns the copyright information for the world. To obtain the default copyright information for the whole world, don't specify a tile or bounding box.

Copyrights API is designed to serve copyright information for Render service. In addition to basic copyright for the whole map, API is serving specific groups of copyrights for some countries/regions.
RenderGetCopyrightForWorldDefaultResponse

Returns the copyright information for the world. To obtain the default copyright information for the whole world, don't specify a tile or bounding box.

Copyrights API is designed to serve copyright information for Render service. In addition to basic copyright for the whole map, API is serving specific groups of copyrights for some countries/regions.
RenderGetCopyrightForWorldQueryParam
RenderGetCopyrightForWorldQueryParamProperties
RenderGetCopyrightFromBoundingBox200Response

Returns copyright information for a given bounding box. Bounding-box requests should specify the minimum and maximum longitude and latitude (EPSG-3857) coordinates
RenderGetCopyrightFromBoundingBoxDefaultResponse

Returns copyright information for a given bounding box. Bounding-box requests should specify the minimum and maximum longitude and latitude (EPSG-3857) coordinates
RenderGetCopyrightFromBoundingBoxQueryParam
RenderGetCopyrightFromBoundingBoxQueryParamProperties
RenderGetMapAttribution200Response

The Get Map Attribution API allows users to request map copyright attribution information for a section of a tileset.
RenderGetMapAttributionDefaultResponse

The Get Map Attribution API allows users to request map copyright attribution information for a section of a tileset.
RenderGetMapAttributionQueryParam
RenderGetMapAttributionQueryParamProperties
RenderGetMapStateTile200Headers
RenderGetMapStateTile200Response

Fetches state tiles in vector format typically to be integrated into indoor maps module of map control or SDK. The map control will call this API after user turns on dynamic styling. For more information, see Zoom Levels and Tile Grid.
RenderGetMapStateTileDefaultResponse

Fetches state tiles in vector format typically to be integrated into indoor maps module of map control or SDK. The map control will call this API after user turns on dynamic styling. For more information, see Zoom Levels and Tile Grid.
RenderGetMapStateTileQueryParam
RenderGetMapStateTileQueryParamProperties
RenderGetMapStaticImage200Headers
RenderGetMapStaticImage200Response

This rendering API produces static, rasterized map views of a user-defined area. It's suitable for lightweight web applications, when the desired user experience doesn't require interactive map controls, or when bandwidth is limited. This API is also useful for embedding maps in applications outside of the browser, in backend services, report generation, or desktop applications.

This API includes parameters for basic data visualization:

  • Labeled pushpins in multiple styles.
  • Render circle, path, and polygon geometry types.

For more information and detailed examples, see Render custom data on a raster map.

The dimensions of the bbox parameter are constrained, depending on the zoom level. This ensures the resulting image has an appropriate level of detail.

Zoom Level Min Lon Range Max Lon Range Min Lat Range Max Lat Range
0 56.25 360.0 30.1105585173 180.0
1 28.125 360.0 14.87468995 180.0
2 14.063 351.5625 7.4130741851 137.9576312246
3 7.03125 175.78125 3.7034501005 73.6354071932
4 3.515625 87.890625 1.8513375155 35.4776115315
5 1.7578125 43.9453125 0.925620264 17.4589959239
6 0.87890625 21.97265625 0.4628040687 8.6907788223
7 0.439453125 10.986328125 0.2314012764 4.3404320789
8 0.2197265625 5.4931640625 0.1157005434 2.1695927024
9 0.1098632812 2.7465820312 0.0578502599 1.0847183194
10 0.0549316406 1.3732910156 0.0289251285 0.5423494021
11 0.0274658203 0.6866455078 0.014462564 0.2711734813
12 0.0137329102 0.3433227539 0.007231282 0.1355865882
13 0.0068664551 0.171661377 0.003615641 0.067793275
14 0.0034332275 0.0858306885 0.0018078205 0.0338966351
15 0.0017166138 0.0429153442 0.0009039102 0.0169483173
16 0.0008583069 0.0214576721 0.0004519551 0.0084741586
17 0.0004291534 0.0107288361 0.0002259776 0.0042370793
18 0.0002145767 0.005364418 0.0001129888 0.0021185396
19 0.0001072884 0.002682209 5.64944E-05 0.0010592698
20 5.36442E-05 0.0013411045 2.82472E-05 0.0005296349

Note : Either center or bbox parameter must be supplied to the API.
RenderGetMapStaticImageDefaultResponse

This rendering API produces static, rasterized map views of a user-defined area. It's suitable for lightweight web applications, when the desired user experience doesn't require interactive map controls, or when bandwidth is limited. This API is also useful for embedding maps in applications outside of the browser, in backend services, report generation, or desktop applications.

This API includes parameters for basic data visualization:

  • Labeled pushpins in multiple styles.
  • Render circle, path, and polygon geometry types.

For more information and detailed examples, see Render custom data on a raster map.

The dimensions of the bbox parameter are constrained, depending on the zoom level. This ensures the resulting image has an appropriate level of detail.

Zoom Level Min Lon Range Max Lon Range Min Lat Range Max Lat Range
0 56.25 360.0 30.1105585173 180.0
1 28.125 360.0 14.87468995 180.0
2 14.063 351.5625 7.4130741851 137.9576312246
3 7.03125 175.78125 3.7034501005 73.6354071932
4 3.515625 87.890625 1.8513375155 35.4776115315
5 1.7578125 43.9453125 0.925620264 17.4589959239
6 0.87890625 21.97265625 0.4628040687 8.6907788223
7 0.439453125 10.986328125 0.2314012764 4.3404320789
8 0.2197265625 5.4931640625 0.1157005434 2.1695927024
9 0.1098632812 2.7465820312 0.0578502599 1.0847183194
10 0.0549316406 1.3732910156 0.0289251285 0.5423494021
11 0.0274658203 0.6866455078 0.014462564 0.2711734813
12 0.0137329102 0.3433227539 0.007231282 0.1355865882
13 0.0068664551 0.171661377 0.003615641 0.067793275
14 0.0034332275 0.0858306885 0.0018078205 0.0338966351
15 0.0017166138 0.0429153442 0.0009039102 0.0169483173
16 0.0008583069 0.0214576721 0.0004519551 0.0084741586
17 0.0004291534 0.0107288361 0.0002259776 0.0042370793
18 0.0002145767 0.005364418 0.0001129888 0.0021185396
19 0.0001072884 0.002682209 5.64944E-05 0.0010592698
20 5.36442E-05 0.0013411045 2.82472E-05 0.0005296349

Note : Either center or bbox parameter must be supplied to the API.
RenderGetMapStaticImageQueryParam
RenderGetMapStaticImageQueryParamProperties
RenderGetMapTile200Headers
RenderGetMapTile200Response

The Get Map Tiles API in an HTTP GET request that allows users to request map tiles in vector or raster formats typically to be integrated into a map control or SDK. Some example tiles that can be requested are Azure Maps road tiles, real-time Weather Radar tiles or the map tiles created using Azure Maps Creator. By default, Azure Maps uses vector tiles for its web map control (Web SDK) and Android SDK.
RenderGetMapTileDefaultResponse

The Get Map Tiles API in an HTTP GET request that allows users to request map tiles in vector or raster formats typically to be integrated into a map control or SDK. Some example tiles that can be requested are Azure Maps road tiles, real-time Weather Radar tiles or the map tiles created using Azure Maps Creator. By default, Azure Maps uses vector tiles for its web map control (Web SDK) and Android SDK.
RenderGetMapTileQueryParam
RenderGetMapTileQueryParamProperties
RenderGetMapTileset200Response

The Get Map Tileset API allows users to request metadata for a tileset.
RenderGetMapTilesetDefaultResponse

The Get Map Tileset API allows users to request metadata for a tileset.
RenderGetMapTilesetQueryParam
RenderGetMapTilesetQueryParamProperties
Routes

Type Aliases

MapsRenderClient
RenderGetCopyrightCaptionParameters
RenderGetCopyrightForTileParameters
RenderGetCopyrightForWorldParameters
RenderGetCopyrightFromBoundingBoxParameters
RenderGetMapAttributionParameters
RenderGetMapStateTileParameters
RenderGetMapStaticImageParameters
RenderGetMapTileParameters
RenderGetMapTilesetParameters

Functions

createPathQuery((PolygonalPath | CircularPath)[])

Create a path query string for get map static image request.

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender, { CircularPath, PolygonalPath, createPathQuery } from "@azure-rest/maps-render";
import { createWriteStream } from "node:fs";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");

const circularPath: CircularPath = {
  center: [52.4559, 13.228],
  radiusInMeters: 10000,
  options: {
    lineColor: "000000",
    lineOpacity: 0.9,
    lineWidthInPixels: 2,
  },
};

const linearPath: PolygonalPath = {
  coordinates: [
    [52.577, 13.35],
    [52.6, 13.2988],
    [52.32, 13.2988],
  ],
  options: {
    lineColor: "000000",
    lineOpacity: 0.9,
    lineWidthInPixels: 2,
  },
};

const polygonPath: PolygonalPath = {
  coordinates: [
    [52.577, 13.35],
    [52.6, 13.2988],
    [52.32, 13.2988],
    [52.577, 13.35],
  ],
  options: {
    lineColor: "000000",
    lineOpacity: 0.9,
    lineWidthInPixels: 2,
    fillColor: "FFFFFF",
    fillOpacity: 0.8,
  },
};

const path = createPathQuery([circularPath, linearPath, polygonPath]);
// Send the request
const response = await client
  .path("/map/static")
  .get({
    queryParameters: {
      bbox: [13.228, 52.4559, 13.5794, 52.629],
      path,
    },
  })
  .asNodeStream();

// Handle the error.
if (!response.body) {
  throw Error("No response body");
}

response.body.pipe(createWriteStream("path.png"));
createPinsQuery(PinSet[])

Create a pin query string for get map static image

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender, { PinSet, createPinsQuery } from "@azure-rest/maps-render";
import { createWriteStream } from "node:fs";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");

const pins: PinSet[] = [
  {
    pins: [
      { coordinate: [52.577, 13.35], label: "Label start" },
      { coordinate: [52.6, 13.2988], label: "Label end" },
    ],
    pinImage: "default",
    options: {
      scale: 0.9,
      pinColor: "FF0000",
      labelColor: "0000FF",
      labelSizeInPixels: 18,
    },
  },
];

const path = createPinsQuery(pins);

const response = await client
  .path("/map/static")
  .get({
    queryParameters: {
      bbox: [13.228, 52.4559, 13.5794, 52.62],
      zoom: 10,
      path,
    },
    skipUrlEncoding: true,
  })
  .asNodeStream();

// Handle the error.
if (!response.body) {
  throw Error("No response body");
}

response.body.pipe(createWriteStream("pin.png"));
default(AzureKeyCredential, ClientOptions)

Creates an instance of MapsRenderClient from a subscription key.

Example

import { AzureKeyCredential } from "@azure/core-auth";
import MapsRender from "@azure-rest/maps-render";

const credential = new AzureKeyCredential("<subscription-key>");
const client = MapsRender(credential);
default(TokenCredential, string, ClientOptions)

Creates an instance of MapsRender from an Azure Identity TokenCredential.

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender from "@azure-rest/maps-render";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");
default(AzureSASCredential, ClientOptions)

Creates an instance of MapsRender from an Azure Identity AzureSASCredential.

Example

import { AzureSASCredential } from "@azure/core-auth";
import MapsRender from "@azure-rest/maps-render";

const credential = new AzureSASCredential("<SAS Token>");
const client = MapsRender(credential);
isUnexpected(RenderGetMapTile200Response | RenderGetMapTileDefaultResponse)
isUnexpected(RenderGetMapTileset200Response | RenderGetMapTilesetDefaultResponse)
isUnexpected(RenderGetMapAttribution200Response | RenderGetMapAttributionDefaultResponse)
isUnexpected(RenderGetMapStateTile200Response | RenderGetMapStateTileDefaultResponse)
isUnexpected(RenderGetCopyrightCaption200Response | RenderGetCopyrightCaptionDefaultResponse)
isUnexpected(RenderGetMapStaticImage200Response | RenderGetMapStaticImageDefaultResponse)
isUnexpected(RenderGetCopyrightFromBoundingBox200Response | RenderGetCopyrightFromBoundingBoxDefaultResponse)
isUnexpected(RenderGetCopyrightForTile200Response | RenderGetCopyrightForTileDefaultResponse)
isUnexpected(RenderGetCopyrightForWorld200Response | RenderGetCopyrightForWorldDefaultResponse)
positionToTileXY(LatLon, number, "256" | "512")

Calculates the XY tile coordinates that a coordinate falls into for a specific zoom level. Reference: https://learn.microsoft.com/en-us/azure/azure-maps/zoom-levels-and-tile-grid?tabs=typescript#tile-math-source-code

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender, { positionToTileXY } from "@azure-rest/maps-render";
import { createWriteStream } from "node:fs";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");

const zoom = 6;
// Use the helper function `positionToTileXY` to get the tile index from the coordinate.
const { x, y } = positionToTileXY([47.61559, -122.33817], 6, "256");
const response = await client
  .path("/map/tile")
  .get({
    queryParameters: {
      tilesetId: "microsoft.base.road",
      zoom,
      x,
      y,
    },
  })
  .asNodeStream();

// Handle the error.
if (!response.body) {
  throw Error("No response body");
}

response.body.pipe(createWriteStream("tile.png"));

Function Details

createPathQuery((PolygonalPath | CircularPath)[])

Create a path query string for get map static image request.

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender, { CircularPath, PolygonalPath, createPathQuery } from "@azure-rest/maps-render";
import { createWriteStream } from "node:fs";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");

const circularPath: CircularPath = {
  center: [52.4559, 13.228],
  radiusInMeters: 10000,
  options: {
    lineColor: "000000",
    lineOpacity: 0.9,
    lineWidthInPixels: 2,
  },
};

const linearPath: PolygonalPath = {
  coordinates: [
    [52.577, 13.35],
    [52.6, 13.2988],
    [52.32, 13.2988],
  ],
  options: {
    lineColor: "000000",
    lineOpacity: 0.9,
    lineWidthInPixels: 2,
  },
};

const polygonPath: PolygonalPath = {
  coordinates: [
    [52.577, 13.35],
    [52.6, 13.2988],
    [52.32, 13.2988],
    [52.577, 13.35],
  ],
  options: {
    lineColor: "000000",
    lineOpacity: 0.9,
    lineWidthInPixels: 2,
    fillColor: "FFFFFF",
    fillOpacity: 0.8,
  },
};

const path = createPathQuery([circularPath, linearPath, polygonPath]);
// Send the request
const response = await client
  .path("/map/static")
  .get({
    queryParameters: {
      bbox: [13.228, 52.4559, 13.5794, 52.629],
      path,
    },
  })
  .asNodeStream();

// Handle the error.
if (!response.body) {
  throw Error("No response body");
}

response.body.pipe(createWriteStream("path.png"));

function createPathQuery(paths: (PolygonalPath | CircularPath)[]): string

Parameters

paths

(PolygonalPath | CircularPath)[]

A collection of PolygonalPath and CircularPath that you want to draw on the image.

Returns

string

createPinsQuery(PinSet[])

Create a pin query string for get map static image

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender, { PinSet, createPinsQuery } from "@azure-rest/maps-render";
import { createWriteStream } from "node:fs";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");

const pins: PinSet[] = [
  {
    pins: [
      { coordinate: [52.577, 13.35], label: "Label start" },
      { coordinate: [52.6, 13.2988], label: "Label end" },
    ],
    pinImage: "default",
    options: {
      scale: 0.9,
      pinColor: "FF0000",
      labelColor: "0000FF",
      labelSizeInPixels: 18,
    },
  },
];

const path = createPinsQuery(pins);

const response = await client
  .path("/map/static")
  .get({
    queryParameters: {
      bbox: [13.228, 52.4559, 13.5794, 52.62],
      zoom: 10,
      path,
    },
    skipUrlEncoding: true,
  })
  .asNodeStream();

// Handle the error.
if (!response.body) {
  throw Error("No response body");
}

response.body.pipe(createWriteStream("pin.png"));

function createPinsQuery(pinSets: PinSet[]): string

Parameters

pinSets

PinSet[]

Returns

string

  • The composed query string.

default(AzureKeyCredential, ClientOptions)

Creates an instance of MapsRenderClient from a subscription key.

Example

import { AzureKeyCredential } from "@azure/core-auth";
import MapsRender from "@azure-rest/maps-render";

const credential = new AzureKeyCredential("<subscription-key>");
const client = MapsRender(credential);

function default(credential: AzureKeyCredential, options?: ClientOptions): MapsRenderClient

Parameters

credential
AzureKeyCredential

An AzureKeyCredential instance used to authenticate requests to the service

options
ClientOptions

Options used to configure the Render Client

Returns

MapsRenderClient

default(TokenCredential, string, ClientOptions)

Creates an instance of MapsRender from an Azure Identity TokenCredential.

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender from "@azure-rest/maps-render";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");

function default(credential: TokenCredential, mapsAccountClientId: string, options?: ClientOptions): MapsRenderClient

Parameters

credential
TokenCredential

An TokenCredential instance used to authenticate requests to the service

mapsAccountClientId

string

The Azure Maps client id of a specific map resource

options
ClientOptions

Options used to configure the Render Client

Returns

MapsRenderClient

default(AzureSASCredential, ClientOptions)

Creates an instance of MapsRender from an Azure Identity AzureSASCredential.

Example

import { AzureSASCredential } from "@azure/core-auth";
import MapsRender from "@azure-rest/maps-render";

const credential = new AzureSASCredential("<SAS Token>");
const client = MapsRender(credential);

function default(credential: AzureSASCredential, options?: ClientOptions): MapsRenderClient

Parameters

credential
AzureSASCredential

An AzureSASCredential instance used to authenticate requests to the service

options
ClientOptions

Options used to configure the Render Client

Returns

MapsRenderClient

isUnexpected(RenderGetMapTile200Response | RenderGetMapTileDefaultResponse) 

function isUnexpected(response: RenderGetMapTile200Response | RenderGetMapTileDefaultResponse): response

Parameters

response

RenderGetMapTile200Response | RenderGetMapTileDefaultResponse

Returns

response

isUnexpected(RenderGetMapTileset200Response | RenderGetMapTilesetDefaultResponse) 

function isUnexpected(response: RenderGetMapTileset200Response | RenderGetMapTilesetDefaultResponse): response

Parameters

response

RenderGetMapTileset200Response | RenderGetMapTilesetDefaultResponse

Returns

response

isUnexpected(RenderGetMapAttribution200Response | RenderGetMapAttributionDefaultResponse) 

function isUnexpected(response: RenderGetMapAttribution200Response | RenderGetMapAttributionDefaultResponse): response

Parameters

response

RenderGetMapAttribution200Response | RenderGetMapAttributionDefaultResponse

Returns

response

isUnexpected(RenderGetMapStateTile200Response | RenderGetMapStateTileDefaultResponse) 

function isUnexpected(response: RenderGetMapStateTile200Response | RenderGetMapStateTileDefaultResponse): response

Parameters

response

RenderGetMapStateTile200Response | RenderGetMapStateTileDefaultResponse

Returns

response

isUnexpected(RenderGetCopyrightCaption200Response | RenderGetCopyrightCaptionDefaultResponse) 

function isUnexpected(response: RenderGetCopyrightCaption200Response | RenderGetCopyrightCaptionDefaultResponse): response

Parameters

response

RenderGetCopyrightCaption200Response | RenderGetCopyrightCaptionDefaultResponse

Returns

response

isUnexpected(RenderGetMapStaticImage200Response | RenderGetMapStaticImageDefaultResponse) 

function isUnexpected(response: RenderGetMapStaticImage200Response | RenderGetMapStaticImageDefaultResponse): response

Parameters

response

RenderGetMapStaticImage200Response | RenderGetMapStaticImageDefaultResponse

Returns

response

isUnexpected(RenderGetCopyrightFromBoundingBox200Response | RenderGetCopyrightFromBoundingBoxDefaultResponse) 

function isUnexpected(response: RenderGetCopyrightFromBoundingBox200Response | RenderGetCopyrightFromBoundingBoxDefaultResponse): response

Parameters

response

RenderGetCopyrightFromBoundingBox200Response | RenderGetCopyrightFromBoundingBoxDefaultResponse

Returns

response

isUnexpected(RenderGetCopyrightForTile200Response | RenderGetCopyrightForTileDefaultResponse) 

function isUnexpected(response: RenderGetCopyrightForTile200Response | RenderGetCopyrightForTileDefaultResponse): response

Parameters

response

RenderGetCopyrightForTile200Response | RenderGetCopyrightForTileDefaultResponse

Returns

response

isUnexpected(RenderGetCopyrightForWorld200Response | RenderGetCopyrightForWorldDefaultResponse) 

function isUnexpected(response: RenderGetCopyrightForWorld200Response | RenderGetCopyrightForWorldDefaultResponse): response

Parameters

response

RenderGetCopyrightForWorld200Response | RenderGetCopyrightForWorldDefaultResponse

Returns

response

positionToTileXY(LatLon, number, "256" | "512")

Calculates the XY tile coordinates that a coordinate falls into for a specific zoom level. Reference: https://learn.microsoft.com/en-us/azure/azure-maps/zoom-levels-and-tile-grid?tabs=typescript#tile-math-source-code

Example

import { DefaultAzureCredential } from "@azure/identity";
import MapsRender, { positionToTileXY } from "@azure-rest/maps-render";
import { createWriteStream } from "node:fs";

const credential = new DefaultAzureCredential();
const client = MapsRender(credential, "<maps-account-client-id>");

const zoom = 6;
// Use the helper function `positionToTileXY` to get the tile index from the coordinate.
const { x, y } = positionToTileXY([47.61559, -122.33817], 6, "256");
const response = await client
  .path("/map/tile")
  .get({
    queryParameters: {
      tilesetId: "microsoft.base.road",
      zoom,
      x,
      y,
    },
  })
  .asNodeStream();

// Handle the error.
if (!response.body) {
  throw Error("No response body");
}

response.body.pipe(createWriteStream("tile.png"));

function positionToTileXY(position: LatLon, zoom: number, tileSize: "256" | "512"): { x: number, y: number }

Parameters

position
LatLon

Position coordinate in the format [latitude, longitude].

zoom

number

Zoom level.

tileSize

"256" | "512"

The size of the tiles in the tile pyramid.

Returns

{ x: number, y: number }

Tile XY coordinates.