SpringBoot+Vue+OpenLayers6完成前后端分离的“疫情地图”实战项目(一、地图数据处理及代码托管)

本文是基于SpringBoot+Vue+OpenLayers的疫情地图实战项目的开端,首先介绍如何处理疫情数据,包括从阿里云获取数据并在ArcGIS中赋值。接着在码云上新建项目covidmap,通过Git克隆到本地,用cnpm安装OpenLayers,并调整项目结构。然后逐步配置Vue路由,创建地图组件,加载Geoserver发布的地图服务,展示GeoJson格式的疫情数据。最后,将代码提交到码云仓库,完成项目初期代码托管。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前面我们介绍了Vue+webpack+openlayer的地图基础知识,从这一章开始,我们将正式开始我们的基于SpringBoot+Vue+OpenLayers的实战项目---疫情地图!

一、疫情地图数据处理

这里我介绍一下数据来源,我们首先从这里:http://datav.aliyun.com/tools/atlas/#&lat=34.994003757575776&lng=96.85546875&zoom=4

下载到全国各省(这里疫情数据我只统计到了省级)的行政区划图,然后在ArcGIS中根据当前国内疫情感染人数给矢量数据赋值如下图:

这里SHP数据的最后一个字段countNum就是截至到3.26日中国境内各省的疫情感染人数。

二、新建项目covidmap并托管到码云

1、码云新建项目,这里我建立了一个开源项目covidmap

 2、电脑本地新建一个文件夹用来克隆码云上我们刚刚新建的项目,

这里直接在文件夹右击使用Git bash命令

在命令行使用命令  git  clone  ********  后面是具体的码云上项目的地址

上面的截图说明代码已经克隆到本地了。

3、创建项目:

4、运行测试创建的项目:

评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值