define(['html!templates/menu/baseCalc/targetPoint', 'css!styles/tools/toolPublicPopup', 'css!styles/menu/baseCalc/targetPoint', ], function (tplLayout) { /** * 模块状态,用于存储模块的状态 例如:收起,关闭 * @type {Object} */ var status = { initialized: false//是否初始化 }; /** * 模块数据 用于数据存储和外部调用 * @type {Object} * 数据存放 */ var modValue = { data: {}, baseId: "", targetId: "", beforeStyle: { color: "#2ecc71", fontFillColor: "#fff000", labelOffset: -15, }, afterStyle: { color: "#3498db", fontFillColor: "#fff000", labelOffset: 15, } }; /** * 初始化并订阅事件 * @return {[type]} [description] */ function open(data) { if (!status.initialized) { setLayout(); bindEvent(); subscribe(); status.initialized = true; } else { // 重置 reset(); } modValue.data = data; $("#targetPointModal .title").text(data.label); ONEMAP.C.publisher.publish({ modName: 'targetPoint' }, 'baseCalc:active'); }; function setLayout() { $('body').append(tplLayout); //拖拽 $("#targetPointModal .popup-ct").dragmove($('#targetPointModal')); }; /** * 事件绑定 */ function bindEvent() { $("#targetPointModal .close").bind('click', function () { close(); }); $("#targetPointModal .btn-default.sure").bind('click', function () { execute() }); $("#targetPointModal .btn-default.clickStart").bind('click', function () { getMapClickEvent(function (lonlat) { clearSingleMarker(modValue.baseId, "baseId") $("#targetPointForm .lonCoor").val(lonlat.lon); $("#targetPointForm .latCoor").val(lonlat.lat); modValue.baseId = addMarker(lonlat.lon, lonlat.lat, modValue.beforeStyle, "基准点") }) }); $("#targetPointModal .btn-default.cleanStart").bind('click', function () { $("#targetPointForm .lonCoor").val(""); $("#targetPointForm .latCoor").val(""); clearSingleMarker(modValue.baseId, "baseId") }); //回车执行 $('#targetPointInput, #jumpToLatInput').bind('keydown', function (e) { if (e.keyCode === 13) { execute(); } }); }; function getMapClickEvent(callback) { if (modValue.handler != null) return; modValue.handler = new Cesium.ScreenSpaceEventHandler(map3DViewer.map.canvas); // 监听鼠标点击事件 modValue.handler.setInputAction(function (click) { // 使用pick函数获取点击位置的实际位置 // var cartesian = map3DViewer.map.scene.pickPosition(click.position); // var cartesian = map3DViewer.map.camera.pickEllipsoid(click.position); let cartesian = map3DViewer.map.scene.globe.pick(map3DViewer.map.camera.getPickRay(click.position), map3DViewer.map.scene); if (Cesium.defined(cartesian)) { // 将笛卡尔坐标转换为经纬度坐标 var cartographic = Cesium.Cartographic.fromCartesian(cartesian); var longitudeString = Cesium.Math.toDegrees(cartographic.longitude).toFixed(6); var latitudeString = Cesium.Math.toDegrees(cartographic.latitude).toFixed(6); // var heightString = cartographic.height.toFixed(2); // console.log('经度:' + longitudeString + ',纬度:' + latitudeString + ',高度:' + heightString) } if (isNaN(longitudeString) || isNaN(latitudeString)) { alert("当前获取坐标有误,请重新获取") removeMapClickEvent(); throw "当前获取坐标有误,请重新获取"; } callback({ lon: Number(longitudeString), lat: Number(latitudeString) }) removeMapClickEvent(); }, Cesium.ScreenSpaceEventType.LEFT_CLICK); modValue.handler.setInputAction(function (click) { removeMapClickEvent(); }, Cesium.ScreenSpaceEventType.RIGHT_CLICK); } function removeMapClickEvent() { if (modValue.handler) { modValue.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); modValue.handler.removeInputAction(Cesium.ScreenSpaceEventType.RIGHT_CLICK); modValue.handler = null; } } /** * 注册监听 * @type {Function} */ function subscribe() { ONEMAP.C.publisher.subscribe(remove, 'baseCalc:active'); }; /** * 关闭模块 * @return {[type]} [description] */ function remove(options) { if (options.modName != 'targetPoint') { close(); } else { $("#targetPointModal").show(); } } function reset() { $("#targetPointForm .lonCoor").val(""); $("#targetPointForm .latCoor").val(""); $("#targetPointForm .angle").val(""); $("#targetPointForm .distance").val(""); $("#targetPointForm .outputCoor").text("") clearMarker(); } function close() { $("#targetPointModal").hide(); reset(); } // 执行 function execute() { // 检测坐标 let lon = $("#targetPointForm .lonCoor").val() let lat = $("#targetPointForm .latCoor").val() let angle = $("#targetPointForm .angle").val() let distance = $("#targetPointForm .distance").val() if (lon == "" || lat == "" || angle == "" || distance == "") { alert("请完善转换参数") throw "请完善转换参数 " } lon = Number(lon) lat = Number(lat) angle = Number(angle) distance = Number(distance) if (isNaN(lon) || isNaN(lat) || isNaN(angle) || isNaN(distance)) { alert("请输入正确的数字格式") throw "请输入正确的数字格式" } if (angle < 0 || angle > 360) { alert('请正确输入偏北角范围(0-360)'); throw "请正确输入偏北角范围(0-360)" } if (distance < 0) { alert('请正确输入距离(大于0)'); throw "请正确输入距离(大于0)" } // 检测坐标范围 if (judge(lon, lat)) { // 根据转换类型,访问接口获取转换后的数据 // 添加 转前点,转后点 getLatLng(lon, lat, angle, distance); } } /** * 获取输入信息并跳转到指定的坐标 * @type {Function} * @private */ function judge(lng, lat) { if (!L.Util.verifyLatLng(lat, lng)) { alert('请正确输入经纬范围(经度0-180、纬度0-90)'); return false; } return true; } /** * 获取并计算经纬度 * @private */ function getLatLng(beforeLon, beforeLat, angle, distance) { clearMarker(); $.ajax({ type: "get", dataType: 'json', url: onemapUrlConfig.PROXY_URL + "/targetPointCalculation", data: { lon: beforeLon, lat: beforeLat, angle: angle, distance: distance, }, success: function (data) { let lon, lat; if (data.x) { lon = data.x lat = data.y } else { lon = data.lon lat = data.lat } if (modValue.baseId != null) modValue.baseId = addMarker(beforeLon, beforeLat, modValue.beforeStyle, "基准点") modValue.targetId = addMarker(lon, lat, modValue.afterStyle, "目标点") $("#targetPointForm .outputCoor").text(lon + ', ' + lat) map3DViewer.setView({ center: { lng: lon, lat: lat }, distance: 40, heading: 0,//摄像机平面角度 正北为0 tilt: 0//摄像机倾斜角 }); }, error: function (error) { console.log(error) } }); return; }; function addMarker(lon, lat, style, text) { let entity = map3DViewer.map.entities.add({ name: '添加点', position: Cesium.Cartesian3.fromDegrees(lon, lat, 0), point: { color: Cesium.Color.fromCssColorString(style.color), //颜色 pixelSize: 10, //大小 outlineColor: Cesium.Color.YELLOW, //轮廓颜色 outlineWidth: 1 }, label: { pixelOffset: new Cesium.Cartesian2(0, style.labelOffset), text: text, font: '24px', fillColor: Cesium.Color.fromCssColorString(style.color) } }) return entity._id; } /** * 清除marker * @return {[type]} [description] */ function clearMarker() { if (modValue.baseId) { map3DViewer.map.entities.removeById(modValue.baseId) modValue.baseId = "" } if (modValue.targetId) { map3DViewer.map.entities.removeById(modValue.targetId) modValue.targetId = "" } } function clearSingleMarker(id, type) { if (id) { map3DViewer.map.entities.removeById(id) modValue[type] = "" return; } } return ONEMAP.M.targetPointForm = { open: open, clearMarker: clearMarker }; })