Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Google Map Bounds Coordinates #105

Closed
mxmissile opened this issue Nov 29, 2021 · 5 comments · Fixed by #108 · May be fixed by #97
Closed

Google Map Bounds Coordinates #105

mxmissile opened this issue Nov 29, 2021 · 5 comments · Fixed by #108 · May be fixed by #97
Assignees
Labels
enhancement New feature or request question Further information is requested

Comments

@mxmissile
Copy link
Contributor

mxmissile commented Nov 29, 2021

The google map api we can get the bounds via these methods:

const bounds = map.getBounds();
const ne = bounds.getNorthEast();
const sw = bounds.getSouthWest();

Does this library support anything like this?

Update: I'm trying to use jsinterop to call these methods:

private async Task OnMapBoundsChanged()
{
        var _mapsJs = await _js.InvokeAsync<IJSObjectReference>("import", "./_content/Majorsoft.Blazor.Components.Maps/googleMaps.min.js");
        await _mapsJs.InvokeVoidAsync("getBounds", _map.MapId);
}

But its not working, (I'm new to js interop), its throwing:

Error: Microsoft.JSInterop.JSException: Could not find 'getBounds' ('getBounds' was undefined).

@mxmissile mxmissile changed the title Bounds Coordinates Google Map Bounds Coordinates Nov 29, 2021
@majorimi majorimi self-assigned this Dec 1, 2021
@majorimi majorimi added enhancement New feature or request question Further information is requested labels Dec 1, 2021
@majorimi
Copy link
Owner

majorimi commented Dec 1, 2021

Hi @mxmissile,

Thanks for contacting me. Currently not all map functions are supported. I can look into this and try to add them. Let you know if it is possible... I think won't be hard and can include into the next release.

@majorimi majorimi linked a pull request Dec 2, 2021 that will close this issue
@Grizzlly
Copy link

Regarding this, the API also offers restrictions on the map bounds, so you can limit the map to a certain country for example. This is documented here.

I think this is might be quite easy to implement as it only requires changes in the window.initGoogleMaps function, specifically the map initializer.

It would be nice if the InnerElementReference would actually contain the map object so we can work with it....

@majorimi
Copy link
Owner

majorimi commented Dec 20, 2021

@mxmissile Implemented your request added some get methods. One of which is GetBoundsAsync() it is returning a GoogleMapLatLngBounds object. Since Blazor works very differently then Maps API so you cannot call simple methods on this object. Because it would require JsInterop calls. So all parameterless method calls was done during the JS getBounds request.

You can use the code like this:

var bounds = await _googleMap.GoogleMapService.GetBoundsAsync();

var neLat = bounds.NorthEast.Latitude;
var neLng = bounds.NorthEast.Longitude;
...
var swLat = bound.SouthWest.Latitude
... //etc

You can try it if you pull down branch Release/v1.6.0. Let me know if this is what you were needed.

@mxmissile
Copy link
Contributor Author

Wow! Thank you so much, I will dive in today on this.

@majorimi
Copy link
Owner

Sure no problem once you confirm it is ok I will add it to the next Nuget package release. Since it Christmas etc. the release will be done next year....

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request question Further information is requested
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants