一個(gè) .NET 開源的地圖組件庫-Mapsui
作者：大姚
今天大姚給大家分享一個(gè).NET開源（MIT License）、免費(fèi)、同時(shí)支持多平臺(tái)框架（MAUI、WPF、Avalonia、Uno、Blazor、WinUI、Eto、.NET Android 和 .NET iOS）地圖組件庫：Mapsui。
前言
今天大姚給大家分享一個(gè).NET開源（MIT License）、免費(fèi)、同時(shí)支持多平臺(tái)框架（MAUI、WPF、Avalonia、Uno、Blazor、WinUI、Eto、.NET Android 和 .NET iOS）地圖組件庫：Mapsui。
項(xiàng)目源代碼
圖片
支持的UI框架的NuGet包
圖片
創(chuàng)建Blazor WebAssembly應(yīng)用
創(chuàng)建名為：MapsuiExercise的Blazor WebAssembly應(yīng)用。
圖片
圖片
圖片
安裝Mapsui.Blazor NuGet包
在NuGet包管理器中搜索：Mapsui.Blazor安裝。
圖片
地圖組件完整代碼
@page "/"
@using Mapsui.UI.Blazor
<PageTitle>MapsuiExercise</PageTitle>
<div class="container">
<div class="row">
<div class="col border rounded p-2 canvas-container">
<MapControlComponent @ref="_mapControl" />
</div>
</div>
</div>
<style>
.canvas-container canvas {
width: 100%;
height: 80vh;
}
</style>
@code
{
private MapControl? _mapControl;
protected override void OnAfterRender(bool firstRender)
{
base.OnAfterRender(firstRender);
if (firstRender)
{
if (_mapControl != null)
_mapControl.Map?.Layers.Add(Mapsui.Tiling.OpenStreetMap.CreateTileLayer());
}
}
}運(yùn)行效果展示
圖片
圖片
圖片
項(xiàng)目源碼地址
更多項(xiàng)目實(shí)用功能和特性歡迎前往項(xiàng)目開源地址查看??，別忘了給項(xiàng)目一個(gè)Star支持??。
- GitHub開源地址：https://github.com/Mapsui/Mapsui
- 示例源碼地址：https://github.com/YSGStudyHards/DotNetExercises/tree/master/MapsuiExercise
責(zé)任編輯：武曉燕
來源：
追逐時(shí)光者
