我正在使用 Thymeleaf 在 JAVA/SPRING/HTML5 中创建一个 Web 应用程序，该应用程序基于具有所有客户的纬度和经度的 H2 数据库制作带有标记的地图。我在后端 x 前端集成中取得了成功。Java 控制器使用 Thymeleaf 将一个对象发送到 HTML 页面，该页面导入一个带有谷歌地图生成功能的 javascript 文件，使用该对象并执行该功能。但问题是：地图不会在页面上生成我调试代码，但没有弄清楚问题出在哪里。HTML代码（我减少了代码以关注问题）：<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"><head><meta charset="UTF-8" /><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><meta name="viewport" content="width=device-width" /><title>Mapa do cliente</title></head><body> <div class="mapa" th:attr="data-latitude=${customer.latitude},data-longitude=${customer.longitude}" id="map" style="width: 100%; height: 100%"></div> <script src="https://jquery.gocache.net/jquery-3.5.1.min.js" type="text/javascript"></script> <script src="/webjars/bootstrap/4.5.0/js/bootstrap.min.js"></script> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&libraries=&v=weekly"></script> <script src="/js/mapFunctions.js" type="text/javascript"></script></body></html>JavaScript代码：let map;var lat = $('.mapa').attr('data-latitude')var lng = $('.mapa').attr('data-longitude') function initMap(lat, lng) { map = new google.maps.Map(document.getElementById("map"), { center: { lat, lng }, zoom: 8 }); }initMap(parseFloat(lat), parseFloat(lng))我在控制台中打印了“lat”和“lng”变量，它们没问题。我不是 javascript 和英语方面的专家，所以请原谅我任何不好的做法。
添加回答
举报
0/150
提交
取消