RadzenGoogleMap component not working

Hey everyone, I need some help with my google maps component.
I've set a correct ApiKey and got my lat and lng out an object which is shown in the code below.

						<RadzenGoogleMap ApiKey="ApiKey" style="height: 400px" Zoom="3" Center="@(new GoogleMapPosition() { Lat = _lat, Lng = _lng})">

						</RadzenGoogleMap>

	protected async override Task OnInitializedAsync()
	{
		await GetStore();
		await ShowPhoneNumberAsOne();
		await GetGoogleMapCoordinates();
		await base.OnInitializedAsync();
	}

	protected async Task GetGoogleMapCoordinates()
	{
		string coordinates = _storeInfoDto.Coordinates;
		string[] splitCoordinates = coordinates.Split(",", 2);

		if (double.TryParse(splitCoordinates[0], out double lat) && double.TryParse(splitCoordinates[1], out double lng))
		{
			_lat = lat;
			_lng = lng;
		}
		else
		{
			_error = "Google map view not available, contact admin.";
		}

	}

However i get this as a result on my blazor page.

Can anyone tell me what is going wrong? I don't seem to find it in the docs where i could've gone wrong.

Thanks in advance!

EDIT

If i scroll out i get this view in my googlemap component. Is there something wrong with my zoom or center?


In order to get to this image, i have to zoom out maximum and then keep dragging the map from bottom to top.

EDIT2

Found my issue. My Lat and Lng aren't parsed correctly from string to double, sorry for the trouble.

Works okay for me with a zoom factor of 16. Do you get any javascript errors?


Hey thanks for the reply, I updated the zoom to 16 but I get the same screen. Also no javascript errors.

I did just hardcode the lat and lng in it as shown below.

<RadzenGoogleMap ApiKey="My_Key" style="height: 400px" Zoom="16" Center=@(new GoogleMapPosition() { Lat = 42.5856394, Lng = -7.6388104})>
							<RadzenGoogleMapMarker Title="@_dealerAddressInfoDto.DealerAddressName" Position=@(new GoogleMapPosition() { Lat = 42.5856394, Lng = -7.6388104})></RadzenGoogleMapMarker>
						</RadzenGoogleMap>

Then it does work but there is no marker.

My RadzenGoogleMapMarker needed to be nested in a Marker element. Can someone close this for me?

This is my working page with marker

1 Like

Hi @Arne_Wullaert,

There is no need to close a thread. It is sufficient that you posted what the problem was.