- Angular app to display map data from the Tomtom API
- Note: to open web links in a new window use: ctrl+click on link
*** Note: to open web links in a new window use: ctrl+click on link**
- Displays a Tomtom zoomable map that shows user position with full-screen and zoom options
- Install dependencies by running
npm i
- See Tomtom: Angular Map Display API integration tutorial and add code as shown
- Get yourself an API key from Tomtom - it's free :-) and add it to
environment.ts
- Run
ng serve
to start a server on port 4200 - Run
npm run build
to create build file indist/angular-tomtom-api
directory.
- extract from
app.component.ts
: function to get user position
private getUserPosition = (): Observable<Position> => {
const userPosition = new Observable((observer: Subscriber<any>) => {
navigator.geolocation
? navigator.geolocation.getCurrentPosition((pos: any) => {
observer.next({
latitude: pos.coords.latitude,
longitude: pos.coords.longitude,
});
observer.complete();
})
: observer.error();
});
return userPosition;
};
- Not much code required to get a zoomable world map
- Status: Working. Size of build file: 9.46MB - nearly all Vendor files
- To-Do: Nothing
- This project is licensed under the terms of the MIT license.
- Repo created by ABateman, email:
gomezbateman@yahoo.com