| | |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
| | | <meta name="viewport" |
| | | content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> |
| | | <title>SmartEarth-SDK示例</title> |
| | | <title>SmartEarth-SDK Demo</title> |
| | | <link rel="stylesheet" href="../layui/css/layui.css"> |
| | | <style> |
| | | html, |
| | |
| | | } |
| | | |
| | | .layui-form-label { |
| | | width: 96px !important; |
| | | width: 116px !important; |
| | | } |
| | | |
| | | .layui-input-block { |
| | |
| | | <body> |
| | | <div class="layui-prop"> |
| | | <div class="bnt-box"> |
| | | <button type="button" class="layui-btn layui-btn-normal" id="start">继续漫游</button> |
| | | <button type="button" class="layui-btn layui-btn-normal" id="stop" style="margin-left: 0;">暂停漫游</button> |
| | | <button type="button" class="layui-btn layui-btn-normal" id="exit">退出漫游</button> |
| | | <button type="button" class="layui-btn layui-btn-normal" id="start"></button> |
| | | <button type="button" class="layui-btn layui-btn-normal" id="stop" style="margin-left: 0;"></button> |
| | | <button type="button" class="layui-btn layui-btn-normal" id="exit"></button> |
| | | </div> |
| | | <form class="layui-form" action=""> |
| | | <div class="layui-form-item"> |
| | | <label class="layui-form-label">路线名称</label> |
| | | <label class="layui-form-label" id="routeName"></label> |
| | | <div class="layui-input-block" id="roadName" style="line-height: 38px;"> |
| | | |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item"> |
| | | <label class="layui-form-label">视角模式</label> |
| | | <label class="layui-form-label" id="viewMode"></label> |
| | | <div class="layui-input-block"> |
| | | <select id="sjms" name="sjms" lay-filter="sjms"> |
| | | <option value="0">跟随模型</option> |
| | | <option value="1">第一人称视角</option> |
| | | <option value="2">上帝视角</option> |
| | | <option value="0"></option> |
| | | <option value="1"></option> |
| | | <option value="2"></option> |
| | | </select> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline fly"> |
| | | <label class="layui-form-label">飞行高度</label> |
| | | <label class="layui-form-label" id="flyHeight"></label> |
| | | <div class="layui-input-block"> |
| | | <input id="cameraHeight" type="text" value="0" name="cameraHeight" lay-filter="cameraHeight" |
| | | class="layui-input" onkeyup="value=value.replace(/[^\d\.\-]/g,'')"> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline fly notGod"> |
| | | <label class="layui-form-label">飞行距离</label> |
| | | <label class="layui-form-label" id="flyDistance"></label> |
| | | <div class="layui-input-block"> |
| | | <input id="cameraDistance" type="text" value="0" name="cameraDistance" lay-filter="cameraDistance" |
| | | class="layui-input" onkeyup="value=value.replace(/[^\d\.\-]/g,'')"> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline fly notGod"> |
| | | <label class="layui-form-label">俯仰角</label> |
| | | <label class="layui-form-label" id="labelPitch"></label> |
| | | <div class="layui-input-block"> |
| | | <input id="pitch" type="text" value="0" name="pitch" lay-filter="pitch" class="layui-input" |
| | | onkeyup="value=value.replace(/[^\d\.\-]/g,'')"> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">漫游速度(m/s)</label> |
| | | <label class="layui-form-label" id="roamingSpeed"></label> |
| | | <div class="layui-input-block"> |
| | | <div id="flySpeed" class="flySpeed"></div> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">总长度</label> |
| | | <label class="layui-form-label" id="totalLength"></label> |
| | | <div class="layui-input-block" id="totalLen" style="line-height: 38px;"> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">已漫游长度</label> |
| | | <label class="layui-form-label" id="roamingLength"></label> |
| | | <div class="layui-input-block" id="distanceTraveled" style="line-height: 38px;"> |
| | | 0 |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">总时长</label> |
| | | <label class="layui-form-label" id="duration"></label> |
| | | <div class="layui-input-block" id="totalTime" style="line-height: 38px;"> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">已漫游时间</label> |
| | | <label class="layui-form-label" id="roamingTime"></label> |
| | | <div class="layui-input-block" id="time" style="line-height: 38px;"> |
| | | 0 |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">是否显示模型</label> |
| | | <label class="layui-form-label" id="showModelLabel"></label> |
| | | <div class="layui-input-block"> |
| | | <input id="showModel" type="checkbox" lay-skin="switch" lay-filter="showModel" value="off" |
| | | lay-text="是|否"> |
| | | lay-text=""> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">是否显示路线</label> |
| | | <label class="layui-form-label" id="showRoute"></label> |
| | | <div class="layui-input-block"> |
| | | <input id="showLine" type="checkbox" lay-skin="switch" lay-filter="showLine" value="off" |
| | | lay-text="是|否"> |
| | | lay-text=""> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">速度</label> |
| | | <label class="layui-form-label" id="speed"></label> |
| | | <div class="layui-input-block" id="sd" style="line-height: 38px;"> |
| | | 50m/s |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">经度</label> |
| | | <label class="layui-form-label" id="lon"></label> |
| | | <div class="layui-input-block" id="jd" style="line-height: 38px;"> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">纬度</label> |
| | | <label class="layui-form-label" id="lat"></label> |
| | | <div class="layui-input-block" id="wd" style="line-height: 38px;"> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">漫游高程</label> |
| | | <label class="layui-form-label" id="roamingElevation"></label> |
| | | <div class="layui-input-block" id="height" style="line-height: 38px;"> |
| | | </div> |
| | | </div> |
| | | <div class="layui-form-item norline"> |
| | | <label class="layui-form-label">地面高程</label> |
| | | <label class="layui-form-label" id="groundElevation"></label> |
| | | <div class="layui-input-block" id="globeHeight" style="line-height: 38px;"> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | </form> |
| | | </div> |
| | | <script src="../jquery-2.0.3.js"></script> |
| | | <script src="../jquery-3.5.0.min.js"></script> |
| | | <script src="../layui/layui.js"></script> |
| | | |
| | | <script> |
| | |
| | | var sgworld = parent.earthCtrl; |
| | | var routeData = parent.PathAnimationData.flyData; |
| | | var url = parent.SmartEarthRootUrl + "Workers/Model/xiaoche.glb"; |
| | | const positionEndCallback = parent.PathAnimationData.positionEndCallback |
| | | $('#start').hide(); |
| | | $('#stop').show(); |
| | | document.getElementById("start").innerText = `${sgworld.language.SG_CONTINUE_ROAMING}` |
| | | document.getElementById("stop").innerText = `${sgworld.language.SG_STOP_ROAMING}` |
| | | document.getElementById("exit").innerText = `${sgworld.language.SG_QUIT_ROAMING}` |
| | | document.getElementById("routeName").innerText = `${sgworld.language.SG_ROUTE_NAME}` |
| | | document.getElementById("viewMode").innerText = `${sgworld.language.SG_VIEW_MODE}` |
| | | var select = document.getElementById("sjms"); |
| | | select.options[0].innerText = `${sgworld.language.SG_FOLLOW_MODEL}` |
| | | select.options[1].innerText = `${sgworld.language.SG_FIRST_PERSON}` |
| | | select.options[2].innerText = `${sgworld.language.SG_GOD_PERSPECTIVE}` |
| | | |
| | | document.getElementById("flyHeight").innerText = `${sgworld.language.SG_FLYING_HEIGHT}` |
| | | document.getElementById("flyDistance").innerText = `${sgworld.language.SG_FLYING_DISTANCE}` |
| | | document.getElementById("labelPitch").innerText = `${sgworld.language.CREATOR_PITCH}` |
| | | document.getElementById("roamingSpeed").innerText = `${sgworld.language.SG_ROAMING_SPEED}` |
| | | document.getElementById("totalLength").innerText = `${sgworld.language.SG_TOTAL_LENGTH}` |
| | | document.getElementById("roamingLength").innerText = `${sgworld.language.SG_ROAMING_LENGTH}` |
| | | document.getElementById("duration").innerText = `${sgworld.language.SG_DURATION}` |
| | | document.getElementById("showModel").setAttribute("lay-text", `${sgworld.language.SG_YES_OR_NO}`) |
| | | document.getElementById("showLine").setAttribute("lay-text", `${sgworld.language.SG_YES_OR_NO}`) |
| | | document.getElementById("roamingTime").innerText = `${sgworld.language.SG_ROAMING_TIME}` |
| | | document.getElementById("showModelLabel").innerText = `${sgworld.language.SG_SHOW_MODEL}` |
| | | document.getElementById("showRoute").innerText = `${sgworld.language.SG_SHOW_ROUTE}` |
| | | document.getElementById("speed").innerText = `${sgworld.language.SG_SPEED}` |
| | | document.getElementById("lon").innerText = `${sgworld.language.EARTH_CTRL_POSITION_LON}` |
| | | document.getElementById("lat").innerText = `${sgworld.language.EARTH_CTRL_POSITION_LAT}` |
| | | document.getElementById("roamingElevation").innerText = `${sgworld.language.SG_ROAMING_ELEVATION}` |
| | | document.getElementById("groundElevation").innerText = `${sgworld.language.SG_GROUND_ELEVATION}` |
| | | var form, element, slider; |
| | | var ratio = 0; |
| | | layui.use(['form', 'element', 'slider'], function () { |
| | |
| | | }); |
| | | $('#cameraHeight').on('input propertychange', function (event) { |
| | | const inputHeight = $(this).val(); |
| | | const height = inputHeight.replace(/[^\d\.\-]/g, ''); |
| | | const height = inputHeight.replace(/[^\d\.\-]/g, ''); |
| | | if(height && height !== '-') { |
| | | fly && fly.setFlyHeight(parseFloat(height)); |
| | | routeData && (routeData.height = parseFloat(height)); |
| | | } |
| | | routeData && (routeData.height = parseFloat(height)); |
| | | } |
| | | }); |
| | | $('#pitch').on('input propertychange', function (event) { |
| | | var pitch = $(this).val().replace(/[^\d\.\-]/g, ''); |
| | |
| | | } |
| | | }); |
| | | |
| | | function shuj(data) { |
| | | function shuj(data,endss) { |
| | | if (data.distanceTraveled) { |
| | | //已漫游长度 |
| | | document.getElementById("distanceTraveled").innerText = getDistance(data.distanceTraveled); |
| | |
| | | if (data.ratio) { |
| | | ratio = parseInt(data.ratio * 100); |
| | | } |
| | | if (endss && positionEndCallback != null && typeof positionEndCallback === 'function') { |
| | | positionEndCallback(data, endss); |
| | | } |
| | | } |
| | | |
| | | //自动点击关闭窗口点关闭事件 |
| | |
| | | var $title = $(window.parent.document).find('.layui-layer-title'); |
| | | if ($title.length > 0) { |
| | | $title.each(function (i, item) { |
| | | if (item.innerHTML === "漫游路线") { |
| | | if (item.innerHTML === `${sgworld.language.SG_ROAMING_ROUTE}`) { |
| | | var closeButton = $(item).parent().find('.layui-layer-close'); |
| | | var event = document.createEvent('MouseEvents'); |
| | | event.initEvent("click", false, true); |
| | |
| | | function getTime(data) { |
| | | var time; |
| | | if (data < 60) { |
| | | time = data + "秒"; |
| | | time = data + `${sgworld.language.SG_SECOND}`; |
| | | } else if (data >= 60 && data < 3600) { |
| | | time = Math.floor(data / 60) + '分' + data % 60 + '秒'; |
| | | time = Math.floor(data / 60) + `${sgworld.language.SG_MINUTE}` + data % 60 + `${sgworld.language.SG_SECOND}`; |
| | | } else { |
| | | var h = Math.floor(data / 3600); |
| | | data -= h * 3600; |
| | | var m = Math.floor(data / 60); |
| | | data -= m * 60; |
| | | time = h + '小时' + m + '分' + data + '秒'; |
| | | time = h + `${sgworld.language.SG_HOUR}`+ m + `${sgworld.language.SG_MINUTE}` + data + `${sgworld.language.SG_SECOND}`; |
| | | } |
| | | return time; |
| | | } |
| | |
| | | data = parseFloat(data).toFixed(2); |
| | | data = parseFloat(data); |
| | | if (data >= 1000) { |
| | | dis = (data / 1000).toFixed(3) + "千米"; |
| | | dis = (data / 1000).toFixed(3) + `${sgworld.language.UNIT_KILOMETER}`; |
| | | } else { |
| | | dis = data + "米"; |
| | | dis = data + `${sgworld.language.UNIT_METER}`; |
| | | } |
| | | return dis; |
| | | } |