Spring Boot+Leaflet：省级旅游口号 WebGIS 可视化项目目录结构设计

基于Spring Boot和Leaflet的省级旅游口号WebGIS可视化项目，目录结构设计如下：

后端目录（Spring Boot）

src/main/java/
└── com.example.tourism/
    ├── TourismApplication.java       # Spring Boot主启动类
    ├── config/
    │   ├── WebMvcConfig.java          # MVC配置（跨域等）
    │   └── LeafletConfig.java         # 地图服务配置
    ├── controller/
    │   ├── MapController.java         # 地图数据接口
    │   └── SloganController.java      # 旅游口号接口
    ├── service/
    │   ├── impl/
    │   │   ├── GeoJsonServiceImpl.java # GeoJSON数据处理
    │   │   └── SloganServiceImpl.java  
    │   ├── GeoJsonService.java        # 地理数据服务接口
    │   └── SloganService.java         # 口号业务接口
    ├── repository/
    │   └── SloganRepository.java      # 数据访问层（JPA）
    ├── entity/
    │   ├── Province.java              # 省份实体
    │   └── Slogan.java                 # 旅游口号实体
    ├── dto/
    │   └── GeoDataDTO.java            # GeoJSON数据传输对象
    └── util/
        └── GeoJsonParser.java         # 地理数据解析工具

前端资源目录（Leaflet）

src/main/resources/
├── static/                           # 静态资源根目录
│   ├── index.html                    # 主入口HTML
│   ├── css/
│   │   ├── leaflet.css               # Leaflet基础样式
│   │   └── custom.css                # 自定义样式
│   ├── js/
│   │   ├── lib/
│   │   │   ├── leaflet.js            # Leaflet核心库
│   │   │   └── leaflet-ajax.min.js   # 异步加载插件
│   │   └── app/
│   │       ├── map-init.js           # 地图初始化
│   │       ├── layer-control.js      # 图层控制器
│   │       └── slogan-render.js      # 口号渲染逻辑
│   └── data/                         # 地理数据
│       ├── provinces.geojson          # 省级GeoJSON数据
│       └── cities.geojson            # 市级数据（可选）

配置文件

src/main/resources/
├── application.yml                   # 主配置文件
├── data-h2.sql                       # 初始数据脚本（H2）
└── templates/                        # 服务端模板（可选）

关键设计说明

1. 前后端分离

   • 前端：纯静态资源（HTML+JS+CSS）
   • 后端：RESTful API提供GeoJSON数据和口号文本

2. 核心接口设计

   // MapController.java
   @GetMapping("/api/geo/provinces")
   public GeoDataDTO getProvinceGeoJson() {
       return geoJsonService.loadProvinceData();
   }
   

3. 地理数据流

   graph LR
   A[GeoJSON文件] --> B[static/data]
   B --> C[Leaflet-ajax.js]
   C --> D[地图渲染]
   

4. 扩展性考虑

   • 预留cities.geojson目录支持多级缩放
   • DTO层实现数据脱敏和格式转换
   • 服务层支持未来接入数据库或API数据源

技术提示：GeoJSON文件建议使用省级行政区划边界数据，属性字段需包含口号文本字段（如slogan），Leaflet可通过L.geoJSON的onEachFeature绑定弹出框：

L.geoJSON(data, {
  onEachFeature: (feature, layer) => {
    layer.bindPopup(`<b>${feature.properties.name}</b><br>${feature.properties.slogan}`)
  }
})