TomTom Maps SDK is a set of libraries that offer robust and comprehensive location services, including maps, search, routing, traffic, and geofencing. TomTom Maps SDKs are available for different platforms—Android, iOS, and Web.
But can we put TomTom Maps SDK for Web to work with a popular web framework, such as ASP.NET Core? The answer is yes. This article will discuss how you can integrate TomTom SDK with an MVC project and a Web API service by injecting data into your map from your server-side code, and requesting server data from the client side.
You’ll also need to register as a developer on the TomTom Developer Portal and get an API key.
Next, create a new web app project in Visual Studio using these settings:
- Select ASP.NET Core Web Application.
- Name the project TomTomWeb to keep the same namespace as in our demo app.
- Select Web Application (Model-View-Controller) — make sure you select the ASP.NET Core 3.1 version.
Visual Studio uses the default template for the MVC project you just created.
Now, right-click the project name and assign port 5000 to the App URL:
Now press F5 to run the web app:
Next we’ll install the TomTom client libraries locally.
Go to Solution Explorer, right-click the project name and choose Add > Client-Side Library. When the dialog appears, select the unpkg library provider, type “tomtom” in the Library textbox, and choose the @tomtom-international/web-sdk-maps library:
After the installation, you’ll see that the TomTom @tomtom-international/web-sdk-maps package has been installed as a client library:
Now it’s time to add a reference to this client library. You can do this by modifying the MVC view directly, or by changing the _Layout.cshtml file to include references to map.css and maps-web.min.js:
... ... @RenderSection("Scripts", required: false)