DPBlazorMapLibrary 1.1.0

There is a newer version of this package available.
See the version list below for details.

dotnet add package DPBlazorMapLibrary --version 1.1.0

NuGet\Install-Package DPBlazorMapLibrary -Version 1.1.0

This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.

<PackageReference Include="DPBlazorMapLibrary" Version="1.1.0" />

For projects that support PackageReference, copy this XML node into the project file to reference the package.

<PackageVersion Include="DPBlazorMapLibrary" Version="1.1.0" />
                    

                            Directory.Packages.props

<PackageReference Include="DPBlazorMapLibrary" />
                    

                            Project file

For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package.

paket add DPBlazorMapLibrary --version 1.1.0

The NuGet Team does not provide support for this client. Please contact its maintainers for support.

#r "nuget: DPBlazorMapLibrary, 1.1.0"

#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.

#:package DPBlazorMapLibrary@1.1.0

#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package.

#addin nuget:?package=DPBlazorMapLibrary&version=1.1.0
                    

                            Install as a Cake Addin

#tool nuget:?package=DPBlazorMapLibrary&version=1.1.0
                    

                            Install as a Cake Tool

The NuGet Team does not provide support for this client. Please contact its maintainers for support.

DPBlazorMap.

DP Blazor Map is a library for Blazor, which is a wrapper on top of the Leaflet js library.

The project is being created and developed in order to become the basis for creating a geoportal on Blazer.

Start

Add NuGet package to your project.
Add latest Leflet required Leaflet download.

	<head>
	  <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"
		   integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
		   crossorigin="" />
	</head>
	<body>
	    <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
		    integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
		    crossorigin=""></script>
	</body>

Add @using DPBlazorMapLibrary; to your _Import.cshtml file. Or in the places used separately.
Add builder.Services.AddMapService(); in your Program.cs file.

Usage

Add component.

<DPBlazorMapLibrary.Map @ref="_map" MapOptions="@_mapOptions" CssClass="mapClass" AfterRender="@AfterMapRender"></DPBlazorMapLibrary.Map>

<style>
    .mapClass {
        height: 100vh;
        width: 100vw;
    }
</style>

In the code, [Inject] public LayerFactory LayerFactory { get; init; } 2.1. Optional: [Inject] public IIconFactory IconFactory{ get; init; }
Create an instance of the map settings and links to the map component

private MapOptions _mapOptions;

private Map _map;

Create objects, their properties, etc...

    private async Task AfterMapRender()
    {
        //Create Tile Layer
        var tileLayerOptions = new TileLayerOptions()
            {
                Attribution = "&copy; <a href=\"https://www.openstreetmap.org/copyright\">OpenStreetMap</a> contributors"
            };

        var mainTileLayer = await LayerFactory.CreateTileLayerAndAddToMap("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", _map, tileLayerOptions);


        //Create marker
        var marker = await LayerFactory.CreateMarkerAndAddToMap(new LatLng(0, 0), _map, null);

        //Create dragable marker

        IconOptions iconOptions = new()
        {
            IconUrl = "http://leafletjs.com/examples/custom-icons/leaf-green.png",
            IconSize = new Point(38, 95),
            IconAnchor = new Point(22, 94),
            ShadowUrl = "http://leafletjs.com/examples/custom-icons/leaf-shadow.png",
            ShadowSize = new Point(50, 64),
            ShadowAnchor = new Point(4, 61),
            PopupAnchor = new Point(-3, -76),
        };

        MarkerOptions markerOptions = new()
        {
            Opacity = 0.5,
            Draggable = true,
            IconRef = await this.IconFactory.Create(iconOptions),
        };

        await this.LayerFactory.CreateMarkerAndAddToMap(new LatLng(0.001, -0.001), _map, markerOptions);


        //Create marker with events
        var coordinate = new LatLng(0, 1);
        var markerWithEvents = await LayerFactory.CreateMarkerAndAddToMap(coordinate, _map, null);
        await markerWithEvents.OnClick(async (MouseEvent mouseEvent) =>
        {

        });

        await markerWithEvents.OnDblClick(async (MouseEvent mouseEvent) =>
        {

        });

        await markerWithEvents.OnContextMenu(async (MouseEvent mouseEvent) =>
        {

        });


        //Create polyline
        var polylineOptions = new PolylineOptions();
        var polyline = await LayerFactory.CreatePolylineAndAddToMap(new List<LatLng>() { new LatLng(0.1, 0.12), new LatLng(0.14, 0.12), new LatLng(0.12, 0.13) }, _map, polylineOptions);

        //Create polygon
        var polygonOptions = new PolygonOptions() { Fill = true, Color = "red" };
        var polygon = await LayerFactory.CreatePolygonAndAddToMap(new List<LatLng>() { new LatLng(1.1, 0.12), new LatLng(1.14, 0.12), new LatLng(1.12, 0.13) }, _map, polygonOptions);

        //Create rectangle
        var rectangleOptions = new RectangleOptions() { Fill = true, Color = "black" };
        var rectangle = await LayerFactory.CreateRectangleAndAddToMap(new LatLngBounds(new LatLng(1.1, 0.62), new LatLng(2.14, 1.62)), _map, rectangleOptions);

        //Create circle
        var circleOptions = new CircleOptions() { Radius = 1000 };
        var circle = await LayerFactory.CreateCircleAndAddToMap(new LatLng(0, 0), _map, circleOptions);

        //Create circle marker
        var circleMarkerOptions = new CircleMarkerOptions() { Radius = 10 };
        var circleMarker = await LayerFactory.CreateCircleMarkerAndAddToMap(new LatLng(0, 1), _map, circleMarkerOptions);

        //Create Video overlay
        var videoOverlayOptions = new VideoOverlayOptions();
        videoOverlayOptions.Muted = true;

        var videoOverlay = await LayerFactory.CreateVideoOverlayAndAddToMap("https://www.mapbox.com/bites/00188/patricia_nasa.webm", _map,
            new LatLngBounds(new LatLng(32, -130), new LatLng(13, -100)), videoOverlayOptions);

        //Create image overlay
        var imageBounds = new LatLngBounds(new LatLng(40.712216, -74.22655), new LatLng(40.773941, -74.12544));
        var imageOverlayOptions = new ImageOverlayOptions();
        var imageOverlay = await LayerFactory.CreateImageOverlayAndAddToMap("http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg", _map,
            imageBounds,
            imageOverlayOptions);

        await _map.FlyToBounds(imageBounds);
    }

TODO

TODO: add RemoveFrom(<LayerGroup> group) DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\Layer.cs 62

TODO: add Extension methods: onAdd, onRemove, getEvents, getAttribution, getAttribution DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\Layer.cs 64

TODO: add <Popup options> options? DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\Layer.cs 74

TODO: getPopup() DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\Layer.cs 142

TODO: <Tooltip options> options? DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\Layer.cs 152

TODO: getTooltip() DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\Layer.cs 220

TODO: Add events load, error DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\RasterLayers\ImageOverlays\ImageOverlay.cs 20

TODO: getBounds() DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\RasterLayers\ImageOverlays\ImageOverlay.cs 86

TODO: getElement() DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\RasterLayers\ImageOverlays\ImageOverlay.cs 88

TODO: add event Load DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\RasterLayers\VideoOverlays\VideoOverlay.cs 11

TODO: getElement() DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\RasterLayers\VideoOverlays\VideoOverlay.cs 17

TODO: closestLayerPoint(<Point> p)
DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Layers\VectorLayers\Polylines\Polyline.cs 62

TODO: doubleClickZoom
DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Maps\MapOptions.cs 52

TODO: add CRS DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Maps\MapOptions.cs 63

TODO: add Animation Options DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Maps\MapOptions.cs 82

TODO: add Panning Inertia Options DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Maps\MapOptions.cs 83

TODO: add Keyboard Navigation Options DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Maps\MapOptions.cs 84

TODO: add Mouse wheel options DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Maps\MapOptions.cs 85

TODO: add Touch interaction options DPBlazorMapLibrary DPBlazorMap\DPBlazorMapLibrary\Models\Maps\MapOptions.cs 86

Product	Compatible and additional computed target framework versions.
.NET	net6.0 is compatible. net6.0-android was computed. net6.0-ios was computed. net6.0-maccatalyst was computed. net6.0-macos was computed. net6.0-tvos was computed. net6.0-windows was computed. net7.0 was computed. net7.0-android was computed. net7.0-ios was computed. net7.0-maccatalyst was computed. net7.0-macos was computed. net7.0-tvos was computed. net7.0-windows was computed. net8.0 was computed. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. net9.0 was computed. net9.0-android was computed. net9.0-browser was computed. net9.0-ios was computed. net9.0-maccatalyst was computed. net9.0-macos was computed. net9.0-tvos was computed. net9.0-windows was computed. net10.0 was computed. net10.0-android was computed. net10.0-browser was computed. net10.0-ios was computed. net10.0-maccatalyst was computed. net10.0-macos was computed. net10.0-tvos was computed. net10.0-windows was computed.

Product

.NET

Compatible target framework(s)

Included target framework(s) (in package)

Learn more about Target Frameworks and .NET Standard.

net6.0
- Microsoft.AspNetCore.Components.Web (>= 6.0.0)

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version	Downloads	Last Updated
1.2.0	15,872	12/14/2021
1.1.2-alpha	274	12/14/2021
1.1.1-alpha	269	12/14/2021
1.1.0	391	12/10/2021
1.1.0-alpha	267	12/14/2021
1.0.14-alpha	396	12/10/2021
1.0.13-alpha	389	12/10/2021
1.0.12-alpha	394	12/10/2021
1.0.11-alpha	408	12/10/2021
1.0.10-alpha	406	12/10/2021
1.0.9-alpha	402	12/10/2021
1.0.8-alpha	396	12/10/2021
1.0.7-alpha	427	12/9/2021
1.0.6-alpha	424	12/9/2021
1.0.5-alpha	406	12/9/2021
1.0.4-alpha	399	12/9/2021
1.0.3-alpha	441	12/9/2021
1.0.2	627	12/9/2021
1.0.1	603	12/9/2021
1.0.0	646	12/9/2021