口碑好的秦皇岛网站建设哪家好,百度教育app,qq业务代理网站建设,wordpress页面加载js实现基于北斗卫星的车辆定位和轨迹图的Maven工程#xff08;使用模拟数据#xff09;#xff0c;我们将使用以下技术#xff1a;
Spring Boot#xff1a;作为后端框架#xff0c;用来提供数据接口。Thymeleaf#xff1a;作为前端模板引擎#xff0c;呈现网页。Leaflet…实现基于北斗卫星的车辆定位和轨迹图的Maven工程使用模拟数据我们将使用以下技术
Spring Boot作为后端框架用来提供数据接口。Thymeleaf作为前端模板引擎呈现网页。Leaflet.js一个开源的JavaScript库用于显示交互式地图。Simulated Data使用随机生成的模拟GPS数据来模拟北斗卫星车辆位置。WebSocket用于实现实时数据推送确保地图位置每秒更新。
目录
1. 项目结构
2. Maven依赖配置 (pom.xml)
3. 实现后端服务
3.1 BeidouApplication.java
4. 配置文件 (application.properties)
5. 启动项目
6. 访问页面 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. 实现后端服务
3.1 BeidouApplication.java
这是Spring Boot的启动类
package com.example.beidou;import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;SpringBootApplication
public class BeidouApplication {public static void main(String[] args) {SpringApplication.run(BeidouApplication.class, args);}
}4. 配置文件 (application.properties)
server.port8080
5. 启动项目
确保你有Java和Maven环境在项目根目录执行以下命令启动应用
mvn spring-boot:run
6. 访问页面
在浏览器中访问 http://localhost:8080你应该可以看到一个地图显示车辆的实时位置和轨迹更新。 效果图 Controller package com.example.beidou.controller;import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.messaging.simp.SimpMessagingTemplate;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;import java.util.HashMap;
import java.util.Map;
import java.util.Random;
import java.util.concurrent.Executors;
import java.util.concurrent.ScheduledExecutorService;
import java.util.concurrent.TimeUnit;RestController
public class VehicleController {private ScheduledExecutorService executorService Executors.newScheduledThreadPool(1);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);}});}};GetMapping(/startSimulation)public String startSimulation() {executorService.scheduleAtFixedRate(this::sendVehicleUpdates, 0, 500, TimeUnit.MILLISECONDS);return Simulation started!;}GetMapping(/stopSimulation)public String stopSimulation() {executorService.shutdownNow();return Simulation stopped!;}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);config.setApplicationDestinationPrefixes(/app);}Overridepublic void registerStompEndpoints(StompEndpointRegistry registry) {registry.addEndpoint(/vehicle-location).setAllowedOriginPatterns(*).withSockJS();}
}前端页面代码有需要的请私信我有偿提供代码白嫖党勿扰
