165 lines
5.6 KiB
HTML
165 lines
5.6 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
|
||
<head>
|
||
<title>众产地图应用</title>
|
||
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0, shrink-to-fit=no">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
|
||
<link href="/jscss/style.css" rel="stylesheet" type="text/css" />
|
||
<link href="/zces108/widgets.css" rel="stylesheet" type="text/css" />
|
||
<style type="text/css">
|
||
#ceContainer {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
}
|
||
|
||
.cecontrolpanel {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
background: #ffffff66;
|
||
border-radius: 0 0 0 0.5em;
|
||
padding: 0.2em;
|
||
}
|
||
|
||
.cecontrolpanel .tip {
|
||
color: #000000;
|
||
}
|
||
|
||
.cecontrolhelp {
|
||
position: absolute;
|
||
right: 1em;
|
||
top: 3em;
|
||
display: none;
|
||
}
|
||
|
||
.cecontrolhelp>div {
|
||
background: #ffffff66;
|
||
border-radius: 0.5em;
|
||
padding: 1em;
|
||
}
|
||
|
||
.ceflys {
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
flex-wrap: wrap;
|
||
gap: 0.5em;
|
||
padding-bottom: 2em;
|
||
}
|
||
|
||
.ceflys>div {
|
||
padding: 0.3em 1em;
|
||
background: #ffffffaa;
|
||
border: 1px solid #ffffff;
|
||
border-radius: 2em;
|
||
color: #000000;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.ceflys>div.select {
|
||
background: #ffffff;
|
||
}
|
||
</style>
|
||
|
||
</head>
|
||
|
||
<body style="background:#eeeeee;">
|
||
<div id="ceContainer"></div>
|
||
<div class="cecontrolpanel">
|
||
<div class="flex">
|
||
<div class="tip flex1"></div>
|
||
<div class="btn xs def" onclick="ce.control_fly_open(false)">飞行</div>
|
||
<div class="btn xs def" onclick="ce.control_fly_open(true)">步行</div>
|
||
<div class="btn xs def" onclick="$5('.cecontrolhelp').toggle('',0.2)">帮助</div>
|
||
</div>
|
||
</div>
|
||
<div class="cecontrolhelp" onclick="$5(this).hide('',0.2);">
|
||
<div>
|
||
<img src="/zces108/keyhelp.png" />
|
||
</div>
|
||
</div>
|
||
<div class="ceflys"></div>
|
||
<script type="text/javascript" src="/jscss/ciy.js"></script>
|
||
<script type="text/javascript" src="/zces108/Cesium.js"></script>
|
||
<script type="text/javascript" src="/zces108/ciyearth.min.js"></script>
|
||
<script type="text/javascript" src="/zces108/map.min.js"></script>
|
||
<script>
|
||
'use strict';
|
||
var Glob = {};
|
||
var ciy_vars = {};
|
||
var ce = new ciyearth();
|
||
if(ciyfn.inmobile())
|
||
$5('.cecontrolpanel').hide();
|
||
Glob.dom_controltip = $5('.cecontrolpanel .tip');
|
||
|
||
function fly_to(dom) {
|
||
event.stopPropagation();
|
||
$5('.ceflys>div').removeClass('select');
|
||
$5(dom).addClass('select');
|
||
var dat = $5(dom).attr('data-dat');
|
||
ce.flyTo(ciyfn.tojson(dat), 3);
|
||
}
|
||
ce.ciyevent = function (type, act, data, data2) {
|
||
if (type == 'click') {
|
||
console.log(act, data, data2);
|
||
} else if (type == 'entity') {
|
||
if (act == 'leftclick') {
|
||
ciyfn.toast(data.entity.name);
|
||
}
|
||
} else if (type == 'control') {
|
||
if (act == 'walk' || act == 'fly') {
|
||
$5('.ceflys').hide('slide', 0.5);
|
||
} else if (act == 'close') {
|
||
$5('.ceflys').show('slide', 0.5, 'flex');
|
||
} else if (act == 'op') {
|
||
var htmltip = '';
|
||
if (ce.viewer.flags.walk)
|
||
htmltip += '<kbd>行走</kbd>';
|
||
else
|
||
htmltip += '<kbd>飞行</kbd>';
|
||
var lng = Cesium.Math.toDegrees(data.longitude);
|
||
var lat = Cesium.Math.toDegrees(data.latitude);
|
||
htmltip += '经度:' + lng.toFixed(4) + ' 纬度:' + lat.toFixed(4) + ' 海拔:' + data.height.toFixed(1) + '米';
|
||
if (ce.lastfloorheight > -9999)
|
||
htmltip += ' 高程:' + ce.lastfloorheight.toFixed(1) + '米';
|
||
htmltip += ' 档位:<code style="font-size: 1.3em;">' + ce.viewer.flags.speedbet + '</code>';
|
||
htmltip += ' ';
|
||
Glob.dom_controltip.html(htmltip);
|
||
} else {
|
||
Glob.dom_controltip.html('');
|
||
$5('.cecontrolhelp').hide();
|
||
}
|
||
}
|
||
};
|
||
ciyfn.pageload(function () {
|
||
try {
|
||
ciyfn.callfunc('init', {}, function (json) {
|
||
Glob.data = json;
|
||
var mapset = ciyfn.tojson(json.cemap.mapjson);
|
||
console.log('mapset', mapset);
|
||
mapset.domid = 'ceContainer';
|
||
ce.init(mapset);
|
||
if (!isarray(mapset.flys))
|
||
return;
|
||
for (var i = 0; i < mapset.flys.length; i++) {
|
||
var html = $5('<div onclick="fly_to(this)">' + mapset.flys[i].name + '</div>');
|
||
html.attr('data-dat', mapset.flys[i].dat);
|
||
$5('.ceflys').append(html);
|
||
}
|
||
});
|
||
} catch (e) {
|
||
console.log('init:', e);
|
||
}
|
||
});
|
||
</script>
|
||
</body>
|
||
|
||
</html> |