/**
|
* 标记widget
|
* @author Liuyl
|
* @date 2015/10/15
|
*/
|
define([
|
"dojo/_base/declare", "dojo/_base/array", "dojo/_base/lang", "dojo/_base/event",
|
"dojo/dom", "dojo/dom-style", "dojo/dom-class", "dojo/dom-attr", "dojo/dom-construct",
|
"dojo/topic", "dojo/on", "dojo/aspect",
|
"base/BaseWidget", "base/AppEvent", "base/ConfigData",
|
"controls/mapswitch/MapSwitchControl", "controls/overview/OverviewControl", "controls/timeslider/TimeSliderControl",
|
"widgets/map/MapWidget",
|
"esri/Color",
|
"esri/symbols/Font",
|
"esri/symbols/TextSymbol",
|
"esri/symbols/PictureMarkerSymbol",
|
"esri/graphic",
|
"esri/geometry/Point",
|
"esri/InfoTemplate",
|
"esri/layers/GraphicsLayer",
|
"esri/geometry/ScreenPoint",
|
"esri/SpatialReference"
|
], function (declare, arrayUtil, lang, event,
|
dom, domStyle, domClass, domAttr, domConstruct,
|
topic, on, aspect,
|
BaseWidget, AppEvent, ConfigData,
|
MapSwitchControl, OverviewControl, TimeSliderControl,
|
MapWidget,
|
Color,
|
Font,
|
TextSymbol,
|
PictureMarkerSymbol,
|
Graphic,
|
Point,
|
InfoTemplate,
|
GraphicsLayer,
|
ScreenPoint,
|
SpatialReference) {
|
var Widget = declare("SwipeWidget", [BaseWidget], {
|
_map: null,
|
templateString: "<div></div>",
|
graphicslayer_sign: null,
|
constructor: function (options) {
|
this._map = options.map;
|
SwipeObj = this;
|
this._mouseDragStartX = 0;
|
this._mouseIsDown = false;
|
this.eventHandlers = {};
|
this.mapWidget = null;
|
this.targetMapWidget = null;
|
this.flag = 0;
|
this.save = 1;
|
this.temGraphic = null;
|
},
|
graphic: null,
|
initMouseDragHandler: function (mapWidget) {
|
if (SwipeObj._map.getLayer("sign")) {
|
SwipeObj.graphicslayer_sign = SwipeObj._map.getLayer("sign");
|
} else {
|
SwipeObj.graphicslayer_sign = new GraphicsLayer({
|
id: "sign"
|
});
|
SwipeObj._map.addLayer(SwipeObj.graphicslayer_sign);
|
}
|
//打开标注功能--添加地图点击事件
|
$("#mainMapWidget").mousedown(function () {
|
$("#mainMapWidget").mouseup(function (evt) {
|
SwipeObj._createPoint(evt);
|
});
|
$("#mainMapWidget").mousemove(function () {
|
$("#mainMapWidget").unbind("mouseup");
|
});
|
});
|
//启动标记功能的时候禁用地图点击事件
|
SwipeObj._map.setInfoWindowOnClick(false);
|
//注册清空按钮事件
|
AppEvent.addAppEventListener(AppEvent.APPLICATION_CLEAR, lang.hitch(this, function () {
|
SwipeObj.graphicslayer_sign.clear();
|
SwipeObj._map.infoWindow.hide();
|
}));
|
},
|
//生成标注点
|
_createPoint: function (evt) {
|
var aa = evt.target.outerHTML;
|
var situation = aa.substring(1, 3);
|
if (situation == 'sv' || situation == 'pa' || situation == 'ci') {
|
mapX = evt.clientX;
|
mapY = evt.clientY;
|
// console.log(mapX, mapY);
|
console.log($(".in-menu-ul").width());
|
if ($(".in-menu-ul").is(':visible')) {
|
var X = evt.clientX - $("#tabcontainer").width() - $(".in-menu-ul").width() - 2;
|
} else {
|
var X = evt.clientX - $("#tabcontainer").width() - 2;
|
}
|
var Y = evt.clientY - $(".in-header").height() - 1;
|
var screenpoint = new ScreenPoint(X, Y);
|
var mappoint = SwipeObj._map.toMap(screenpoint);
|
// console.log(mappoint);
|
var symbol = new PictureMarkerSymbol({
|
"url": "images/sign1.png",
|
"height": 20,
|
"width": 14.5,
|
"yoffset": 10
|
});
|
var attr = {
|
"标题": null,
|
"内容": null
|
};
|
//添加标注点信息窗模板
|
var template = new InfoTemplate();
|
template.setTitle(SwipeObj._getTextTitle);
|
template.setContent(SwipeObj._getTextContent);
|
SwipeObj._checkSave(1);
|
var temGraphic = new Graphic(mappoint, symbol, attr, template);
|
this.temGraphic = temGraphic;
|
SwipeObj.graphicslayer_sign.add(temGraphic);
|
SwipeObj._map.infoWindow.setTitle(temGraphic.getTitle());
|
SwipeObj._map.infoWindow.setContent(temGraphic.getContent());
|
SwipeObj._map.infoWindow.show(mappoint);
|
}
|
},
|
//判断是否保存标注
|
_checkSave: function(type){
|
if(type == 1){
|
if(this.flag == 1 && this.save == 0){
|
SwipeObj.graphicslayer_sign.remove(this.temGraphic);
|
}
|
this.flag = 1;
|
this.save = 0;
|
}else{
|
this.flag = 1;
|
this.save = 1;
|
}
|
},
|
//模版标题
|
_getTextTitle: function (graphic) {
|
//console.log(graphic);
|
if (graphic.attributes["标题"] == null) {
|
return "标注";
|
} else {
|
return graphic.attributes["标题"];
|
}
|
},
|
//模版内容
|
_getTextContent: function (graphic) {
|
// console.log(SwipeObj.graphicslayer_sign.graphics);
|
$('.actionList').children('a:first').nextAll().remove(); //清除“缩放至”之后的所有元素
|
//移除其他模块添加的<a>标签
|
if ($('.actionList .img').length != 0) {
|
$('.actionList .img').remove();
|
}
|
if ($('.actionList .qj').length != 0) {
|
$('.actionList .qj').remove();
|
}
|
if ($('.actionList .vedio').length != 0) {
|
$('.actionList .vedio').remove();
|
}
|
if ($('.actionList .msg').length != 0) {
|
$('.actionList .msg').remove();
|
}
|
var sign_graphics = new Array();
|
for (var i in SwipeObj.graphicslayer_sign.graphics) {
|
// console.log(sign_graphics[i].symbol.type);
|
if (SwipeObj.graphicslayer_sign.graphics[i].symbol.type == "textsymbol") {
|
sign_graphics.push(SwipeObj.graphicslayer_sign.graphics[i]);
|
}
|
}
|
//console.log(graphic.attributes["内容"]);
|
if (graphic.attributes["内容"] == null || graphic.attributes["标题"] == null) {
|
var aa = "<div class='lineDiv'><h5>标题:</h5><input type='text' id='signTitle' class='commonDiv'></div>" +
|
"<div class='lineDiv textAreaHeight'><h5>内容:</h5>" + "<textarea id='signContent' class='commonDiv'></textarea></div>" +
|
"<button id='saveSign' class='infoBtn BtnLeft'>保存</button>" +
|
"<button id='deleContent' class='infoBtn BtnRight'>删除</button> ";
|
SwipeObj._saveclick(graphic, sign_graphics);
|
// SwipeObj._deletclick(graphic);
|
return aa;
|
} else {
|
SwipeObj._saveclick(graphic, sign_graphics);
|
// SwipeObj._deletclick(graphic);
|
var str = "<div class='lineDiv'><h5>标题:</h5><div class='commonDiv'>" + graphic.attributes["标题"] + "</div></div>" +
|
"<div class='lineDiv textAreaHeight'><h5>内容:</h5><div class='commonDiv'>" + graphic.attributes["内容"] + "</div></div>" +
|
"<button id='changeContent' class='infoBtn BtnLeft'>编辑</button>" +
|
"<button id='deleContent' class='infoBtn BtnRight'>删除</button> ";
|
$('.contentPane').empty().append(str);
|
|
return str;
|
}
|
},
|
//绑定信息窗按钮点击事件
|
_saveclick: function (graphic, textGraphic) {
|
$(".contentPane").unbind("click"); //防止重复绑定
|
$(".contentPane").click(function (evt) {
|
if ($(evt.target).text() == "保存") { //保存按钮点击事件--将输入的值存入点属性
|
//alert(1);
|
SwipeObj._checkSave(2);
|
var signTitle = $("#signTitle").val()
|
if ($.trim(signTitle) == '') {
|
signTitle = '标注';
|
}
|
var signContent = $("#signContent").val();
|
var str = "<div class='lineDiv'><h5>标题:</h5><div class='commonDiv'>" + signTitle + "</div></div>" +
|
"<div class='lineDiv textAreaHeight'><h5>内容:</h5><div class='commonDiv'>" + signContent + "</div></div>" +
|
"<button id='changeContent' class='infoBtn BtnLeft'>编辑</button>" +
|
"<button id='deleContent' class='infoBtn BtnRight'>删除</button> ";
|
$('.contentPane').empty().append(str);
|
|
graphic.setAttributes({
|
"标题": signTitle,
|
"内容": signContent
|
});
|
var temSign = SwipeObj.graphicslayer_sign.graphics;
|
for (var x in temSign) {
|
if (temSign[x].geometry.x == graphic.geometry.x && temSign[x].geometry.y == graphic.geometry.y && temSign[x].symbol.type == "textsymbol") {
|
SwipeObj.graphicslayer_sign.remove(temSign[x]);
|
break;
|
}
|
}
|
var point = new Point(graphic.geometry.x, graphic.geometry.y, new SpatialReference(4490));
|
// var point= new ScreenPoint(graphic.geometry.x, graphic.geometry.y);
|
var textsymbol = new TextSymbol(signTitle).setColor(new Color([255, 39, 0])).setAlign(Font.ALIGN_MIDDLE).setAngle(0).setFont(new Font("10pt").setWeight(Font.WEIGHT_BOLD)).setOffset(0, 30).setHaloColor(new Color([255, 0, 0]));
|
;
|
var temGraphic = new Graphic(point, textsymbol);
|
SwipeObj.graphicslayer_sign.add(temGraphic);
|
} else if ($(evt.target).text() == "删除") { //删除按钮点击事件--删除标记点
|
var temSign = SwipeObj.graphicslayer_sign.graphics;
|
SwipeObj._map.infoWindow.hide();
|
for (var x in temSign) {
|
if (temSign[x].geometry.x == graphic.geometry.x && temSign[x].geometry.y == graphic.geometry.y && temSign[x].symbol.type == "textsymbol") {
|
SwipeObj.graphicslayer_sign.remove(temSign[x]);
|
break;
|
}
|
}
|
for (var x in temSign) {
|
if (temSign[x].geometry.x == graphic.geometry.x && temSign[x].geometry.y == graphic.geometry.y) {
|
SwipeObj.graphicslayer_sign.remove(temSign[x]);
|
break;
|
}
|
}
|
SwipeObj.graphicslayer_sign.remove(SwipeObj);
|
SwipeObj.graphicslayer_sign.refresh();
|
} else if ($(evt.target).text() == "编辑") {
|
var signTitle = $("#signalTitle").val()
|
var signContent = $("#signalContent").val();
|
var aa = "<div class='lineDiv'><h5>标题:</h5><input class='commonDiv' type='text' id='signTitle' value='" + graphic.attributes["标题"] + "'></div>" +
|
"<div class='lineDiv textAreaHeight'><h5>内容:</h5>" + "<textarea id='signContent' class='commonDiv'>" + graphic.attributes["内容"] + "</textarea></div>" +
|
"<button id='saveSign' class='infoBtn BtnLeft'>保存</button>" +
|
"<button id='deleContent' class='infoBtn BtnRight'>删除</button> ";
|
$('.contentPane').empty().append(aa);
|
}
|
});
|
},
|
//关闭功能--移除地图事件
|
removeMouseDragHandler: function (mapWidget) {
|
$("#mainMapWidget").unbind("mousedown");
|
SwipeObj._map.setInfoWindowOnClick(true);
|
}
|
});
|
return Widget;
|
});
|
