数据地图开发

实验简介

本实验中，您将学会使用阿里云DataV Board数据看板产品进行数据地图开发创作，学习将带地理属性的科研数据转化为专业地图，更好地为日常科研/实践项目的成果进行展示和传播。

实验室资源方式简介

进入实操前，请确保阿里云账号满足以下条件：

• 个人账号资源

  • 使用您个人的云资源进行操作，资源归属于个人。

  • 所有实验操作将保留至您的账号，请谨慎操作。

  • 平台仅提供手册参考，不会对资源做任何操作。

• 已通过实名认证且账户余额≥0元

• 实验资源说明：本次实验使用DataV AI数据分析练手包（￥15.90/首月）

• 如果您调整了资源规格、使用时长，或执行了本方案以外的操作，可能导致费用发生变化，请以控制台显示的实际价格和最终账单为准。

• 实操结束后，如通过资源包购买的产品，无需进行注销。

• 请使用新版Chrome或者Edge浏览器进行实验操作；

开通实验所需资源包

点击购买DataV AI数据分析练手包，该资源包是面向多维数据的专业分析工具包，助用户快速构建自己的数据看板、地理分析地图，挖多维数据的价值。确认无误后点击【立即购买】

实验步骤

根据一份综合研究资料《宁波市森林生态系统外来入侵物种普查》，本实验将提取其中入侵物种等相关数据，制作成可以交互的数据地图进行展示和分享。

1. 实验准备：登录并新建项目

   • 登录工作台

     说明

     登录前请确保已经购买产品，如未购买，请参考产品购买环节教程

     点击进入DataV Board数据看板产品

   • 新建空白项目

     • 进入工作台后的界面

       

     • 点击上方“创建PC端看板”按钮

       

     • 在创建看板选项中，选择第一个“创建看板”（创建空白项目，而非旁边那些模板）

       

     • 在弹窗中填入项目名称

       

     • 新项目创建完毕

       

2. 实验（一）：入侵物种面积的区县对比地图

   • 1.1 数据来源

     • 宁波市行政边界数据：用于制作宁波市各区行政地图；后续使用时，复制下方文本，贴入对应地图组件的数据接口：

       https://geo.datav.aliyun.com/areas_v3/bound/330200_full.json

     • 宁波入侵物种各区县面积统计：

       点击下载备用：宁波入侵物种各区县面积.csv

       说明

       数据说明：提取自研究报告《宁波市森林生态系统外来入侵物种普查》附录

     • 数据概览

       

   • 1.2 添加组件

     • 在左侧工具栏，依次点击“组件库”—“地图”—“基础平面地图4.0”，添加地图组件

       

     • 添加组件后，选择左侧工具栏“图层”按钮，选择“基础平面地图”组件，在子组件管理面板点击“+”添加子组件按钮：在展开的子组件中下拉找到“区域热力层”子组件

       

       说明

       注意：点击地图组件左侧小按钮，展开子组件

       

     • 删除不需要图层：

       选中“中国国家边界”子组件，点击右键，在右键菜单选择“删除”选项：

       

   • 1.3 接入数据

     • （1.3.1）接入边界数据

       • 选择“区域热力层”子组件，然后点击右侧面板第二个选项“数据源”

         

       • 进入数据源面板后，点击第二个选项“地理边界geojson数据接口”：

         把以下边界数据贴入URL选项：

         https://geo.datav.aliyun.com/areas_v3/bound/330200_full.json

         

     • （1.3.2）接入入侵物种面积数据

       • 接入边界数据之后，点击左侧的“数据接口”选项

         

       • 点击“数据类型”下拉菜单，并选择“CSV文件”类型

         

       • 点击“新建”按钮

         

       • 将1.1节中下载的“宁波入侵物种各区县面积”csv文件上传

         

       • 输入csv数据源命名，例如“宁波入侵物种各区面积”，并点击确定

         

       • 点击“选择已有数据源”下拉菜单，选择刚刚上传的csv文件数据源“宁波入侵物种各区面积”

         

       • 点击面板右侧的“数据源配置”按钮

         

       • 按图所示，逐项选择下拉菜单内容

         

       • 点击地图组件右上角圆形按钮“进入设置”

         

       • 滚动鼠标滚轮、拖动地图，将地图视角设为宁波市视角，并点击下方“保存并退出”按钮

         

       • 入侵物种各区县数据已经接入热力地图

         

   • 1.4 设置样式

     • 在选择“区域热力层”子组件状态下，点击右侧面板第一个选项“样式”，再点击下方“标签”选项，按图片所示，把行字段设置为“发生区域”，字体设置为15号

       

     • 点击行2，按入如下设置

       删除行3

       

     • 样式设置完成后，宁波入侵物种各区面积情况以热力地图显示出来

       

3. 实验（二）：入侵物种标本采集位置标注

   • 2.1 数据来源

     • 点击下载数据备用：入侵物种标本采集位置-慈溪.csv

       说明

       数据说明：提取自研究报告《宁波市森林生态系统外来入侵物种普查》附录

     • 数据概览：

       

   • 2.2 添加组件

     选择左侧工具栏“图层”按钮，选择“基础平面地图”组件，在子组件管理面板点击“+”添加子组件按钮：在展开的子组件中下滚找到“图标散点层”子组件

     

   • 2.3 接入数据

     • 选择刚刚添加的“图标散点层”子组件，点击右侧面板第二项“数据源”；再选择csv数据类型，并点击新建按钮，新建一个csv数据源：

       

     • 将2.1节中提供的“入侵标本采集位置”csv数据上传

       

     • 命名csv数据源，并点击确定

       

     • 再“选择已有数据源”下拉菜单中，选择刚刚创建的入侵物种标本数据源

       

     • 点击右侧“数据配置”按钮

       

     • 按以下样例进行设置：

       

     • 设置数据完成后，打开编辑器画布左上角“交互模式”，可以点击图标进行交互效果查看

       

4. 实验（三）：照片、图表与标题等组件使用

   通过实验一和实验二，我们已经把入侵物种面积、入侵物种标本采集点成功放到了地图上，接下来将学习添加图片、文字、图表等必要技能。

   • 3.1 添加数据地图标题

     • （3.1.1） 添加组件

       • 点击左侧工具栏“组件库”按钮（可以把地图组件收起）

         

       • 点击左侧面板“组件库”—“信息”分类—“通用标题”组件，添加到画布

         

       • 点击左侧工具栏“图层”—“通用标题”图层：（初始化的标题文字较小）

         

     • （3.1.2） 输入标题内容

       在通用标题组件左侧面板样式设置中，输入标题内容“宁波入侵物种分布地图”，并选择标题样式和字号

       

     • （3.1.3） 修改标题样式

       • 关闭画布左上角“交互模式”，将标题移动到左上角，并将标题框横向拉长

         

       • 设置完样式内入后，标题效果如下

         

   • 3.2 入侵物种轮播图片

     为了更形象展示入侵物种的危害，提升大众的警觉性，可以将入侵物种的照片放到数据地图上。

     • （3.2.1）数据来源

       • 点击下载压缩包到电脑本地，解压缩后备用：入侵物种照片.zip

         说明

         数据说明：样例数据，不保证数据的准确性；

       • 数据预览：

         

     • （3.2.2）添加组件

       选择左侧工具栏—“组件库”—“媒体”类别，点击“轮播图”组件，添加到画布

       

     • （3.2.3）接入图片

       • 在浏览器上方tab区，新建一个空白tab

         

       • 新建浏览器tab：（不同的浏览器可能不一样）

         

       • 复制以下网页地址，粘贴到新建浏览器页面tab中

         https://datav.aliyun.com/

         

       • 打开新建工作台后，点击左下方“设计资源”按钮，再点击“创建设计资源”按钮，在下拉菜单选择“上传图片”

         

       • 把刚刚下载的压缩包解压后，选择一张图片上传

         

       • 上传后，点击确认按钮

         

       • 上传完毕后，将鼠标移动到上传图片预览图上，可以看到右上角有“复制链接”图标，点击复制，后续图片组件需要这个图片的网络资源地址

         

       • 点击浏览器tab，返回之前的地图编辑页面：

         

       • 左侧工具栏选择“图层”—“轮播图”—右侧面板“数据源”，再点击“切换为可视化编辑”按钮

         

       • 可以看到有2列表格，第一列是图片描述，可以填写入侵植物名称，第二列是url，把刚刚上传好复制的图片url链接贴入

         

         按上述方法操作，上传2～3张样例图片

     • （3.2.4）调整图片说明

       • 点击轮播图组件右侧面板的“样式”选项，并修改字号和字体颜色，轮播图上就添加了该图片的标题文字

         

   • 3.3 添加数据图表

     • （3.3.1）数据源

       继续使用3.1实验使用的“宁波入侵物种各区县面积统计”csv数据，不用重复上传；

     • （3.3.2）添加组件

       点击左侧工具栏—组件库—图表分类—柱状图，添加到画布：

       

     • （3.3.3）接入数据

       • 点击图层—柱状图图层，点击柱状图右侧面板的数据选项，选择CSV数据源，并选择之前使用的“入侵物种分布面积”数据源

         

       • 点击打开“数据配置”选项

         

       • 按以下所示进行数据配置

         

     • （3.3.4）调整样式

       • 接入数据之后，点击右侧工具栏的“样式”选项，并点击“全量”按钮，再修改柱状图颜色等样式配置

         

       • 以下是设置完的柱状图效果

         

   • 3.4 添加卫星地图

     • 为了更好展示地理属性，可以将地图换成卫星影像

       

     • 依次选择左侧工具栏—图层—基础平面地图，点击添加子组件按钮，选择“栅格瓦片层”子组件

       

     • 点击“栅格瓦片层”子组件，拖动到区域热力层下方（避免遮盖2个图层）

       

     • 完成所有设置后到效果

       

5. 实验（四）：数据地图发布与分享

   • 为了分享数据地图，需要对地图进行发布：

     在画布空白处任意点击，右侧面板变为全局配置，缩放方式选择为“全屏铺满”

     

   • 点击右上角“发布”按钮

     

   • 在弹出的对话框，点击发布大屏按钮

     

   • 关闭快照管理提示框

     

   • 在发布选项中，可以找到发布分享地址、二维码等；如有必要，可以设置密码保障内容安全

     

   • 最终实验效果预览

     

6. 扩展学习

   通过前序学习，我们已经学会了看板创建、组件添加、样式修改和数据源接入，并通过AI助手创建一个完整的看板，如果需要探索更加复杂的看板功能，可以学习更多DataV Board数据看板更多教程：《DataV数据可视化应用搭建入门》

   • DataV产品功能布局

   • 模板快速搭建大屏

   • 移动端可视化应用搭建

   • 图表样式美化

   • 数据接入与处理

   • 平面地图组件使用

   

7. 实验资源释放

   实验结束，DataV产品是包年/包月预付费形式，无需退订/释放资源；

实验资源释放

实验结束，DataV产品是包年/包月预付费形式，无需退订/释放资源；

关闭实验

• 在完成实验后，点击 结束实操

  

• 点击 取消 回到实验页面，点击 确定 关闭实验

  说明

  账号无需注销，DataV产品是包年/包月预付费形式，无需退订/释放资源，可直接关闭实验