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