柳州企业网站开发平台,缔客网络上海响应式网站建设,网站关键词排名批量查询,wordpress xiu底部广告目录
1. 项目结构
2. Maven依赖配置 (pom.xml)
3. 实现后端服务 4. 配置文件 (application.properties)
5. 启动项目
6. 访问页面 实现基于北斗卫星的车辆定位和轨迹图的Maven工程#xff08;使用模拟数据#xff09;#xff0c;我们将使用以下技术#xff1a;
Spri…目录
1. 项目结构
2. Maven依赖配置 (pom.xml)
3. 实现后端服务 4. 配置文件 (application.properties)
5. 启动项目
6. 访问页面 实现基于北斗卫星的车辆定位和轨迹图的Maven工程使用模拟数据我们将使用以下技术
Spring Boot作为后端框架用来提供数据接口。Thymeleaf作为前端模板引擎呈现网页。Leaflet.js一个开源的JavaScript库用于显示交互式地图。Simulated Data使用随机生成的模拟GPS数据来模拟北斗卫星车辆位置。WebSocket用于实现实时数据推送确保地图位置每秒更新。
1. 项目结构
创建一个Maven项目基本结构如下 项目结构图 2. Maven依赖配置 (pom.xml)
首先在pom.xml中添加必要的依赖确保使用Spring Boot、WebSocket和Thymeleaf
dependencies!-- Spring Boot --dependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-web/artifactId/dependency!-- Thymeleaf for rendering HTML --dependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-thymeleaf/artifactId/dependency!-- WebSocket for real-time communication --dependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-websocket/artifactId/dependency!-- Lombok (Optional, for cleaner code) --dependencygroupIdorg.projectlombok/groupIdartifactIdlombok/artifactIdscopeprovided/scope/dependency
/dependencies3. 实现后端服务
package com.example.beidou;import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.scheduling.annotation.EnableScheduling;SpringBootApplication
EnableScheduling // 启用定时任务
public class BeidouApplication {public static void main(String[] args) {SpringApplication.run(BeidouApplication.class, args);}
}效果图 Controller package com.example.beidou.controller;import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.messaging.simp.SimpMessagingTemplate;
import org.springframework.scheduling.annotation.Scheduled;
import org.springframework.web.bind.annotation.RestController;import java.util.HashMap;
import java.util.Map;
import javax.annotation.PostConstruct;RestController
public class VehicleController {Autowiredprivate SimpMessagingTemplate messagingTemplate;private MapString, MapString, Double vehiclePositions new HashMapString, MapString, Double() {{put(Vehicle 1, new HashMapString, Double() {{put(latitude, 39.9042);//北京put(longitude, 116.4074);}});put(Vehicle 2, new HashMapString, Double() {{put(latitude, 31.2304);//上海put(longitude, 121.4737);}});put(Vehicle 3, new HashMapString, Double() {{put(latitude, 22.3964);// 香港put(longitude, 114.1095);}});put(Vehicle 4, new HashMapString, Double() {{put(latitude, 30.5728);//成都put(longitude, 104.0668);}});put(Vehicle 5, new HashMapString, Double() {{put(latitude, 34.3416);// 西安put(longitude, 108.9398);}});}};private MapString, MapString, Double vehicleTargets new HashMapString, MapString, Double() {{put(Vehicle 1, new HashMapString, Double() {{put(latitude, 31.2304);//上海put(longitude, 121.4737);}});put(Vehicle 2, new HashMapString, Double() {{put(latitude, 39.9042);//北京put(longitude, 116.4074);}});put(Vehicle 3, new HashMapString, Double() {{put(latitude, 34.3416);// 西安put(longitude, 108.9398);}});put(Vehicle 4, new HashMapString, Double() {{put(latitude, 22.3964);// 香港put(longitude, 114.1095);}});put(Vehicle 5, new HashMapString, Double() {{put(latitude, 30.5728);//成都put(longitude, 104.0668);}});}};// 服务器启动时自动启动模拟PostConstructpublic void startSimulation() {System.out.println(Starting vehicle simulation...);}// 模拟车辆移动轨迹Scheduled(fixedRate 1000)private void sendVehicleUpdates() {MapString, MapString, Double updatedPositions new HashMap();for (Map.EntryString, MapString, Double entry : vehiclePositions.entrySet()) {String vehicleId entry.getKey();MapString, Double position entry.getValue();MapString, Double target vehicleTargets.get(vehicleId);// 按一定速度向目标移动double latDiff target.get(latitude) - position.get(latitude);double lonDiff target.get(longitude) - position.get(longitude);// 每次移动经纬度的 1/100double newLatitude position.get(latitude) latDiff * 0.02;double newLongitude position.get(longitude) lonDiff * 0.02;position.put(latitude, newLatitude);position.put(longitude, newLongitude);updatedPositions.put(vehicleId, new HashMap(position));}messagingTemplate.convertAndSend(/topic/vehicleLocation, updatedPositions);}
}WebSocketConfig package com.example.beidou.config;import org.springframework.context.annotation.Configuration;
import org.springframework.messaging.simp.config.MessageBrokerRegistry;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;Configuration
EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {Overridepublic void configureMessageBroker(MessageBrokerRegistry config) {config.enableSimpleBroker(/topic); // 使用 /topic 作为消息前缀config.setApplicationDestinationPrefixes(/app);}Overridepublic void registerStompEndpoints(StompEndpointRegistry registry) {registry.addEndpoint(/vehicle-location).setAllowedOriginPatterns(*).withSockJS();}
}4. 配置文件 (application.properties)
server.port8080
5. 启动项目
确保你有Java和Maven环境在项目根目录执行以下命令启动应用
mvn spring-boot:run
6. 访问页面
在浏览器中访问 http://localhost:8080你应该可以看到一个地图显示车辆的实时位置和轨迹更新。
前端页面代码有需要的请私信我有偿提供代码白嫖党勿扰