前言

今天大姚给大家分享一个.NET开源(MIT License)、免费、同时支持多平台框架(MAUI、WPF、Avalonia、Uno、Blazor、WinUI、Eto、.NET Android 和 .NET iOS)地图组件库:Mapsui。

项目源代码

支持的UI框架的NuGet包

创建Blazor WebAssembly应用

创建名为:MapsuiExercise的Blazor WebAssembly应用。

安装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());
        }
    }
}

运行效果展示

项目源码地址

更多项目实用功能和特性欢迎前往项目开源地址查看,别忘了给项目一个Star支持。

优秀项目和框架精选

该项目已收录到C#/.NET/.NET Core优秀项目和框架精选中,关注优秀项目和框架精选能让你及时了解C#、.NET和.NET Core领域的最新动态和最佳实践,提高开发工作效率和质量。坑已挖,欢迎大家踊跃提交PR推荐或自荐(让优秀的项目和框架不被埋没)。

DotNetGuide技术社区交流群

  • DotNetGuide技术社区是一个面向.NET开发者的开源技术社区,旨在为开发者们提供全面的C#/.NET/.NET Core相关学习资料、技术分享和咨询、项目框架推荐、求职和招聘资讯、以及解决问题的平台。
  • 在DotNetGuide技术社区中,开发者们可以分享自己的技术文章、项目经验、学习心得、遇到的疑难技术问题以及解决方案,并且还有机会结识志同道合的开发者。
  • 我们致力于构建一个积极向上、和谐友善的.NET技术交流平台。无论您是初学者还是有丰富经验的开发者,我们都希望能为您提供更多的价值和成长机会。

欢迎加入DotNetGuide技术社区微信交流群‍‍

一个 .NET 开源的地图组件库 - Mapsui的更多相关文章

  1. Vite+TS带你搭建一个属于自己的Vue3组件库

    theme: nico 前言 随着前端技术的发展,业界涌现出了许多的UI组件库.例如我们熟知的ElementUI,Vant,AntDesign等等.但是作为一个前端开发者,你知道一个UI组件库是如何被 ...

  2. .NET 开源免费图表组件库,Winform,WPF 通用

    大家好, 我是等天黑, 今天给大家介绍一个功能完善, 性能强悍的图表组件库 ScottPlot, 当我第一次在 github 上看到这个库, 我看不懂,但我大受震撼, 这么好的项目当然要分享出来了. ...

  3. 创建一个自己的Vue UI组件库,并将它发布在npm上

    本文仅限于入门级,没有成规模制作,希望能对你有所帮助. 因为在开发多个项目中可能会用到同一个组件,那么我们通过复制粘贴的形式更新,无异于是笨拙的,我们可以通过上传到npm后,不断迭代npm包来实现更新 ...

  4. 一个实用的 vite + vue3 组件库脚手架工具,提升开发效率

    无论是 vue2 全家桶还是 vue3 + vite + TypeScript,组件库的使用几乎大家都会,但自己开发一个独立组件库就不是每个人都掌握的,因为搭建组件库的基础开发环境,就会让很多同学望而 ...

  5. PyQt-Fluent-Widgets:一个 Fluent Design 风格的组件库

    简介 这是一个使用 PyQt/PySide 编写的 Fluent Design 风格的组件库,包含最常用的组件,支持亮暗主题无缝切换.实际上此项目是从 Groove Music 项目剥离出来的子项目, ...

  6. beeshell —— 开源的 React Native 组件库

    介绍 beeshell 是一个 React Native 应用的基础组件库,基于 0.53.3 版本,提供一整套开箱即用的高质量组件,包含 JavaScript(以下简称 JS)组件和复合组件(包含 ...

  7. 滴滴开源 Vue 组件库— cube-ui

    cube-ui 是滴滴去年底开源的一款基于 Vue.js 2.0 的移动端组件库,主要核心目标是做到体验极致.灵活性强.易扩展以及提供良好的周边生态-后编译. 自 17 年 11 月开源至今已有 5 ...

  8. 使用webpack4搭建一个基于Vue的组件库

    组内负责的几个项目都有一些一样的公共组件,所以就着手搭建了个公共组件开发脚手架,第一次开发 library,所以是参考着 iview 的配置来搭建的.记录如何使用webpack4搭建一个library ...

  9. Antd组件库,利用Menu组件模拟一个简单Tree组件

    当前工作中,前端的主要技术栈用是vue. 那React怎么办呢?总不至于把他扔在墙角吧! 只能在一些很小的项目上,也只有自己一个前端的时候,悄悄的上React. 当然,React项目UI组件还是最喜欢 ...

  10. Vue2.0+组件库总结

    转自:https://blog.csdn.net/lishanleilixin/article/details/84025459 UI组件 element - 饿了么出品的Vue2的web UI工具套 ...

随机推荐

  1. 今天我们来聊一聊Java中的Semaphore

    写在开头 在上几天写<基于AQS手写一个同步器>时,很多同学留言说里面提到的Semaphore,讲得太笼统了,今天趁着周末有空,咱们就一起详细的学习和梳理一把 Semaphore. 什么是 ...

  2. mysql 重新整理——性能下降的原因[四]

    前言 什么是性能下降? 其实就是代码运行的环境变了,那么环境变化是什么? 比如cpu上升了,内存满了.有或者表中数量增加了,量变了. 其实这些是dba干的,但是呢,我们也需要去了解下,并且优化我们的c ...

  3. Python - PEP572: 海象运算符

    海象运算符 PEP572 的标题是「Assignment Expressions」,也就是「赋值表达式」,也叫做「命名表达式」 不过它现在被广泛的别名是「海象运算符」(The Walrus Opera ...

  4. (节流)js防止重复频繁点击或者点击过快方法

    1.方法一:用定时器定时,没跑完定时器,点击按钮无效 <script> var isClick = true; $("button").on("click&q ...

  5. SVM简单分类的使用 sklearn机器学习

    # sklearn 库中导入 svm 模块 from sklearn import svm # 定义三个点和标签 X = [[2, 0], [1, 1], [2,3]] y = [0, 0, 1] # ...

  6. 【笔记】Oracle 窗口函数

    Oracle 窗口函数 简单来说,窗口函数是分析函数的一种,通常可以理解成over()函数 构成:函数名①() over(partition by 分组的列名 order by 排序的列名 XXX) ...

  7. 第九課-Channel Study For Caller Client Api

    1.浏览Mirth Connect开放Client API 2.启动Vs2019,编程测试Client Api的调用 开启你在宇宙第一IDE下熟悉的.net之旅吧!

  8. 不改一行代码,轻松拥有企业级微服务治理|MSE微服务治理专业版重磅发布

    ​简介:随着业务的发展,微服务拆分越来越复杂,微服务的治理也成了一个比较令人头疼的问题.有没有更加简单且高效的方法来解决微服务治理的难题? 作者:十眠 随着业务的发展,微服务拆分越来越复杂,微服务的治 ...

  9. 基于英特尔® 优化分析包(OAP)的 Spark 性能优化方案

    ​简介: Spark SQL 作为 Spark 用来处理结构化数据的一个基本模块,已经成为多数企业构建大数据应用的重要选择.但是,在大规模连接(Join).聚合(Aggregate)等工作负载下,Sp ...

  10. [Go] 结构体 嵌套 结构体指针 的含义

    举个例子:以下 FutureKline 这个结构体 包含了 Kline 结构体的指针,为什么不直接是 Kline 结构体. type Kline struct { Pair CurrencyPair ...