数据修改
After Width: | Height: | Size: 4.5 KiB |
After Width: | Height: | Size: 2.4 KiB |
After Width: | Height: | Size: 2.4 KiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 2.4 KiB |
After Width: | Height: | Size: 282 B |
After Width: | Height: | Size: 306 B |
After Width: | Height: | Size: 3.7 KiB |
After Width: | Height: | Size: 2.6 KiB |
|
@ -0,0 +1,16 @@
|
|||
{
|
||||
"companyName": "LGZN",
|
||||
"productName": "JianPuBuilding",
|
||||
"productVersion": "0.1",
|
||||
"dataUrl": "JianPu_Building.data.unityweb",
|
||||
"wasmCodeUrl": "JianPu_Building.wasm.code.unityweb",
|
||||
"wasmFrameworkUrl": "JianPu_Building.wasm.framework.unityweb",
|
||||
"graphicsAPI": ["WebGL 2.0","WebGL 1.0"],
|
||||
"webglContextAttributes": {"preserveDrawingBuffer": false},
|
||||
"splashScreenStyle": "Dark",
|
||||
"backgroundColor": "#231F20",
|
||||
"cacheControl": {"default": "must-revalidate"},
|
||||
"developmentBuild": false,
|
||||
"multithreading": false,
|
||||
"unityVersion": "2019.4.0f1"
|
||||
}
|
|
@ -0,0 +1,24 @@
|
|||
function UnityProgress(unityInstance, progress) {
|
||||
if (!unityInstance.Module)
|
||||
return;
|
||||
if (!unityInstance.logo) {
|
||||
unityInstance.logo = document.createElement("div");
|
||||
unityInstance.logo.className = "logo " + unityInstance.Module.splashScreenStyle;
|
||||
unityInstance.container.appendChild(unityInstance.logo);
|
||||
}
|
||||
if (!unityInstance.progress) {
|
||||
unityInstance.progress = document.createElement("div");
|
||||
unityInstance.progress.className = "progress " + unityInstance.Module.splashScreenStyle;
|
||||
unityInstance.progress.empty = document.createElement("div");
|
||||
unityInstance.progress.empty.className = "empty";
|
||||
unityInstance.progress.appendChild(unityInstance.progress.empty);
|
||||
unityInstance.progress.full = document.createElement("div");
|
||||
unityInstance.progress.full.className = "full";
|
||||
unityInstance.progress.appendChild(unityInstance.progress.full);
|
||||
unityInstance.container.appendChild(unityInstance.progress);
|
||||
}
|
||||
unityInstance.progress.full.style.width = (100 * progress) + "%";
|
||||
unityInstance.progress.empty.style.width = (100 * (1 - progress)) + "%";
|
||||
if (progress == 1)
|
||||
unityInstance.logo.style.display = unityInstance.progress.style.display = "none";
|
||||
}
|
After Width: | Height: | Size: 933 B |
|
@ -0,0 +1,19 @@
|
|||
.webgl-content * {border: 0; margin: 0; padding: 0}
|
||||
.webgl-content {position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
|
||||
|
||||
.webgl-content .logo, .progress {position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
|
||||
.webgl-content .logo {background: url('progressLogo.Light.png') no-repeat center / contain; width: 154px; height: 130px;}
|
||||
.webgl-content .progress {height: 18px; width: 141px; margin-top: 90px;}
|
||||
.webgl-content .progress .empty {background: url('progressEmpty.Light.png') no-repeat right / cover; float: right; width: 100%; height: 100%; display: inline-block;}
|
||||
.webgl-content .progress .full {background: url('progressFull.Light.png') no-repeat left / cover; float: left; width: 0%; height: 100%; display: inline-block;}
|
||||
|
||||
.webgl-content .logo.Dark {background-image: url('progressLogo.Dark.png');}
|
||||
.webgl-content .progress.Dark .empty {background-image: url('progressEmpty.Dark.png');}
|
||||
.webgl-content .progress.Dark .full {background-image: url('progressFull.Dark.png');}
|
||||
|
||||
.webgl-content .footer {margin-top: 5px; height: 38px; line-height: 38px; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 18px;}
|
||||
.webgl-content .footer .webgl-logo, .title, .fullscreen {height: 100%; display: inline-block; background: transparent center no-repeat;}
|
||||
.webgl-content .footer .webgl-logo {background-image: url('webgl-logo.png'); width: 204px; float: left;}
|
||||
.webgl-content .footer .title {margin-right: 10px; float: right;}
|
||||
.webgl-content .footer .fullscreen {background-image: url('fullscreen.png'); width: 38px; float: right;}
|
||||
.webgl-content .back {background-image: url('shouye.png'); width: 38px; height: 38px; float: right;}
|
|
@ -0,0 +1,63 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en-us">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Unity WebGL Player | JianPuBuilding</title>
|
||||
<link rel="shortcut icon" href="TemplateData/favicon.ico">
|
||||
<link rel="stylesheet" href="TemplateData/style.css">
|
||||
<script src="TemplateData/UnityProgress.js"></script>
|
||||
<script src="Build/UnityLoader.js"></script>
|
||||
<script>
|
||||
var unityInstance = UnityLoader.instantiate("unityContainer", "Build/JianPu_Building.json", {onProgress: UnityProgress});
|
||||
// function init() {
|
||||
// unityInstance.SetFullscreen(1)
|
||||
// }
|
||||
function home() {
|
||||
window.history.go(-1);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<style>
|
||||
html body {
|
||||
margin: 0;
|
||||
border: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.back{
|
||||
bottom: 20px;
|
||||
right: 50px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
}
|
||||
.home{
|
||||
background: #ffffff;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
right: 50px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
border-radius:5px
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<!-- <div class="webgl-content">-->
|
||||
<!-- <div id="unityContainer" style="width: 960px; height: 600px"></div>-->
|
||||
<!-- <div class="footer">-->
|
||||
<!-- <div class="webgl-logo"></div>-->
|
||||
<!-- <div class="fullscreen" onclick="init()" style="cursor: pointer"></div>-->
|
||||
<!-- <div class="back" onclick="home()" style="cursor: pointer"></div>-->
|
||||
<!-- <div class="title">JianPuBuilding</div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<div style="width: 100%; height:100%" class="webgl-content">
|
||||
<!-- <div id="unityContainer" style="width: 960px; height: 600px"></div> -->
|
||||
<div id="unityContainer" style="width: 100vw; height: 100vh;overflow: hidden;" ></div>
|
||||
<div class="home">
|
||||
<div class="back" onclick="home()" style="cursor: pointer"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <staticContent> <mimeMap fileExtension=".unityweb" mimeType="application / unityweb" /> </staticContent> </system.webServer> </configuration>
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"liveServer.settings.port": 5501
|
||||
}
|
|
@ -0,0 +1,16 @@
|
|||
{
|
||||
"companyName": "DefaultCompany",
|
||||
"productName": "ShengDaPing",
|
||||
"productVersion": "0.1",
|
||||
"dataUrl": "sgs.data.unityweb",
|
||||
"wasmCodeUrl": "sgs.wasm.code.unityweb",
|
||||
"wasmFrameworkUrl": "sgs.wasm.framework.unityweb",
|
||||
"graphicsAPI": ["WebGL 2.0"],
|
||||
"webglContextAttributes": {"preserveDrawingBuffer": false},
|
||||
"splashScreenStyle": "Dark",
|
||||
"backgroundColor": "#231F20",
|
||||
"cacheControl": {"default": "must-revalidate"},
|
||||
"developmentBuild": false,
|
||||
"multithreading": false,
|
||||
"unityVersion": "2019.4.36f1c1"
|
||||
}
|
|
@ -0,0 +1 @@
|
|||
https://web-1300932214.cos.ap-nanjing.myqcloud.com/sgs/index.html
|
|
@ -0,0 +1 @@
|
|||
https://web-1300932214.cos.ap-nanjing.myqcloud.com/sgs/Map/sgmap出行安全/sgmap.html
|
|
@ -0,0 +1 @@
|
|||
https://web-1300932214.cos.ap-nanjing.myqcloud.com/sgs/Map/sgmap房地资源/sgmap.html
|
|
@ -0,0 +1 @@
|
|||
https://web-1300932214.cos.ap-nanjing.myqcloud.com/sgs/Map/sgmap智慧工地/sgmap.html
|
|
@ -0,0 +1 @@
|
|||
https://web-1300932214.cos.ap-nanjing.myqcloud.com/sgs/Map/sgmap绿色双碳/sgmap.html
|
|
@ -0,0 +1 @@
|
|||
https://web-1300932214.cos.ap-nanjing.myqcloud.com/sgs/Map/sgmap食品安全/sgmap.html
|
|
@ -0,0 +1,24 @@
|
|||
function UnityProgress(unityInstance, progress) {
|
||||
if (!unityInstance.Module)
|
||||
return;
|
||||
if (!unityInstance.logo) {
|
||||
unityInstance.logo = document.createElement("div");
|
||||
unityInstance.logo.className = "logo " + unityInstance.Module.splashScreenStyle;
|
||||
unityInstance.container.appendChild(unityInstance.logo);
|
||||
}
|
||||
if (!unityInstance.progress) {
|
||||
unityInstance.progress = document.createElement("div");
|
||||
unityInstance.progress.className = "progress " + unityInstance.Module.splashScreenStyle;
|
||||
unityInstance.progress.empty = document.createElement("div");
|
||||
unityInstance.progress.empty.className = "empty";
|
||||
unityInstance.progress.appendChild(unityInstance.progress.empty);
|
||||
unityInstance.progress.full = document.createElement("div");
|
||||
unityInstance.progress.full.className = "full";
|
||||
unityInstance.progress.appendChild(unityInstance.progress.full);
|
||||
unityInstance.container.appendChild(unityInstance.progress);
|
||||
}
|
||||
unityInstance.progress.full.style.width = (100 * progress) + "%";
|
||||
unityInstance.progress.empty.style.width = (100 * (1 - progress)) + "%";
|
||||
if (progress == 1)
|
||||
unityInstance.logo.style.display = unityInstance.progress.style.display = "none";
|
||||
}
|
After Width: | Height: | Size: 13 KiB |
After Width: | Height: | Size: 345 B |
After Width: | Height: | Size: 155 B |
After Width: | Height: | Size: 159 B |
After Width: | Height: | Size: 137 B |
After Width: | Height: | Size: 142 B |
After Width: | Height: | Size: 2.3 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 933 B |
|
@ -0,0 +1,32 @@
|
|||
html,body{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#unityContainer{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.webgl-content * {border: 0; margin: 0; padding: 0;width: 100%; height: 100%;}
|
||||
.webgl-content {position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
|
||||
|
||||
.webgl-content .logo, .progress {position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
|
||||
.webgl-content .logo {background: url('progressLogo.Light.png') no-repeat center / contain; width: 154px; height: 130px;}
|
||||
.webgl-content .progress {height: 18px; width: 141px; margin-top: 90px;}
|
||||
.webgl-content .progress .empty {background: url('progressEmpty.Light.png') no-repeat right / cover; float: right; width: 100%; height: 100%; display: inline-block;}
|
||||
.webgl-content .progress .full {background: url('progressFull.Light.png') no-repeat left / cover; float: left; width: 0%; height: 100%; display: inline-block;}
|
||||
|
||||
.webgl-content .logo.Dark {background-image: url('progressLogo.Dark.png');}
|
||||
.webgl-content .progress.Dark .empty {background-image: url('progressEmpty.Dark.png');}
|
||||
.webgl-content .progress.Dark .full {background-image: url('progressFull.Dark.png');}
|
||||
|
||||
.webgl-content .footer {margin-top: 5px; height: 38px; line-height: 38px; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 18px;display: none;}
|
||||
.webgl-content .footer .webgl-logo, .title, .fullscreen {height: 100%; display: inline-block; background: transparent center no-repeat;}
|
||||
.webgl-content .footer .webgl-logo {background-image: url('webgl-logo.png'); width: 204px; float: left;}
|
||||
.webgl-content .footer .title {margin-right: 10px; float: right;}
|
||||
.webgl-content .footer .fullscreen {background-image: url('fullscreen.png'); width: 38px; float: right;}
|
||||
.webgl-content .back {background-image: url('shouye.png'); width: 38px; height: 38px; float: right;}
|
After Width: | Height: | Size: 3.5 KiB |
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en-us">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Unity WebGL Player | ShengDaPing</title>
|
||||
<link rel="shortcut icon" href="TemplateData/favicon.ico">
|
||||
<link rel="stylesheet" href="TemplateData/style.css">
|
||||
<script src="TemplateData/UnityProgress.js"></script>
|
||||
<script src="Build/UnityLoader.js"></script>
|
||||
<script>
|
||||
var unityInstance = UnityLoader.instantiate("unityContainer", "Build/sgs.json", {onProgress: UnityProgress});
|
||||
function home() {
|
||||
window.history.go(-1);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<style>
|
||||
.back{
|
||||
bottom: 20px;
|
||||
right: 50px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
}
|
||||
.home{
|
||||
background: #ffffff;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
right: 50px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
border-radius:5px
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="webgl-content" style="width:100%;height: 100%;">
|
||||
<div id="unityContainer"></div>
|
||||
<div class="footer">
|
||||
<div class="webgl-logo"></div>
|
||||
<div class="fullscreen" onclick="unityInstance.SetFullscreen(1)"></div>
|
||||
<div class="title">ShengDaPing</div>
|
||||
</div>
|
||||
<div class="home">
|
||||
<div class="back" onclick="home()" style="cursor: pointer"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,203 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
|
||||
|
||||
<title>思极地图</title>
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="map" style="width: 100%; height: 100%;"></div>
|
||||
<!-- <div style="position:absolute;top:2rem;left:2rem;">
|
||||
<input type="button" value="浦口区" onclick="gotoPosition('pk')" />
|
||||
<input type="button" value="建邺区" onclick="gotoPosition('jy')" />
|
||||
<input type="button" value="鼓楼区" onclick="gotoPosition('gl')" />
|
||||
<input type="button" value="雨花区" onclick="gotoPosition('yh')" />
|
||||
<input type="button" value="秦淮区" onclick="gotoPosition('qh')" />
|
||||
<input type="button" value="江宁区" onclick="gotoPosition('jn')" />
|
||||
<input type="button" value="溧水区" onclick="gotoPosition('ls')" />
|
||||
<input type="button" value="高淳区" onclick="gotoPosition('gc')" />
|
||||
</div> -->
|
||||
<script src="https://map.sgcc.com.cn/maps?v=3.0.0"></script>
|
||||
<script id="mapScript">
|
||||
var map = null;
|
||||
var defaultLevel = 16;//默认层级
|
||||
var defaultArea = "nj";
|
||||
|
||||
var positions = {
|
||||
// "pk": { name: "浦口区", lng: 118.592631, lat: 32.049500, markers: [{ icon: "images/marker.png", width: 128, height: 128, lng: 118.589631, lat: 32.049500, data: "12345" }, { icon: "images/marker.png", width: 32, height: 32, lng: 118.592832, lat: 32.059502, data: "12345" }] },
|
||||
// "nj": { "lng": 118.802997, "lat": 32.066366, markers: [{ icon: "images/shengfloor.png",w:330,h:230, lng:118.82276, lat:32.095614, data: "省公司大楼" },{ icon: "images/1.png",w:300,h:200, lng: 118.816436, lat: 32.038332, data: "供应商1" },{ icon: "images/2.png",w:300,h:200, lng: 118.730198, lat: 32.022659, data: "供应商2" },{ icon: "images/3.png",w:300,h:200, lng: 118.895199, lat: 32.13427, data: "供应商3" }] },
|
||||
"nj": { "lng": 118.802997, "lat": 32.066366, markers: [{ icon: "images/shengfloor.png", lng: 118.773886, lat:32.058391, data: "省公司大楼" },{ icon: "images/1.png",lng: 118.816436, lat: 32.038332, data: "供应商1" },{ icon: "images/2.png",lng: 118.730198, lat: 32.022659, data: "供应商2" },{ icon: "images/3.png",lng: 118.895199, lat: 32.13427, data: "供应商3" }] },
|
||||
"jy": { name: "建邺区", lng: 118.729156, lat: 32.005818 },
|
||||
"gl": { name: "鼓楼区", lng: 118.774862, lat: 32.086006 },
|
||||
"yh": { name: "雨花区", lng: 118.683091, lat: 31.941923 },
|
||||
"qh": { name: "秦淮区", lng: 118.819167, lat: 32.02163 },
|
||||
"jn": { name: "江宁区", lng: 118.924179, lat: 31.862158 },
|
||||
"ls": { name: "溧水区", lng: 119.057397, lat: 31.574872 },
|
||||
"gc": { name: "高淳区", lng: 118.976972, lat: 31.322781 }
|
||||
}
|
||||
|
||||
// 申请的key和sn
|
||||
SGMap.tokenTask
|
||||
.login("1a6fc765e72b36819428016bed30ff48", "5916636e73f03e5dbdf275f810fc7d62")
|
||||
.then(function () {
|
||||
initMap();
|
||||
});
|
||||
|
||||
function initMap() {
|
||||
var area = GetQueryString("area");
|
||||
var lng = positions[defaultArea].lng;
|
||||
var lat = positions[defaultArea].lat;
|
||||
if (area != null) {
|
||||
defaultArea = area;
|
||||
lng = positions[defaultArea].lng;
|
||||
lat = positions[defaultArea].lat;
|
||||
}
|
||||
|
||||
map = new SGMap.Map({
|
||||
// 地图绑定的DOM元素ID
|
||||
container: "map",
|
||||
// 地图样式
|
||||
// style: "aegis://styles/aegis/Satellite512",
|
||||
style: "aegis://styles/aegis/Streets",
|
||||
// 默认缩放层级
|
||||
zoom: 11,
|
||||
|
||||
// 地图中心点
|
||||
center: [lng, lat],
|
||||
//倾斜角度
|
||||
pitch: 45,
|
||||
// 地图默认字体
|
||||
localIdeographFontFamily: "Microsoft YoHei"
|
||||
});
|
||||
|
||||
loadMarkers(defaultArea);
|
||||
reportLocation();
|
||||
}
|
||||
|
||||
//获取地图层级
|
||||
function getMapZoom() {
|
||||
return map.getZoom();
|
||||
}
|
||||
|
||||
//设置地图层级
|
||||
function setMapZoom(n) {
|
||||
if (!isNaN(n) && n >= 0 && n <= 20)
|
||||
map.setZoom(n);
|
||||
}
|
||||
|
||||
//设置地图中心
|
||||
function setMapCenter(lat, lng) {
|
||||
map.setCenter([lng, lat]);
|
||||
}
|
||||
|
||||
//获取地图当前中心点坐标
|
||||
function getMapCenter() {
|
||||
return map.getCenter();
|
||||
}
|
||||
|
||||
//每秒汇报当前中心点坐标
|
||||
function reportLocation() {
|
||||
var centerPoint = getMapCenter();
|
||||
console.log(centerPoint);
|
||||
window.setTimeout("reportLocation()", 1000);
|
||||
}
|
||||
|
||||
//地点跳转
|
||||
function gotoPosition(posName) {
|
||||
map.easeTo({ center: [positions[posName].lng, positions[posName].lat], zoom: getMapZoom() });
|
||||
loadMarkers(posName);
|
||||
}
|
||||
|
||||
//画marker点
|
||||
function addMarker(markerData) {
|
||||
var el = document.createElement("img");
|
||||
el.cusData = markerData;
|
||||
el.className = "marker";
|
||||
// 自定义图标
|
||||
el.src = markerData.icon;
|
||||
// el.style.width = markerData.width == undefined ? "64px" : markerData.width + "px";
|
||||
// el.style.height = markerData.height == undefined ? "64px" : markerData.height + "px";
|
||||
// el.style.width = markerData.width == undefined ? "260px" : markerData.width + "px";
|
||||
// el.style.height = markerData.height == undefined ? "200px" : markerData.height + "px";
|
||||
// 如果不传el,会默认给一个蓝色水滴图标
|
||||
var mk = new SGMap.Marker(el, {
|
||||
// marker相对经纬度点坐标点的位置
|
||||
anchor: "bottom",
|
||||
// 相对于元素中心点,偏移的像素距离,负数代表向左和向上
|
||||
offset: [markerData.xOffset == undefined ? 0 : markerData.xOffset, markerData.yOffset == undefined ? 0 : markerData.yOffset]
|
||||
});
|
||||
mk.setLngLat([markerData.lng, markerData.lat]);
|
||||
mk.addTo(map);
|
||||
el.addEventListener("click", function (e) {
|
||||
/////////////////////////////////自定义输出内容//////////////////////////////////////
|
||||
console.log("跳转" + e.target.cusData.data);
|
||||
});
|
||||
|
||||
return mk;
|
||||
}
|
||||
|
||||
//加载图标
|
||||
var markerArray = new Array();
|
||||
function loadMarkers(posName) {
|
||||
for (var i in markerArray) {
|
||||
markerArray[i].remove();
|
||||
}
|
||||
markerArray = new Array();
|
||||
|
||||
var markers = positions[posName].markers;
|
||||
if (markers != undefined && markers != null) {
|
||||
for (var i in markers) {
|
||||
var markerData = markers[i];
|
||||
markerArray.push(addMarker(markerData));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
1.获取2个经纬度之间的距离
|
||||
2.lng1 lat1 经纬度1
|
||||
3.lng2 lat2 经纬度2
|
||||
*/
|
||||
function getDisance(lng1, lat1, lng2, lat2) {
|
||||
var dis = 0;
|
||||
var radius = 6378137;//地球的半径
|
||||
var radLat1 = toRad(lat1);
|
||||
var radLat2 = toRad(lat2);
|
||||
var deltaLat = radLat1 - radLat2;
|
||||
var deltaLng = toRad(lng1) - toRad(lng2);
|
||||
var dis =
|
||||
2 *
|
||||
Math.asin(
|
||||
Math.sqrt(
|
||||
Math.pow(Math.sin(deltaLat / 2), 2) +
|
||||
Math.cos(radLat1) *
|
||||
Math.cos(radLat2) *
|
||||
Math.pow(Math.sin(deltaLng / 2), 2)
|
||||
)
|
||||
);
|
||||
|
||||
return dis * radius;
|
||||
}
|
||||
|
||||
//获取URL参数
|
||||
function GetQueryString(name) {
|
||||
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
|
||||
var r = window.location.search.substr(1).match(reg);
|
||||
if (r != null) return unescape(r[2]); return null;
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
After Width: | Height: | Size: 43 KiB |
After Width: | Height: | Size: 46 KiB |
After Width: | Height: | Size: 43 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 71 KiB |
After Width: | Height: | Size: 71 KiB |
After Width: | Height: | Size: 67 KiB |
After Width: | Height: | Size: 67 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 71 KiB |
|
@ -0,0 +1,202 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
|
||||
|
||||
<title>思极地图</title>
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="map" style="width: 100%; height: 100%;"></div>
|
||||
<!-- <div style="position:absolute;top:2rem;left:2rem;">
|
||||
<input type="button" value="浦口区" onclick="gotoPosition('pk')" />
|
||||
<input type="button" value="建邺区" onclick="gotoPosition('jy')" />
|
||||
<input type="button" value="鼓楼区" onclick="gotoPosition('gl')" />
|
||||
<input type="button" value="雨花区" onclick="gotoPosition('yh')" />
|
||||
<input type="button" value="秦淮区" onclick="gotoPosition('qh')" />
|
||||
<input type="button" value="江宁区" onclick="gotoPosition('jn')" />
|
||||
<input type="button" value="溧水区" onclick="gotoPosition('ls')" />
|
||||
<input type="button" value="高淳区" onclick="gotoPosition('gc')" />
|
||||
</div> -->
|
||||
<script src="https://map.sgcc.com.cn/maps?v=3.0.0"></script>
|
||||
<script id="mapScript">
|
||||
var map = null;
|
||||
var defaultLevel = 5;//默认层级
|
||||
var defaultArea = "nj";
|
||||
|
||||
var positions = {
|
||||
// "pk": { name: "浦口区", lng: 118.592631, lat: 32.049500, markers: [{ icon: "greenImages/marker.png", width: 128, height: 128, lng: 118.589631, lat: 32.049500, data: "12345" }, { icon: "greenImages/marker.png", width: 32, height: 32, lng: 118.592832, lat: 32.059502, data: "12345" }] },
|
||||
// "nj": { "lng": 118.802997, "lat": 32.066366, markers: [{ icon: "greenImages/shengfloor.png",w:330,h:230, lng: 118.85244, lat:32.11629, data: "江苏省公司大楼" },{ icon: "greenImages/floor2.png",w:330,h:230, lng: 118.647195, lat: 32.039924, data: "南京市公司大楼" },{ icon: "greenImages/floor3.png",w:330,h:230, lng: 119.02204, lat: 32.10846, data: "客服中心公司大楼" },] },
|
||||
"nj": { "lng": 118.802997, "lat": 32.066366, markers: [{ icon: "greenImages/shengfloor.png",w:330,h:230, lng: 118.773886, lat:32.058391, data: "江苏省公司大楼" },] },
|
||||
"jy": { name: "建邺区", lng: 118.729156, lat: 32.005818 },
|
||||
"gl": { name: "鼓楼区", lng: 118.774862, lat: 32.086006 },
|
||||
"yh": { name: "雨花区", lng: 118.683091, lat: 31.941923 },
|
||||
"qh": { name: "秦淮区", lng: 118.819167, lat: 32.02163 },
|
||||
"jn": { name: "江宁区", lng: 118.924179, lat: 31.862158 },
|
||||
"ls": { name: "溧水区", lng: 119.057397, lat: 31.574872 },
|
||||
"gc": { name: "高淳区", lng: 118.976972, lat: 31.322781 }
|
||||
}
|
||||
|
||||
// 申请的key和sn
|
||||
SGMap.tokenTask
|
||||
.login("1a6fc765e72b36819428016bed30ff48", "5916636e73f03e5dbdf275f810fc7d62")
|
||||
.then(function () {
|
||||
initMap();
|
||||
});
|
||||
|
||||
function initMap() {
|
||||
var area = GetQueryString("area");
|
||||
var lng = positions[defaultArea].lng;
|
||||
var lat = positions[defaultArea].lat;
|
||||
if (area != null) {
|
||||
defaultArea = area;
|
||||
lng = positions[defaultArea].lng;
|
||||
lat = positions[defaultArea].lat;
|
||||
}
|
||||
|
||||
map = new SGMap.Map({
|
||||
// 地图绑定的DOM元素ID
|
||||
container: "map",
|
||||
// 地图样式
|
||||
style: "aegis://styles/aegis/Streets",
|
||||
// style: "aegis://styles/aegis/Satellite512",
|
||||
// 默认缩放层级
|
||||
zoom: 11,
|
||||
// 地图中心点
|
||||
center: [lng, lat],
|
||||
//倾斜角度
|
||||
pitch: 45,
|
||||
// 地图默认字体
|
||||
localIdeographFontFamily: "Microsoft YoHei"
|
||||
});
|
||||
|
||||
loadMarkers(defaultArea);
|
||||
reportLocation();
|
||||
}
|
||||
|
||||
//获取地图层级
|
||||
function getMapZoom() {
|
||||
return map.getZoom();
|
||||
}
|
||||
|
||||
//设置地图层级
|
||||
function setMapZoom(n) {
|
||||
if (!isNaN(n) && n >= 0 && n <= 20)
|
||||
map.setZoom(n);
|
||||
}
|
||||
|
||||
//设置地图中心
|
||||
function setMapCenter(lat, lng) {
|
||||
map.setCenter([lng, lat]);
|
||||
}
|
||||
|
||||
//获取地图当前中心点坐标
|
||||
function getMapCenter() {
|
||||
return map.getCenter();
|
||||
}
|
||||
|
||||
//每秒汇报当前中心点坐标
|
||||
function reportLocation() {
|
||||
var centerPoint = getMapCenter();
|
||||
console.log(centerPoint);
|
||||
window.setTimeout("reportLocation()", 1000);
|
||||
}
|
||||
|
||||
//地点跳转
|
||||
function gotoPosition(posName) {
|
||||
map.easeTo({ center: [positions[posName].lng, positions[posName].lat], zoom: getMapZoom() });
|
||||
loadMarkers(posName);
|
||||
}
|
||||
|
||||
//画marker点
|
||||
function addMarker(markerData) {
|
||||
var el = document.createElement("img");
|
||||
el.cusData = markerData;
|
||||
el.className = "marker";
|
||||
// 自定义图标
|
||||
el.src = markerData.icon;
|
||||
// el.style.width = markerData.width == undefined ? "64px" : markerData.width + "px";
|
||||
// el.style.height = markerData.height == undefined ? "64px" : markerData.height + "px";
|
||||
el.style.width = markerData.width == undefined ? "260px" : markerData.width + "px";
|
||||
el.style.height = markerData.height == undefined ? "150px" : markerData.height + "px";
|
||||
// 如果不传el,会默认给一个蓝色水滴图标
|
||||
var mk = new SGMap.Marker(el, {
|
||||
// marker相对经纬度点坐标点的位置
|
||||
anchor: "bottom",
|
||||
// 相对于元素中心点,偏移的像素距离,负数代表向左和向上
|
||||
offset: [markerData.xOffset == undefined ? 0 : markerData.xOffset, markerData.yOffset == undefined ? 0 : markerData.yOffset]
|
||||
});
|
||||
mk.setLngLat([markerData.lng, markerData.lat]);
|
||||
mk.addTo(map);
|
||||
el.addEventListener("click", function (e) {
|
||||
/////////////////////////////////自定义输出内容//////////////////////////////////////
|
||||
console.log("跳转" + e.target.cusData.data);
|
||||
});
|
||||
|
||||
return mk;
|
||||
}
|
||||
|
||||
//加载图标
|
||||
var markerArray = new Array();
|
||||
function loadMarkers(posName) {
|
||||
for (var i in markerArray) {
|
||||
markerArray[i].remove();
|
||||
}
|
||||
markerArray = new Array();
|
||||
|
||||
var markers = positions[posName].markers;
|
||||
if (markers != undefined && markers != null) {
|
||||
for (var i in markers) {
|
||||
var markerData = markers[i];
|
||||
markerArray.push(addMarker(markerData));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
1.获取2个经纬度之间的距离
|
||||
2.lng1 lat1 经纬度1
|
||||
3.lng2 lat2 经纬度2
|
||||
*/
|
||||
function getDisance(lng1, lat1, lng2, lat2) {
|
||||
var dis = 0;
|
||||
var radius = 6378137;//地球的半径
|
||||
var radLat1 = toRad(lat1);
|
||||
var radLat2 = toRad(lat2);
|
||||
var deltaLat = radLat1 - radLat2;
|
||||
var deltaLng = toRad(lng1) - toRad(lng2);
|
||||
var dis =
|
||||
2 *
|
||||
Math.asin(
|
||||
Math.sqrt(
|
||||
Math.pow(Math.sin(deltaLat / 2), 2) +
|
||||
Math.cos(radLat1) *
|
||||
Math.cos(radLat2) *
|
||||
Math.pow(Math.sin(deltaLng / 2), 2)
|
||||
)
|
||||
);
|
||||
|
||||
return dis * radius;
|
||||
}
|
||||
|
||||
//获取URL参数
|
||||
function GetQueryString(name) {
|
||||
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
|
||||
var r = window.location.search.substr(1).match(reg);
|
||||
if (r != null) return unescape(r[2]); return null;
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
|
@ -0,0 +1,23 @@
|
|||
[
|
||||
{"tudi":"南京市鼓楼区和燕路2号","jd":"栖霞基地","zongbu":"江苏电力公司","fenzhi":"南京供电公司","fangchan":"沿河四村5幢9、10、11、12号","province":"江苏省","city":"南京市","area":"建邺区","position":"118.785821,32.095862"},
|
||||
{"tudi":"南京市鼓楼区定淮门石头城115号","jd":"城北基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"裕顺雅苑6号401室","province":"江苏省","city":"南京市","area":"鼓楼区","position":"118.747813,32.066839"},
|
||||
{"tudi":"南京市秦淮区火瓦巷51号","jd":"城南基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"清凉门大街8号03幢1单元704室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"清凉门大街8号","position":"118.789691,32.032739"},
|
||||
{"tudi":"南京市雨花台区雨花南路32号","zongbu":"雨花基地","fenzhi":"","fangchan":"宁夏路1号101室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"宁夏路1号","position":"118.769801,31.994273"},
|
||||
{"tudi":"南京市建邺区奥体大街1号","jd":"公司大楼(市公司)","zongbu":"江苏电力公司","fenzhi":"","fangchan":"龙园西路113号(枫亚苑05幢701室)","province":"江苏省","city":"南京市","area":"鼓楼区","street":"龙园西路113号","position":"118.744015,31.990507"},
|
||||
{"tudi":"南京市鼓楼区中山北路217号","jd":"龙吟广场","fenzhi":"","fangchan":"龙池阉64号602室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"龙池阉64号","position":"118.76956,32.070685"},
|
||||
{"tudi":"南京市鼓楼区峨嵋路21号","jd":"健康中心(安仁街变)","zongbu":"江苏电力公司","fenzhi":"","fangchan":"清凉门大街8号03幢1单元1701室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"清凉门大街8号","position":"118.770386,32.044743"},
|
||||
{"tudi":"南京市鼓楼区龙池庵66号","jd":"苏电宾馆","zongbu":"江苏电力公司","fenzhi":"","fangchan":"清凉门大街8号03幢1单元402室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"清凉门大街8号","position":"118.750561,32.084403"},
|
||||
{"tudi":"南京市玄武区中山路251号","jd":"新纪元宾馆","zongbu":"江苏电力公司","fenzhi":"","fangchan":"龙园西路113号地下车库17号","province":"江苏省","city":"南京市","area":"鼓楼区","street":"龙园西路113号","position":"118.784701,32.049814"},
|
||||
{"tudi":"南京市江宁区天元中路19号","jd":"峰电大厦","zongbu":"江苏电力公司","fenzhi":"","fangchan":"龙园西路113号地下车库21号","province":"江苏省","city":"南京市","area":"鼓楼区","street":"龙园西路113号","position":"118.843786,31.93144"},
|
||||
{"tudi":"南京市玄武区中山路250号","jd":"老卫生所","zongbu":"江苏电力公司","fenzhi":"","fangchan":"清凉门大街8号03幢1单元1103室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"清凉门大街8号","position":"118.784696,32.049813"},
|
||||
{"tudi":"南京市浦口区龙华路19号","jd":"龙华路19号基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"乐山路207号12栋一单元1302","province":"江苏省","city":"南京市","area":"建邺区","street":"乐山路207号","position":"118.640574,32.069147"},
|
||||
{"tudi":"南京市六合区雄州镇园林西路8巷13号","jd":"六合园林路基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"宁夏路1号102室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"宁夏路1号","position":"118.845591,32.352524"},
|
||||
{"tudi":"南京市六合区雄州镇方州路北侧","jd":"六合方州路基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"太平门街10号6幢508室","province":"江苏省","city":"南京市","area":"玄武区","street":"太平门街10号","position":"118.836226,32.364984"},
|
||||
{"tudi":"南京市浦口区泰西路8号","jd":"泰西路基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"中山路268号1幢2101-2112室","province":"江苏省","city":"南京市","area":"玄武区","street":"中山路268号","position":"118.708405,32.149725"},
|
||||
{"tudi":"南京市江宁区天印大道1398号","jd":"江宁新办公楼基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"龙园西路113号(枫亚苑05幢1801室)","province":"江苏省","city":"南京市","area":"鼓楼区","street":"龙园西路113号","position":"118.864288,31.942295"},
|
||||
{"tudi":"南京市江宁区上元大街598号","jd":"江宁老办公楼基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"港龙园15幢101室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"港龙园小区","position":"118.849567,31.954672"},
|
||||
{"tudi":"南京市高淳区北岭路23号","jd":"高淳新办公楼基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"清凉门大街8号03幢1单元1204室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"清凉门大街8号","position":"118.874337,31.332819"},
|
||||
{"tudi":"南京市高淳区镇兴路1号","jd":"高淳老办公楼基地","zongbu":"江苏电力公司","fenzhi":"","fangchan":"太平门街10号7幢605室","province":"江苏省","city":"南京市","area":"玄武区","street":"太平门街10号","position":"118.865921,31.325835"},
|
||||
{"tudi":"江苏省南京市溧水县永阳镇交通路99号","jd":"溧水培训办公楼","zongbu":"江苏电力公司","fenzhi":"","fangchan":"传达室","province":"江苏省","city":"南京市","area":"鼓楼区","street":"北京西路20号","position":"119.035663,31.660993"},
|
||||
{"tudi":"江苏省南京市溧水县永阳镇珍珠北路16号","jd":"溧水综合办公楼","zongbu":"江苏电力公司","fenzhi":"","fangchan":"锁金四村31幢2单元503室","province":"江苏省","city":"南京市","area":"玄武区","street":"锁金四村","position":"119.03119,31.654953"}
|
||||
]
|
After Width: | Height: | Size: 566 B |
After Width: | Height: | Size: 16 KiB |
After Width: | Height: | Size: 43 KiB |
After Width: | Height: | Size: 43 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 67 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 468 B |
After Width: | Height: | Size: 71 KiB |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1008 B |
After Width: | Height: | Size: 2.5 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 7.2 KiB |
After Width: | Height: | Size: 20 KiB |