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
};
})