How can I add Google Maps to a Blazor application?

To add Google Maps to a Blazor application, use the Google Maps API script. To initialize Google Maps in Blazor we need to use a JavaScript interop.  Add the following scripts to ~/Pages/_Layout.cshtml /_Host.cshtml for Server Blazor app or ~/wwwroot/index.html for Blazor WebAssembly app.  [_Host.cshtml/_Layout.cshtml/index.html]  [Script.js] [index.razor] In the above example, Google Maps is initialized in the OnAfterRenderAsync life cycle method. By invoking it using a JavaScript interop, this will initialize Google Map API when the page is rendered.  View Sample in GitHub  Note: If you’d like to know how to render Google Maps in Syncfusion Blazor Map, take a look at our  documentation section. 

What is Blazor?

Blazor is a component-based, single-page web app framework build using .NET.  It works well with all modern browsers via WebAssembly for client-side Blazor. Server-side Blazor ASP.NET Core app runs on server and makes use of SignalR connection to communicate with the client (browser).