# GIS之家的学习交流圈

**Repository Path**: gishome/gis-learning-circle

## Basic Information

- **Project Name**: GIS之家的学习交流圈
- **Description**: GIS之家的学习交流圈，专注gis知识领域， 1️⃣WebGIS开发示例，WebGIS项目案例 2️⃣GIS数据资源分享 3️⃣GIS软件操作教程
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 10
- **Forks**: 2
- **Created**: 2025-04-06
- **Last Updated**: 2025-12-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## GIS之家的学习交流圈
- GIS之家的学习交流圈，专注GIS知识领域。GIS之家，深耕WebGIS领域，目前广州工作，GIS研发工程师，已积累超过十年的GIS行业工作经验，拥有丰富的WebGIS开发项目实战经验。  
- 最新的所有的示例案例源码以及GIS数据资源全部分享在知乎专栏【GIS之家的学习交流圈】，感兴趣的GISer可以加入，一起学习交流：[GIS之家的学习交流圈](https://www.zhihu.com/column/c_1952830516555396850)   

## 一、服务对象  
1️⃣WebGIS初学者/小白  
2️⃣GIS相关方向的学生  
3️⃣想往WebGIS开发方向走，但比较迷茫的小伙伴  
4️⃣觉得专栏内容对自己学习有所帮助的GISer  
5️⃣1-2年WebGIS开发者    

## 二、服务内容  
🔥WebGIS入门开发系列示例源码，包括arcgis api 4、cesium、openlayers、leaflet等地图框架方向  
🔥WebGIS行业项目案例讲源码，包括智慧城市、应急管理、国土规划、电力、地信等行业项目  
🔥WebGIS地图服务发布部署操作教程  
🔥WebGIS数据资源分享（示例以及项目案例的学习数据素材）  

## 三、必备知识 
JavaScript/Vue/React、HTML/CSS、GIS相关知识理论

## 四、内容导航  
## vue+cesium示例案例  
[vue3+Cesium案例：智慧城市多种可视化特效](https://gitee.com/gishome/gis-learning-circle/blob/main/vue+cesium%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E6%99%BA%E6%85%A7%E5%9F%8E%E5%B8%82%E5%A4%9A%E7%A7%8D%E5%8F%AF%E8%A7%86%E5%8C%96%E7%89%B9%E6%95%88.md)   
[vue3+Cesium案例：Cesium卫星态势感知追踪系统](https://zhuanlan.zhihu.com/p/1965153388443449336)  
[vue3+Cesium案例：三维钢铁厂园区开发平台](https://zhuanlan.zhihu.com/p/1952831240081217167)  
[leaflet+Cesium案例：二三维城市更新综合管理信息系统](https://zhuanlan.zhihu.com/p/1956476814907147788)  
[vue3+Cesium示例：建筑物单体化分层](https://gitee.com/gishome/gis-learning-circle/blob/main/vue+cesium%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%BB%BA%E7%AD%91%E7%89%A9%E5%8D%95%E4%BD%93%E5%8C%96%E6%95%B4%E6%A0%8B%E5%88%86%E5%B1%82.md)     
[vue3+Cesium示例：三维建筑物自定义材质](https://gitee.com/gishome/gis-learning-circle/blob/main/vue+cesium%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E4%B8%89%E7%BB%B4%E5%BB%BA%E7%AD%91%E7%89%A9%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9D%90%E8%B4%A8.md)  
[vue3+Cesium示例：克里金空间插值渲染效果](https://gitee.com/gishome/gis-learning-circle/blob/main/vue+cesium%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%85%8B%E9%87%8C%E9%87%91%E6%8F%92%E5%80%BC%E7%A9%BA%E9%97%B4%E6%B8%B2%E6%9F%93%E6%95%88%E6%9E%9C.md)  
[vue3+Cesium示例：实现动态绘制几何体设置颜色拖动效果](https://gitee.com/gishome/gis-learning-circle/tree/main/vue+cesium%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%8A%A8%E6%80%81%E7%BB%98%E5%88%B6%E5%87%A0%E4%BD%95%E4%BD%93)  
[vue3+Cesium示例：可视域分析](https://gitee.com/gishome/gis-learning-circle/blob/main/vue%2Bcesium%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%8F%AF%E8%A7%86%E5%9F%9F%E5%88%86%E6%9E%90.md)  
[vue3+Cesium示例：3Dtiles三维模型高度调整](https://gitee.com/gishome/gis-learning-circle/tree/main/vue+cesium%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/3Dtiles%E4%B8%89%E7%BB%B4%E6%A8%A1%E5%9E%8B%E9%AB%98%E5%BA%A6%E8%B0%83%E6%95%B4)  
[vue3+Cesium示例：地形开挖](https://zhuanlan.zhihu.com/p/1958175208180540161)  
[vue3+Cesium示例：3D热力图](https://zhuanlan.zhihu.com/p/1958173914581690106)  
[vue3+Cesium示例：压平模型](https://zhuanlan.zhihu.com/p/1958173033362622010)  
[vue3+Cesium示例：风场图](https://zhuanlan.zhihu.com/p/1957901452547690544)  
[Cesium示例：结合echarts实现物流迁徙图可视化效果](https://zhuanlan.zhihu.com/p/1962811589645305251)  
[cesium 3dtiles模型单体化点击高亮效果](https://zhuanlan.zhihu.com/p/1967917716607333632)  
[vue3+Cesium示例：三维体渲染](https://zhuanlan.zhihu.com/p/1975890635367130727)  
[vue3+cesium示例：动态时序图](https://zhuanlan.zhihu.com/p/1980754054201246442)  
[vue3+cesium示例：坡度分析](https://zhuanlan.zhihu.com/p/1983509799158183754)  
[vue3+cesium示例：在线雷达云图](https://zhuanlan.zhihu.com/p/1985661259203486624)  

## vue+leaflet示例案例
[vue3+leaflet示例：在线地图切换](https://gitee.com/gishome/gis-learning-circle/tree/main/vue3+leaflet%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%9C%A8%E7%BA%BF%E5%9C%B0%E5%9B%BE%E5%88%87%E6%8D%A2)   
[vue3+leaflet示例：图层管理](https://gitee.com/gishome/gis-learning-circle/tree/main/vue3+leaflet%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%9B%BE%E5%B1%82%E7%AE%A1%E7%90%86)   
[vue3+leaflet示例：地图分屏对比](https://gitee.com/gishome/gis-learning-circle/tree/main/vue3+leaflet%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%9C%B0%E5%9B%BE%E5%88%86%E5%B1%8F%E5%AF%B9%E6%AF%94)  
[vue3+leaflet示例：克里金插值渲染](https://gitee.com/gishome/gis-learning-circle/blob/main/vue3%2Bleaflet%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%85%8B%E9%87%8C%E9%87%91%E6%8F%92%E5%80%BC%E6%B8%B2%E6%9F%93%E6%98%BE%E7%A4%BA.md)   
[vue3+leaflet示例：geojson数据地形剖面分析](https://gitee.com/gishome/gis-learning-circle/tree/main/vue3+leaflet%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/geojson%E6%95%B0%E6%8D%AE%E5%9C%B0%E5%BD%A2%E5%89%96%E9%9D%A2%E5%88%86%E6%9E%90)   
[vue3+leaflet示例：地图卷帘对比](https://gitee.com/gishome/gis-learning-circle/tree/main/vue3+leaflet%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E5%9C%B0%E5%9B%BE%E5%8D%B7%E5%B8%98%E5%AF%B9%E6%AF%94)   
[vue3+leaflet示例：结合Echarts4实现散点图效果](https://gitee.com/gishome/gis-learning-circle/blob/main/vue3+leaflet%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/%E7%BB%93%E5%90%88Echarts4%E5%AE%9E%E7%8E%B0%E6%95%A3%E7%82%B9%E5%9B%BE%E6%95%88%E6%9E%9C.md)   
[vue3+leaflet示例：结合Echarts4实现统计图效](https://zhuanlan.zhihu.com/p/1962619246128398951)   
[vue3+leaflet示例：结合Echarts4实现迁徙图效果](https://zhuanlan.zhihu.com/p/1962618642257667916)   
[vue3+leaflet示例：实现风场图效果](https://zhuanlan.zhihu.com/p/1962617996162897110)   
[vue3+leaflet示例：矢量瓦片展示](https://zhuanlan.zhihu.com/p/1960643650963899152)   
[vue3+leaflet示例：结合geoserver实现地图属性查询](https://zhuanlan.zhihu.com/p/1960642505478484337)   
[vue3+leaflet示例：结合geoserver实现地图空间查询](https://zhuanlan.zhihu.com/p/1960641627744895684)   
[vue3+leaflet示例：图斑历史时空播放](https://zhuanlan.zhihu.com/p/1960640770479465189)   
[vue3+leaflet示例：视频监控播放](https://zhuanlan.zhihu.com/p/1960459069304308298)   
[vue3+leaflet示例：结合turf.js实现图斑分割](https://zhuanlan.zhihu.com/p/1960458461348341326)   
[vue3+leaflet示例：结合geoserver利用WFS服务实现图层新增功能](https://zhuanlan.zhihu.com/p/1960457416660464994)   
[vue3+leaflet示例：结合geoserver利用WFS服务实现图层编辑功能](https://zhuanlan.zhihu.com/p/1960456543205062372)   
[vue3+leaflet示例：结合geoserver利用WFS服务实现图层删除功能](https://zhuanlan.zhihu.com/p/1960455368128828990)   
[vue3+leaflet示例：地图全图以及框选截图导出功能](https://zhuanlan.zhihu.com/p/1959205862510920137)   
[vue3+leaflet示例：聚合图功能](https://zhuanlan.zhihu.com/p/1959204410312853301)   
[vue3+leaflet示例：直接读取geoTIFF像素值](https://zhuanlan.zhihu.com/p/1959203768286556400)   
[vue3+leaflet示例：热力图](https://zhuanlan.zhihu.com/p/1959203098066133885)   
[vue3+leaflet示例：实现简单量算工具功能](https://zhuanlan.zhihu.com/p/1959202511719211840)   
[vue3+leaflet示例：拓展wms以及wmts地图范围裁剪](https://zhuanlan.zhihu.com/p/1958820906701915623)   
[vue3+leaflet示例：快速渲染聚合矢量瓦片](https://zhuanlan.zhihu.com/p/1958820326361265418)   
[vue3+leaflet示例：结合Leaflet-Geoman插件实现绘制以及动态配置样式](https://zhuanlan.zhihu.com/p/1958819607801471166)   
[vue3+leaflet示例：地图截图批量导出](https://zhuanlan.zhihu.com/p/1958818974100861202)   
[leaflet框选范围下载地图离线瓦片:以高德地图为例](https://zhuanlan.zhihu.com/p/1958818121172365697)   
[Leaflet中关于绘制岛洞和多面的应用](https://zhuanlan.zhihu.com/p/1965154146840741197)   
[leaflet结合PostGIS动态渲染矢量瓦片](https://zhuanlan.zhihu.com/p/1965146967765128913)   
[leaflet前端JS实现高德地图POI兴趣点批量分类下载](https://zhuanlan.zhihu.com/p/1965144076757206642)   
[vue3+leaflet案例:南京市充电站可视化平台](https://zhuanlan.zhihu.com/p/1957899785374774361)   
[vue3+leaflet案例:告警系统GIS一张图](https://zhuanlan.zhihu.com/p/1957798066078875724)   

## vue+openlayers示例案例  
[vue+openlayers矢量瓦片示例：GeoJSON数据源模式渲染](https://zhuanlan.zhihu.com/p/1958487683774013757)  
[vue+openlayers矢量瓦片示例：线水流效果](https://zhuanlan.zhihu.com/p/1958478782173280246)  
[vue+openlayers矢量瓦片示例：全图以及框选导出地图功能](https://zhuanlan.zhihu.com/p/1958481314727592381)  
[vue+openlayers矢量瓦片示例：地图克里金插值渲染](https://zhuanlan.zhihu.com/p/1958480563246731964)  
[vue+openlayers矢量瓦片示例：适配arcgis矢量瓦片服务以及样式](https://zhuanlan.zhihu.com/p/1957895184709837780)  

## vue+arcgisAPI示例案例  
[vue3+arcgisAPI4示例:底图切换显示](https://gitee.com/gishome/gis-learning-circle/tree/main/vue3%2BarcgisAPI4%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/vue3%2BarcgisAPI4%E7%A4%BA%E4%BE%8B%E5%BA%95%E5%9B%BE%E5%88%87%E6%8D%A2%E6%98%BE%E7%A4%BA)  
[vue3+arcgisAPI4示例:自定义多个气泡窗口展示](https://gitee.com/gishome/gis-learning-circle/tree/main/vue3+arcgisAPI4%E7%A4%BA%E4%BE%8B%E6%A1%88%E4%BE%8B%E9%9B%86%E5%90%88/vue3+arcgisAPI4%E7%A4%BA%E4%BE%8B%E8%87%AA%E5%AE%9A%E4%B9%89%E5%A4%9A%E4%B8%AA%E6%B0%94%E6%B3%A1%E7%AA%97%E5%8F%A3%E5%B1%95%E7%A4%BA)  
[vue3+arcgisAPI4示例:台风轨迹显示](https://zhuanlan.zhihu.com/p/1958488555895656495)  
[vue3+arcgisAPI4示例:船舶可视化](https://zhuanlan.zhihu.com/p/1958177758900388551)  
[vue3+arcgisAPI4示例:轨迹点模拟移动](https://zhuanlan.zhihu.com/p/1957896239283703855)  
[vue3+arcgisAPI4示例:绘图工具动态修改样式导出GeoJSON](https://zhuanlan.zhihu.com/p/1957892550296838879)  
[vue3+arcgisAPI4示例:风场粒子可视化效果](https://zhuanlan.zhihu.com/p/1965373289066127921)  
[vue3+arcgisAPI4示例:智慧林业资源监测分析平台](https://zhuanlan.zhihu.com/p/1957902276300603505)  
[arcgis api 4.x for js地图加载arcgisserver本地离线瓦片](https://zhuanlan.zhihu.com/p/1967915309185868912)  
[arcgis api 4.x for js地图加载第三方矢量切片](https://zhuanlan.zhihu.com/p/1967916813967931035)  
[arcgis api 4.x for js扩展MapImageLayer支持图片图层加载](https://zhuanlan.zhihu.com/p/1967919540051613655)  
[vue3+arcgisAPI4示例:实现瓦片地图范围裁剪效果](https://zhuanlan.zhihu.com/p/1970085470844195451)  
[vue3+arcgisAPI4示例:实现叠加图片视频效果](https://zhuanlan.zhihu.com/p/1971170360935297395)  
[vue3+arcgisAPI4示例:实现叠加风场图以及风场粒子效果](https://zhuanlan.zhihu.com/p/1972675037204063089)  
[vue3+arcgisAPI4示例:在线永久基本农田点查询](https://zhuanlan.zhihu.com/p/1982468393606067711)  

## 地图服务发布操作教程 
[开源影像tif切图工具gdal2tiles部署以及切图](https://gitee.com/gishome/gis-learning-circle/blob/main/%E5%9C%B0%E5%9B%BE%E6%9C%8D%E5%8A%A1%E5%8F%91%E5%B8%83%E6%93%8D%E4%BD%9C%E6%95%99%E7%A8%8B/%E5%BC%80%E6%BA%90%E5%BD%B1%E5%83%8Ftif%E5%88%87%E5%9B%BE%E5%B7%A5%E5%85%B7gdal2tiles%E9%83%A8%E7%BD%B2%E4%BB%A5%E5%8F%8A%E5%88%87%E5%9B%BE.md)  

## 地图数据资源
[GIS之家数据资源：广东省村界SHP数据](https://zhuanlan.zhihu.com/p/1957907260727628288)   
[GIS之家数据资源：全国水系以及路网](https://gitee.com/gishome/gis-learning-circle/blob/main/GIS%E6%95%B0%E6%8D%AE%E8%B5%84%E6%BA%90/%E5%85%A8%E5%9B%BD%E8%B7%AF%E7%BD%91%E4%BB%A5%E5%8F%8A%E6%B0%B4%E7%B3%BB.md)   
[GIS之家数据资源：全国DEM地形](https://gitee.com/gishome/gis-learning-circle/blob/main/GIS%E6%95%B0%E6%8D%AE%E8%B5%84%E6%BA%90/DEM%E5%9C%B0%E5%BD%A2.md)   
[GIS之家数据资源：全国行政区划](https://gitee.com/gishome/gis-learning-circle/blob/main/GIS%E6%95%B0%E6%8D%AE%E8%B5%84%E6%BA%90/%E5%85%A8%E5%9B%BD%E8%A1%8C%E6%94%BF%E5%8C%BA%E5%88%92.md)   
[GIS之家数据资源：全国建筑轮廓](https://gitee.com/gishome/gis-learning-circle/blob/main/GIS%E6%95%B0%E6%8D%AE%E8%B5%84%E6%BA%90/%E5%85%A8%E5%9B%BD%E5%BB%BA%E7%AD%91%E8%BD%AE%E5%BB%93.md)   
[GIS之家数据资源：全国建筑轮廓（带层数）](https://gitee.com/gishome/gis-learning-circle/blob/main/GIS%E6%95%B0%E6%8D%AE%E8%B5%84%E6%BA%90/%E5%85%A8%E5%9B%BD%E5%BB%BA%E7%AD%91%E8%BD%AE%E5%BB%93%EF%BC%88%E5%B8%A6%E5%B1%82%E6%95%B0%EF%BC%89.md)