Antv + Tomcat L7地图 本地资源可视化

此为系列博客

• Tomcat本地服务器搭建+本地项目
• Antv L7地图可视化
• Antv + Tomcat L7地图 本地资源可视化（当前位置）

0. 基础知识

Antv使用demo可以查看博客https://blog.csdn.net/weixin_42763696/article/details/106044149

Tomcat配置可以查看博客https://blog.csdn.net/weixin_42763696/article/details/106036905

在之前的demo中，Antv都是访问的网络资源，如json文件，txt文件等等。但如果想做一个本地的可视化结果呢？经过我的实验，我发现本地资源路径并直接添加到HTML代码中时，并不能正确加载。因此需要本地搭建一个小的服务器来进行数据传输，我也就选择了Tomcat。

1. 下载资源文件

首先根据html源码中的数据下载资源文件，如demo中的json资源链接就是https://gw.alipayobjects.com/os/rmsportal/oVTMqfzuuRFKiDwhPSFL.json。ctrl+s下载保存到本地后，移动到Web的工作目录中。( 这里的Web工作目录我沿用了配置Tomcat的博客中的目录，一定要去看一下哦！)

将之前的demo.html也移动到这个目录，现在的文件结构如下所示。

2. 修改资源路径

因为json文件就在html的相同目录下，因此需要修改demo中的资源路径成下图所示

然后再打开链接http://127.0.0.1:8080/test/demo.html，就会发现资源被正确加载了~

(注：这里的test路径也是沿用了配置Tomcat的博客中的资源路径，如果有困惑的话可以参考一下我的那篇博客，也不难(小声))