Leaflet开发入门

Leaflet开发入门

    • 开发环境配置
    • Leaflet开发库
    • 开发移动端Hybrid App或移动Web App

开发环境配置

电子地图已经渗透到O2O、生活服务、出行等领域,传统的GIS也孕育着互联网基因。在国内互联网电子地图领域,百度地图和高德地图较为出色,天地图作为国家地理信息公共服务平台,推出了面向互联网的公众版在线地图服务与API。国内在开放源代码这一方面做得远远不够,相比而言国外开源代码较多且丰富,如人气较高的OpenLayers、Leaflet、Mapbox GL等。
简单而言,Leaflet就是一个开源的前端地图交互类库,具有轻量级、支持移动端、丰富的插件资源等特点。2016年9月27日,Leaflet 1.0版本发布,越来越多的开发者加入社区,成为Leaflet的忠实用户,使得Leaflet的生态逐渐壮大。目前,Leaflet强大的开源库插件涉及地图应用的各个方面,包括地图服务、数据提供、数据格式、地理编码、路线搜索、地图控件等类型的插件。Leaflet官网的网址为http://leafletjs.com,GitHub项目的网址为https://github.com/Leaflet

使用Leaflet开发WebGIS应用,先要配置Leaflet开发环境,这也是Leaflet开发的必备步骤。
(1)获取Leaflet开发库。Leaflet是一个免费的开源库,用户可以从Leaflet官网下载,单击其官网首页的“Download”链接进入资源页面下载Leaflet开发库,

在这里插入图片描述

用户也可以从GitHub上的Leaflet项目资源中获取Leaflet开发库。在Leaflet的资源页面中,提供了当前最新版本的Leaflet开发库,Leaflet开发库分别提供了Leaflet开发必备的核心开发库、样式文件、图片资源。
Leaflet开发库如图

在这里插入图片描述

,包括如下内容。

Leaflet开发库

• leaflet.js(leaflet-src.js):核心开发库,集成当前Leaflet的所有核心功能,其中leaflet-src.js为源码,供调试时使用。
• leaflet.css:样式类,包含Leaflet的所有默认样式信息。
• images:图像资源文件。
需要注意的是,使用的是Leaflet V1.3.3版本开发库,其官网会即时发布当前最新版本的Leaflet开发库。
(2)选定一个开发工具。针对PC端的Web应用需求,Leaflet作为一个基于JavaScript的WebGIS客户端开发库,本质就是HTML+JavaScript脚本的Web客户端开发,可以使用DreamWeaver等工具开发网页,还可以直接使用文本编辑器等编写网页。目前,除了DreamWeaver工具,开发Web应用时还有很多集成开发环境(Integrated Development Environment,IDE)供大家选择。.NET体系就是微软的Visual Studio,包括2010、2012、2015、2019等多个版本;Java的开发环境包括Eclipse、JBuilder、NetBeans等,这些都是主流的Web应用开发环境。
由于Leaflet是纯客户端的开发库,用户可以根据自己的喜好选择合适的开发工具。如果涉及后端开发,则建议根据.NET或Java体系类别选择相应的集成开发环境。在此,使用Microsoft Visual Studio 2010(简称VS2010)作为开发工具,部分功能实例涉及的后端开发采用.NET实现。用户可以从微软官网下载Microsoft Visual Studio 2010的安装程序。Leaflet以简单、易用、高效为开发理念,设计轻巧灵活,非常易于理解和上手,这也是它被众多用户喜爱的原因之一。Leaflet作为备受青睐的开源地图开发库,主要有以下几个特性。
(1)友好的移动端应用。Leaflet是轻量级、跨平台的,其压缩库的容量约为30KB,非常适应移动端应用场景,并且PC上的所有效果均能在移动端上无缝呈现,可以轻松在iPad、iPhone和Android等移动端构建地图应用。
(2)丰富的可视化效果。Leaflet可以轻松地实现自定义标注功能,并支持视频流。在标注图片时可以设置图标图片和阴影图片,让标注更有立体感;同时可以设置锚点的位置,让图标定位更加精准;另外,还可以像添加一个地图图层一样添加视频文件并在地图上展示。此外,还有很多诸如时空动画、热力图、聚合点等效果都可以轻松实现,增强可视化效果。
(3)出众的渲染性能。Leaflet采用HTML5实现高性能渲染,基于出色的地图渲染引擎,将会呈现出更加细腻流畅的地图,可以轻松支持大数据量级的点数据渲染,渲染性能非常出众。
(4)支持多种数据格式。Leaflet支持大部分服务标准与数据格式,并且可以自定义扩展,使用户在项目对接上无后顾之忧。GeoJSON是一种空间数据格式,Leaflet对此空间数据格式支持较好,也全面支持OGC服务规范(WMS、WFS等)。
(5)灵活的可扩展性。Leaflet受欢迎的主要因素之一就是其灵活的可扩展性,这让其在社区中拥有众多的扩展插件,满足各种功能需求。Leaflet可与专业GIS服务平台结合,丰富的GIS前端开发框架与专业的GIS服务平台强强联合,无缝对接,已经成为GIS领域应用开发的主力军。

开发移动端Hybrid App或移动Web App

,也是基于HTML5+JavaScript开发,但两种方式略有不同。移动端Hybrid App是原生开发嵌入H5页面,一般要借助移动端原生开发的工具,如Android开发使用主流的Eclipse或Android Studio工具、iOS开发使用苹果的Xcode等。移动Web App是为移动浏览器设计的基于Web的应用,与普通Web开发类似,应用部署在服务器端,移动端直接通过浏览器访问,不需要在设备上下载安装。因此,对于移动Web App方式,用户在进行移动网页开发时可以选择与PC端Web应用开发相同的开发工具。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/90359.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

CSS中如何改变鼠标指针样式(cursor)?

聚沙成塔每天进步一点点 ⭐ 专栏简介⭐ CSS中改变鼠标指针样式(cursor)⭐ 示例:⭐ 写在最后 ⭐ 专栏简介 前端入门之旅:探索Web开发的奇妙世界 记得点击上方或者右侧链接订阅本专栏哦 几何带你启航前端之旅 欢迎来到前端入门之旅…

快速排序三种思路详解!

一、快速排序的介绍 快速排序是Hoare于1962年提出的一种二叉树结构的交换排序方法,其基本思想为:任取待排序元素序列中 的某元素作为基准值,按照该排序码将待排序集合分割成两子序列,左子序列中所有元素均小于基准值,…

CentOS7.9安装Java11

文章目录 Java11版本介绍安装步骤查看并卸载已有版本安装Java11最新版本配置生效 openjdk介绍 Java11版本介绍 Java 11是Java编程语言的一个重要版本,于2018年9月发布Java 11在语言特性、性能优化和安全性方面都有一些显著的改进,为Java开发者提供了更多…

minion在ubuntu上的搭建步骤

在Ubuntu上搭建MinIO可以按照以下步骤进行: 下载MinIO服务器二进制文件: 通过浏览器访问 https://min.io/download 或使用以下命令获取最新的MinIO二进制文件:wget https://dl.min.io/server/minio/release/linux-amd64/minio赋予二进制文件…

无人机精细化巡检方案制定:提高效率与准确性的关键

在当前技术日新月异的时代,无人机在多个领域的应用已成为行业标配。但如何制定出一套有效、细致的无人机巡检方案,确保其最大效能,成为许多组织与公司的核心议题。其中,复亚智能在此领域已展现出了卓越的实力与深入的见解。 1. 精…

最新SQLMap进阶技术

SQLMap进阶:参数讲解 (1)–level 5:探测等级。 参数“–level 5”指需要执行的测试等级,一共有5个等级(1~5级),可不加“level”,默认是1级。可以在xml/payloads.xml中看…

Flask入门一 ——虚拟环境及Flask安装

Flask入门一 ——虚拟环境及Flask安装 在大多数标准中,Flask都算是小型框架,小到可以称为“微框架”,但是并不意味着他比其他框架功能少。Flask自开发伊始就被设计为可扩展的框架。Flask具有一个包含基本服务的强健核心,其他功能…

element-ui table中使用type=‘selection‘ 实现禁用,勾选,默认选中不可修改 三种状态显示问题

element-ui table中使用type‘selection’ 实现禁用,勾选,默认选中不可修改 三种状态显示问题 实现效果 需求 1.status‘CheckOk 时 勾选框默认选中但不可修改勾选状态 2.status‘CheckFail 时 勾选框禁用 3.status‘ 时 勾选框可以勾选 实现思路 采…

Selenium 捕获 console logs (Java)

目录 启用日志记录功能 有时候在进行自动化测试的时候控制台输出会帮忙定位问题,所以捕获控制台输出就显得很重要了~ 以下以selenium 4为例: 我们可以使用driver.manage().logs().get(LogType.BROWSER)代码在Selenium中检索日志,该代码将返回…

Java单元测试 JUnit 5 快速上手

一、背景 什么是 JUnit 5?首先就得聊下 Java 单元测试框架 JUnit,它与另一个框架 TestNG 占据了 Java领域里单元测试框架的主要市场,其中 JUnit 有着较长的发展历史和不断演进的丰富功能,备受大多数 Java 开发者的青睐。 而说到…

LLM-chatgpt训练过程

流程简介 主要包含模型预训练和指令微调两个阶段 模型预训练&#xff1a;搜集海量的文本数据&#xff0c;无监督的训练自回归decoder&#xff1b; O T P ( O t < T ) O_TP(O_{t<T}) OT​P(Ot<T​)&#xff0c;损失函数CE loss指令微调&#xff1a;在输入文本中加入…

Windows命令行调用main函数

通常C/C的入口函数都是main函数&#xff0c;平常一般使用的原型都是 int main() ;但是&#xff0c;实际上&#xff0c;main函数也可以有参数 int main(intargc[ ,char*argv[] [,char*envp[] ] ] ); int wmain(intargc[ ,wchar_t*argv[] [,wchar_t*envp[] ] ] );//适用于这种带…

P1065 [NOIP2006 提高组] 作业调度方案

题目描述 我们现在要利用 m m m 台机器加工 n n n 个工件&#xff0c;每个工件都有 m m m 道工序&#xff0c;每道工序都在不同的指定的机器上完成。每个工件的每道工序都有指定的加工时间。 每个工件的每个工序称为一个操作&#xff0c;我们用记号 j-k 表示一个操作&…

苹果新健康专利:利用 iPhone、Apple Watch 来分析佩戴者的呼吸情况

根据美国商标和专利局&#xff08;USPTO&#xff09;公示的清单&#xff0c;苹果获得了一项健康相关的技术专利&#xff0c;可以利用 iPhone、Apple Watch 来分析佩戴者的呼吸系统。 苹果在专利中概述了一种测量用户呼吸功能的系统&#xff0c;通过 iPhone 上的光学感测单元&am…

万界星空科技/免费MES系统/免费质量检测系统

质量管理也是万界星空科技免费MES中的一个重要组成部分&#xff0c;旨在帮助制造企业实现全面的质量管理。该系统涵盖了供应商来料、生产过程、质量检验、数据分析等各个环节&#xff0c;为企业提供了一站式的质量管理解决方案。 1. 实时质量监控 质量管理能够实时监控生产过程…

小米AI音箱联网升级折腾记录(解决配网失败+升级失败等问题)

小米AI音箱&#xff08;一代&#xff09;联网升级折腾记录 我折腾了半天终于勉强能进入下载升级包这步&#xff0c;算是成功一半吧… 总结就是&#xff0c;网络信号一定要好&#xff0c;需要不停换网找到兼容的网&#xff0c;还需要仔细配置DNS让音响连的上api.mina.mi.com 推荐…

计算机竞赛 基于大数据的社交平台数据爬虫舆情分析可视化系统

文章目录 0 前言1 课题背景2 实现效果**实现功能****可视化统计****web模块界面展示**3 LDA模型 4 情感分析方法**预处理**特征提取特征选择分类器选择实验 5 部分核心代码6 最后 0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; 基于大数据…

手把手教你从0开始部署Kubernetes(K8s 1.28.x)---超详细

目录 一、基础环境配置&#xff08;所有主机均要配置&#xff09; 1、配置IP地址和主机名、hosts解析 2、关闭防火墙、禁用SELinux 3、安装常用软件 4、配置时间同步 5、禁用Swap分区 6、修改linux的内核参数 7、配置ipvs功能 二、容器环境操作 1、定制软件源 2、安…

Config:客户端连接服务器访问远程

springcloud-config: springcloud-config push pom <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0"xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocatio…

Oracle 如何给大表添加带有默认值的字段

一、讲故事 你是否遇到过开发人员添加字段&#xff0c;导致数据库锁表问题&#xff1f; 但是令开发疑惑的事&#xff0c;他们添加字段&#xff0c;有的时候很快&#xff0c;有的时候很慢&#xff1f; 为什么呢&#xff1f; 询问得知&#xff0c;**加的慢时候是带上了default默…
最新文章