Add getBounds, fitBounds and Rectangle

[jczerosb]

Is your feature request related to a problem? Please describe. Not a problem, but an improvement getBounds, fitbounds and Rectangle are existing features in Leaflet, getBounds is used to get a rectangular area occupied by Circle, Rectangle, Polygon, Polylines, etc. fitBounds is used to Zoom an specific area, usually enclosed by getBounds result. getBounds is a existing feature in Leaflet, it can be used to get rectangular area used by any

Describe the solution you'd like getBounds: we can get southwest and northeast coordinates of any Circle, Rectangle, Polygon or Polyline. fitBounds: we can Zoom in to an area collected by getBounds. Rectangle: we don´t need to use Polyline and can forget about calcular coordinates of each corner, Leaflet already does it

Describe alternatives you've considered None, I want to draw an object and Zoom In like a Zoom Window or Contents

Additional Info Leaflet getBounds returns a modified object of type LatLngBound it is like (sorry code did not showing formatted): {"_southWest":{"lat":-23.601783040147975,"lng":-46.537071217637845}, "_northEast":{"lat":-23.556816959852032,"lng":-46.48800878236214}}" Leaflet fitBounds expects a LatLngBound(corner1, corner2) or an Array like [ [lat,lng], [lat,lng] ]

Here a new class to hold getBound result with a method to be used with fitBounds: using System.Collections.Generic; namespace FisSst.BlazorMaps { public class LatLngBounds { public LatLngBounds() {} public LatLngBounds(LatLng southwest, LatLng northeast) { _southWest = southwest; _northEast = northeast; } public LatLng _southWest { get; set; } public LatLng _northEast { get; set; } // Return a IEnumerable of LatLng, to be used with fitBounds or Rectangle public IEnumerable<LatLng> ToLatLng() { return new List<LatLng>() { _southWest, _northEast }; } } }

On Models CircleMaker, Polygon, Polyline and Rectangle I had to add one constant for "getBounds" private const string GetBoundsJsFunction = "getBounds"; and also a new Task public async Task<LatLngBounds> GetBounds() { // Leaflet getBounds() function returns // {"_southWest":{"lat":-23.601783040147975,"lng":-46.537071217637845}, "_northEast":{"lat":-23.556816959852032,"lng":-46.48800878236214}}" // Class LatLngBounds represents object retuned by getBounds() return await this.JsReference.InvokeAsync<LatLngBounds>(GetBoundsJsFunction); }

On Components Map, I had to add one constant for "fitBounds" private const string fitBounds = "fitBounds"; and also a new Task, note IEnumerable came from LatLngBounds.ToLatLng method if using like myMap.FitBonds(myCircle.getBounds()) public async Task FitBounds(IEnumerable<LatLng> coords) { await this.MapReference.InvokeAsync<IJSObjectReference>(fitBounds, coords); }

Rectangle, just create a Rectangle folder in Models & Factory and duplicate Polyline files with proper name changes from Polyline to Rectangle including constant string "L.polyline" by "L.rectangle" And finally include rectangle at FisSstMapsDependencyInjection services.AddTransient<IRectangleFactory, RectangleFactory>(); // Added to allow use L.rectangle

Hope you undertand all above, and sorry in advance, I´m not too familiar with Github way on post like this

[P33tr]

I need getBounds too. So I can search an external service using the bounds of the currently displayed map. This feature is missing from all implementations that use leaflet and blazor.

[P33tr]

@jczerosb Is there any chance you can share your code. I can help to create the PR into this repo.

[jczerosb]

@P33tr Yes, how can I do it? Send here a zip file with only changed/new files, zip all VS project? Is there another way?

[P33tr]

The easiest way is to past your changed code here. There are some instrcutions on creating a PR here https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/creating-a-pull-request BUt just paste your code and I will sort it out

[jczerosb]

I really give a try, but there was no way to send .cs files. So I make a fork (by accident) and made all changes for getBounds, fitBounds and Rectangle. In Examples, Index page, added a new icon to demonstrate getBounds, fitBounds and Rectangle. Check it at https://github.com/jczerosb/BlazorMaps.git

[P33tr]

@jczerosb Thats an interesting little solution. It does not do what the original leaflet Getbounds does though. The original Getbounds finds the viewport size of the map. So that for instance you can search using the bounds of the displayed map area. But its a start. I think we are both searching for a way to achieve the same thing.

[P33tr]

I have a soluton to this. @jczerosb can you add me as a colaborator on your fork and I will create a PR to your code

[jczerosb]

Perhaps you talking about getBounds over Map, don´t know why but since started using Leaflet almost 2 year ago, never get it working on Map, but on Layer (Circle, Rectangle, Polygon, Polyline, etc). Just in case, I´m moving an Asp.Net Webforms to Blazor where I use Leaflet with Geoman, PopUpModifier and Here Maps Route/IsoLine. All working fine for my needs, except for the necessary ping-pong between Blazor & JS Added you as colaborator Hope someone from Fis-Sst take a look on this...