Imdroid/security-monitor
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: 新增谷歌地图

Browse Source
This commit is contained in:
yarnom 2025-07-04 12:15:03 +08:00
parent 5f83223d9a
commit 71c56c6eb3
1 changed files with 47 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
sec-beidou/src/main/resources/templates/page/device_overview.html
View File

@ -11,6 +11,7 @@
<link rel="stylesheet" href="../lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
<link rel="stylesheet" href="../css/public.css" media="all">
<link rel="stylesheet" href="../css/ol.css">
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBEBxB5n9vikPHbfNMzo_dzneXJi77YqjE" async defer></script>
<style>
.top-panel {
border: 1px solid #eceff9;
@ -583,6 +584,10 @@
<option value="tianditu_terrain">天地图-地形</option>
<option value="amap_satellite">高德-卫星影像</option>
<option value="amap">高德-矢量</option>
<option value="google_satellite" th:if="${role=='SUPER_ADMIN'}">谷歌-卫星影像</option>
<option value="google_terrain" th:if="${role=='SUPER_ADMIN'}">谷歌-地形图</option>
<option value="google_roadmap" th:if="${role=='SUPER_ADMIN'}">谷歌-道路图</option>
<option value="google_hybrid" th:if="${role=='SUPER_ADMIN'}">谷歌-混合</option>
</select>
</div>
@ -756,6 +761,30 @@
})
]
}),
google_satellite: new ol.layer.Tile({
source: new ol.source.XYZ({
url: 'https://mt{0-3}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}',
crossOrigin: 'anonymous'
})
}),
google_terrain: new ol.layer.Tile({
source: new ol.source.XYZ({
url: 'https://mt{0-3}.google.com/vt/lyrs=p&x={x}&y={y}&z={z}',
crossOrigin: 'anonymous'
})
}),
google_roadmap: new ol.layer.Tile({
source: new ol.source.XYZ({
url: 'https://mt{0-3}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}',
crossOrigin: 'anonymous'
})
}),
google_hybrid: new ol.layer.Tile({
source: new ol.source.XYZ({
url: 'https://mt{0-3}.google.com/vt/lyrs=y&x={x}&y={y}&z={z}',
crossOrigin: 'anonymous'
})
}),
tianditu_satellite: new ol.layer.Group({
layers: [
new ol.layer.Tile({
@ -1099,6 +1128,9 @@
// 高德地图使用GCJ-02坐标系，需要转换
var gcjCoord = transform(lat, lon);
coordinates = ol.proj.fromLonLat([gcjCoord.lon, gcjCoord.lat]);
} else if (mapType.startsWith('google_')) {
// Google地图使用WGS84坐标系，直接使用
coordinates = ol.proj.fromLonLat([lon, lat]);
} else {
// 天地图使用CGCS2000/WGS84坐标系，直接使用
coordinates = ol.proj.fromLonLat([lon, lat]);
@ -1127,6 +1159,9 @@
// 高德地图 WGS84 转换为 GCJ-02
var gcjCoord = transform(device.latitude, device.longitude);
mapCoordinates = ol.proj.fromLonLat([gcjCoord.lon, gcjCoord.lat]);
} else if (currentMapType.startsWith('google_')) {
// Google地图使用WGS84坐标系，直接使用
mapCoordinates = ol.proj.fromLonLat([device.longitude, device.latitude]);
} else {
// 天地图 CGCS2000，2000国家大地坐标系，与WGS84实质一样
mapCoordinates = ol.proj.fromLonLat([device.longitude, device.latitude]);
@ -1173,6 +1208,14 @@
function onMapTypeChange() {
var mapType = document.getElementById('mapTypeSelectNew').value;
// 检查用户权限，如果不是SUPER_ADMIN但尝试使用Google地图，则阻止并提示
if(mapType.startsWith('google_') && [[${role}]] != "SUPER_ADMIN") {
layer.msg('您没有权限使用谷歌地图服务');
document.getElementById('mapTypeSelectNew').value = 'tianditu_terrain_hybrid';
mapType = 'tianditu_terrain_hybrid';
}
switchMapType(mapType);
}
@ -1198,13 +1241,16 @@
navigator.geolocation.getCurrentPosition(function(position) {
var lon = position.coords.longitude;
var lat = position.coords.latitude;
var currentMapType = document.getElementById('mapTypeSelect').value;
var currentMapType = document.getElementById('mapTypeSelectNew').value;
var coordinates;
if (currentMapType === 'amap' || currentMapType === 'amap_satellite') {
// 高德地图使用GCJ-02坐标系，需要转换
var gcjCoord = transform(lat, lon);
coordinates = ol.proj.fromLonLat([gcjCoord.lon, gcjCoord.lat]);
} else if (currentMapType.startsWith('google_')) {
// Google地图使用WGS84坐标系，直接使用
coordinates = ol.proj.fromLonLat([lon, lat]);
} else {
// 天地图使用CGCS2000/WGS84坐标系，直接使用
coordinates = ol.proj.fromLonLat([lon, lat]);