After enter current address i want show it on Google Maps

Hi,i would like to immediately display it on a Google Map after the user enters their address.
Google Api Key is a
vailable.


4 Replies

HP Hemanathan Pandian Syncfusion Team January 4, 2024 11:43 AM UTC

Hi Martin,


The Blazor Maps component supports rendering online maps such as Google maps, Azure maps and so on via their tile server URLs. We do not support any of their APIs in the component. So, we cannot enter an address and show a marker on the map. If you have access to the Google maps tile server URL, you can follow the below documentations to render the online map and markers on it.


Online Maps: https://blazor.syncfusion.com/documentation/maps/providers/other-maps

Markers: https://blazor.syncfusion.com/documentation/maps/markers


Please let us know if you need any further assistance.



MK martin krause January 26, 2024 08:35 AM UTC

Hello syncfusion, what are the advantages and disadvantages if I use your control directly
i have also tryed your sample
Blazor-FAQ-Samples/Using Google Maps in Blazor at master · SyncfusionExamples/Blazor-FAQ-Samples · GitHub

but i will not rum



IR Indumathi Ravi Syncfusion Team January 29, 2024 05:28 PM UTC

Hi Martin,


Please find the details from the below table.

Queries

Details

what are the advantages and disadvantages if I use your control directly

You can find some of the advantages and limitations of the Syncfusion Maps component below.

 

Advantages:

  • The Blazor Maps component supports rendering various online maps, such as Google Maps, Azure Maps, and so on, via their tile server URLs.
  • The Blazor Maps component supports rendering geometry shape maps using GeoJSON and shapefile maps. It can also render custom shapes such as floor plans, bus seat booking charts, and other custom shapes.
  • The Maps component provides support for adding additional elements such as markers, navigation lines, tooltips, legends, annotations, and navigation lines over the map.
  • UI functionalities such as zooming, highlight, and selection are supported and improve the interactive experience for users.
  • The Maps component allows users to print and export the map as an image or PDF document.
  • It supports clustering the markers added to the Maps when more markers are available in the same location.
  • The Maps component also supports rendering all the geometry types in the GeoJSON format.

 

Limitations:

  • We do not support inserting markers based on the names of the street, country, and postal code. In short, advanced futuristic UI like Google and Azure Maps is not possible, and we just showcase a simple viewable map with decent features.
  • We do not support the APIs provided by the map providers, such as Google Maps and Bing Maps.
  • We do not export annotations and templates supported in markers and data labels along with the maps when exported to an image or PDF document.
  • The performance of the maps in different use cases is minimal in the Blazor WASM when compared with server applications due to the Blazor framework.

To know more about the Maps, please follow the below online demo and documentation link.

Demo: https://blazor.syncfusion.com/demos/maps/default-functionalities?theme=fluent

Documentation: https://blazor.syncfusion.com/documentation/maps/getting-started

 

i have also tryed your sample
Blazor-FAQ-Samples/Using Google Maps in Blazor at master · SyncfusionExamples/Blazor-FAQ-Samples · GitHub

The provided GitHub link does not include the Syncfusion Maps component. We created a sample just to show how Google Maps renders in the Blazor application using Google APIs. However, currently, we do not have the Google API key to re-check the project. We will check and notify you with additional information on January 31, 2024.


Please let us know if you need any further assistance.



IR Indumathi Ravi Syncfusion Team January 31, 2024 04:30 PM UTC

Hi Martin,


We have tested our GitHub sample with a Google API key, and it is functioning as expected. In the provided sample, you need to add your Google API key in the "_Layout.cshtml" file, as shown below.

[_Layout.cshtml]

<script type="text/javascript" src=https://maps.googleapis.com/maps/api/js?key=Your_Key&callback=initMap></script>


You can view the tested sample screenshot below.


Please let us know if you need any further assistance.


Loader.
Up arrow icon