@mapgis/webclient-leaflet-plugin
Advanced tools
A cloud GIS network client development platform based on Leaflet.
开发时需要引入 MapGIS Client for JavaScript（Leaflet）开发包；其中包括必备的 CSS 文件和 JS 文件；
开发库分为正式发行版和 Beta 版;
前往司马云官网下载 MapGIS Client for JavaScript 开发库
以 10.6.2.10 为例，其中：
mapgis-client-for-javascript-dist-v10.6.2.10.rar 为开发库
mapgis-client-for-javascript-all-v10.6.2.10.rar 为开发库+示例站点 Webclient-Leaflet-Plugin 所需开发包位于如下文件夹中
webclient-leaflet-plugin 库：mapgis-client-for-javascript-all-v10.6.2.10\dist\cdn\zondyclient\webclient-leaflet-plugin.min.js
Leaflet 库：mapgis-client-for-javascript-all-v10.6.2.10\dist\cdn\leaflet
之后请将 webclient-leaflet-plugin.min.js 文件和 leaflet 文件夹拷贝出来，放入项目的静态资源目录。
通过公网 NPM 的方式进行安装
npm install @mapgis/webclient-leaflet-plugin
请前往内网开发库下载 Webclient-Leaflet-Plugin 相关开发包
leaflet 以 16.1.26 版本为例进行说明
1.在该网页中请先选择要下载的版本
2.之后点击相应的版本号，在右侧点击下载按钮，下载压缩包
开发包位于如下文件夹中
webclient-leaflet-plugin-16.3.32\package\dist\webclient-leaflet-plugin.min.jsleaflet-16.3.1\package\dist请将leaflet-16.3.1\package\dist改名为 leaflet，之后将webclient-leaflet-plugin.min.js
文件和 leaflet 文件夹拷贝出来，放入项目的静态资源目录
请先将 npm 源切换为内网：
npm set registry http://192.168.11.130:4873/
通过内网 NPM 的方式进行安装
npm install @mapgis/webclient-leaflet-plugin
在 index.html 中引入引擎库和插件库
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<!--引擎库-->
<link rel="stylesheet" href="http://{ip}:{port}/{你的路径}/leaflet/leaflet.css">
<script src="http://{ip}:{port}/{你的路径}/leaflet/leaflet.js"></script>
<!--plugin库-->
<script src="http://{ip}:{port}/{你的路径}/zondyclient/webclient-leaflet-plugin.min.js"></script>
</head>
</html>
通过 npm 的方式安装@mapgis/webclient-leaflet-plugin 插件库
npm install @mapgis/webclient-leaflet-plugin
在项目的 css 文件中设置地图视图容器的样式，否则地图视图无法显示
/*设置地图视图的样式，一定要设置否则地图无法显示*/
#你的地图视图的id {
width: 100%;
height: 100%;
position: absolute;
}
初始化地图视图对象
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<!--引擎库-->
<link rel="stylesheet" href="http://{ip}:{port}/{你的路径}/leaflet/leaflet.css">
<script src="http://{ip}:{port}/{你的路径}/leaflet/leaflet.js"></script>
<!--plugin库-->
<script src="http://{ip}:{port}/{你的路径}/zondyclient/webclient-leaflet-plugin.min.js"></script>
<style>
/*设置地图视图的样式，一定要设置否则地图无法显示*/
#你的地图视图的id {
width: 100%;
height: 100%;
position: absolute;
}
</style>
<script>
// 初始化图层管理容器
const map = new zondy.Map()
// 初始化地图视图对象
const mapView = new zondy.leaflet.MapView({
// 视图id
viewId: '你的地图视图的id',
// 图层管理容器
map: map
})
</script>
</head>
<!--地图视图容器div-->
<div id="你的地图视图的id">
</div>
</html>
以 VUE 项目为例，React 和 Angular 类似
在项目的 css 文件中设置地图视图容器的样式，否则地图视图无法显示
/*设置地图视图的样式，一定要设置否则地图无法显示*/
#你的地图视图的id {
width: 100%;
height: 100%;
position: absolute;
}
在你的 vue 组件的 template 中设置地图视图容器的 div 元素
<!--地图视图容器div-->
<div id="你的地图视图的id">
</div>
引入需要的构造函数
import { MapView } from '@mapgis/webclient-leaflet-plugin'
import { Map } from '@mapgis/webclient-common'
在 mounted 生命周期中初始化地图视图
// 初始化图层管理容器
const map = new Map()
// 初始化地图视图对象
const mapView = new MapView({
// 视图id
viewId: '你的地图视图的id',
// 图层管理容器
map: map
})
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
更新说明：
二维Leaflet插件符号体系优化: 增加文字光晕效果 二维虚线样式优化
地图视图Leaflet插件 MapImageLayer 平滑更新
更新说明：
SpatialReference支持自定义坐标系（深汕坐标系）
二维地图增加地图旋转功能
示例数据及二维示例丰富、更新、完善
更新说明：
更新说明：
基础对象接口优化升级，为不同地图引擎提供统一的数据模型支持，便于功能在不同引擎上的快速移植。
增强 MapGIS 高性能 GIS 服务接入能力，全面适配 MapGIS IGServer 2.0 服务接口。
新增支持 EPSG:4326 空间参考系矢量瓦片接入。
基础功能丰富与完善：地图图片图层支持根据视图全图范围取图；新增绘制工具和地图出图工具等。
增强客户端专题图功能，矢量瓦片图层、要素图层、WFS 图层、GeoJson 图层新增支持客户端专题图；地图图片图层新增支持服务端专题图；并统一不同地图引擎专题图接口。
示例完善：新增 MapGIS 瓦片/要素服务、ArcGIS 瓦片/地图服务、GeoJson 图层、矢量瓦片图层、图形图层、长度测量等示例，并优化若干示例。
更新说明：
维护更新，修复若干 Bug
更新说明：
维护更新，修复若干 Bug
更新说明：
维护更新，修复若干 Bug
更新说明：
维护更新，修复若干 Bug
更新说明：
示例说明文档美化
更新说明：
FAQs
A cloud GIS network client development platform based on Leaflet.
The npm package @mapgis/webclient-leaflet-plugin receives a total of 144 weekly downloads. As such, @mapgis/webclient-leaflet-plugin popularity was classified as not popular.
We found that @mapgis/webclient-leaflet-plugin demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 10 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Multiple high-impact npm maintainers confirm they have been targeted in the same social engineering campaign that compromised Axios.
Security News
Axios compromise traced to social engineering, showing how attacks on maintainers can bypass controls and expose the broader software supply chain.
Security News
Node.js has paused its bug bounty program after funding ended, removing payouts for vulnerability reports but keeping its security process unchanged.