Skip to content

Commit 4c38f41

Browse files
authored
Merge pull request #286069 from stevemunk/attribute-updates-tutorial-route-location
Updated images in 'Tutorial: How to display route directions using Azure Maps Route service and Map control' to show the new attribute.
2 parents 8e7eac6 + 41b3f0e commit 4c38f41

File tree

4 files changed

+9
-9
lines changed

4 files changed

+9
-9
lines changed
249 KB
Loading
296 KB
Loading
301 KB
Loading

articles/azure-maps/tutorial-route-location.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ titleSuffix: Microsoft Azure Maps
44
description: Tutorial on how to find a route to a point of interest. See how to set address coordinates and query the Azure Maps Route service for directions to the point.
55
author: sinnypan
66
ms.author: sipa
7-
ms.date: 12/28/2021
7+
ms.date: 09/03/2024
88
ms.topic: tutorial
99
ms.service: azure-maps
1010
ms.subservice: web-sdk
@@ -78,11 +78,11 @@ The following steps show you how to create and display the Map control in a web
7878
</html>
7979
```
8080

81-
Some things to know about the above HTML:
81+
Some things to know about the HTML:
8282

8383
* The HTML header includes CSS and JavaScript resource files hosted by the Azure Map Control library.
84-
* The `onload` event in the body of the page calls the `GetMap` function when the body of the page has loaded.
85-
* The `GetMap` function contains the inline JavaScript code used to access the Azure Maps APIs. It's added in the next step.
84+
* The `onload` event in the body of the page calls the `GetMap` function when the body of the page finishes loading.
85+
* The `GetMap` function contains the inline JavaScript code used to access the Azure Maps APIs. This function is added in the next step.
8686

8787
3. Next, add the following JavaScript code to the `GetMap` function, just beneath the code added in the last step. This code creates a map control and initializes it using your Azure Maps subscription keys that you provide. Make sure and replace the string `<Your Azure Maps Key>` with the Azure Maps primary key that you copied from your Maps account.
8888

@@ -97,7 +97,7 @@ The following steps show you how to create and display the Map control in a web
9797
});
9898
```
9999

100-
Some things to know about the above JavaScript:
100+
Some things to know about the JavaScript:
101101

102102
* This is the core of the `GetMap` function, which initializes the Map Control API for your Azure Maps account key.
103103
* [atlas] is the namespace that contains the Azure Maps API and related visual components.
@@ -144,13 +144,13 @@ In this tutorial, the route is rendered using a line layer. The start and end po
144144
});
145145
```
146146

147-
Some things to know about the above JavaScript:
147+
Some things to know about the JavaScript:
148148

149149
* This code implements the Map control's `ready` event handler. The rest of the code in this tutorial is placed inside the `ready` event handler.
150150
* In the map control's `ready` event handler, a data source is created to store the route from start to end point.
151151
* To define how the route line is rendered, a line layer is created and attached to the data source. To ensure that the route line doesn't cover up the road labels, pass a second parameter with the value of `'labels'`.
152152

153-
Next, a symbol layer is created and attached to the data source. This layer specifies how the start and end points are rendered. Expressions have been added to retrieve the icon image and text label information from properties on each point object. To learn more about expressions, see [Data-driven style expressions].
153+
Next, a symbol layer is created and attached to the data source. This layer specifies how the start and end points are rendered. Expressions were added to retrieve the icon image and text label information from properties on each point object. To learn more about expressions, see [Data-driven style expressions].
154154

155155
2. Next, set the start point at Microsoft, and the end point at a gas station in Seattle. Start and points are created by appending the following code in the Map control's `ready` event handler:
156156

@@ -175,7 +175,7 @@ In this tutorial, the route is rendered using a line layer. The start and end po
175175
});
176176
```
177177

178-
Some things to know about the above JavaScript:
178+
Some things to know about the JavaScript:
179179

180180
* This code creates two [GeoJSON Point objects] to represent start and end points, which are then added to the data source.
181181
* The last block of code sets the camera view using the latitude and longitude of the start and end points.
@@ -230,7 +230,7 @@ This section shows you how to use the Azure Maps Route Directions API to get rou
230230
});
231231
```
232232

233-
Some things to know about the above JavaScript:
233+
Some things to know about the JavaScript:
234234

235235
* This code constructs the route from the start to end point.
236236
* The `url` queries the Azure Maps Route service API to calculate route directions.

0 commit comments

Comments
 (0)