define([
|
"dojo",
|
"dojo/_base/declare",
|
"dojo/_base/lang",
|
"base/BaseWidget",
|
"dojo/text!widgets/home/template.html",
|
"widgets/home/config",
|
"iframe/jcyj/js/dataShow.js",
|
"base/AppEvent",
|
"base/ConfigData",
|
"dojo/dom",
|
"dojo/dom-construct",
|
"dojo/dom-attr",
|
"dojo/dom-style",
|
"dojo/on",
|
"esri/layers/ArcGISDynamicMapServiceLayer",
|
"esri/layers/ArcGISTiledMapServiceLayer",
|
"esri/layers/FeatureLayer",
|
"controls/tab/TabControl",
|
"esri/dijit/SymbolStyler",
|
"esri/styles/basic",
|
"dojo/_base/array",
|
"esri/InfoTemplate",
|
"esri/renderers/SimpleRenderer",
|
"esri/renderers/ClassBreaksRenderer",
|
"esri/renderers/UniqueValueRenderer",
|
"esri/symbols/PictureMarkerSymbol",
|
"dojo/domReady!"
|
], function (dojo,
|
declare,
|
lang,
|
BaseWidget,
|
template,
|
config,
|
AppEvent,
|
ConfigData,
|
dataShow,
|
dom,
|
domConstruct,
|
domAttr,
|
domStyle,
|
on,
|
ArcGISDynamicMapServiceLayer,
|
ArcGISTiledMapServiceLayer,
|
FeatureLayer,
|
TabControl,
|
SymbolStyler,
|
basic,
|
arrayUtils,
|
InfoTemplate,
|
SimpleRenderer,
|
ClassBreaksRenderer,
|
UniqueValueRenderer,
|
PictureMarkerSymbol) {
|
var imgDiv = [];
|
var vedioDiv = '';
|
var docuDiv = '';
|
var panoUrl = '';
|
var Widget = declare([BaseWidget], {
|
widgetName: "homeWidget",
|
label: "首页",
|
templateString: template,
|
_map: null,
|
_layers: [],
|
_styler: null,
|
_selectLayer: null,
|
homeObj: null,
|
treecheck: null,
|
treechecked: null,
|
_clicklayer: null,
|
_historyBack: null,
|
content: null,
|
constructor: function (options, srcRefNode) {
|
this._map = options.map;
|
},
|
postCreate: function () {
|
|
},
|
startup: function () {
|
homeObj = this;
|
homeObj.treecheck = [];
|
this._init();
|
this.inherited(arguments);
|
homeObj.totalily();
|
homeObj.thematicDiagramMove();
|
$('#rMenu').mouseleave(function () {
|
$('#rMenu').css({
|
"visibility": "hidden"
|
});
|
$('#Transparency').css({
|
"visibility": "hidden",
|
});
|
});
|
$('#Transparency').mouseleave(function (evt) {
|
$('#Transparency').css({
|
"visibility": "hidden",
|
});
|
});
|
$('#m_del').mouseover(function (evt) {
|
$('#Transparency').css({
|
"visibility": "visible",
|
});
|
$('#rangechange').val(homeObj._clicklayer.opacity);
|
});
|
$('#rangechange').change(function (evt) {
|
var zhi = $('#rangechange').val();
|
homeObj._setlayeropacity(zhi * 1);
|
});
|
|
// 绑定tab切换事件--点击切换状态并控制相应的tab标签显示
|
$('.tab-container li').click(function () {
|
var tabName = $(this).attr('data');
|
var containerName = tabName + '-container';
|
if (tabName && !$(this).hasClass('tab-selected')) {
|
$('.container-show').removeClass('container-show');
|
switch (tabName) {
|
case 'introduce':
|
$('.tab-selected img').attr('src', 'widgets/home/images/layer.png');
|
$('.tab-selected').removeClass('tab-selected');
|
$(this).children('img').attr('src', 'widgets/home/images/introduce-selected.png');
|
break;
|
case 'layer':
|
$('.tab-selected img').attr('src', 'widgets/home/images/introduce.png');
|
$('.tab-selected').removeClass('tab-selected');
|
$(this).children('img').attr('src', 'widgets/home/images/layer-selected.png');
|
break;
|
default:
|
break;
|
}
|
$(this).addClass('tab-selected');
|
$('.'+containerName).addClass('container-show');
|
}
|
});
|
AppEvent.addAppEventListener("clearall", lang.hitch(this, function (evt) {
|
if (evt.idname != "MapBrowseWidget") {
|
var treeObj = $.fn.zTree.getZTreeObj("mapBrowseTree");
|
var nodes = treeObj.getCheckedNodes();
|
for (var index in nodes) {
|
if (!nodes[index].isParent) {
|
if (nodes[index].checked) {
|
var nodeobj = nodes[index];
|
nodes[index].checkedOld = false;
|
homeObj._map.removeLayer(ConfigData.layers[nodes[index].tId]);
|
ConfigData.layers[nodes[index].tId] = null;
|
|
if (dojo.byId("all")) {
|
dojo.destroy("all");
|
dojo.destroy("bar_div");
|
}
|
}
|
}
|
}
|
homeObj._init();
|
}
|
}));
|
},
|
open: function () {
|
this.inherited(arguments);
|
},
|
close: function () {
|
this.inherited(arguments);
|
if (homeObj._styler){//摧毁样式弹窗
|
homeObj._styler.destroy();
|
homeObj._styler = null;
|
}
|
},
|
_init: function () {
|
var _ztreeObj = [];
|
// $.ajax({
|
// type: "get",
|
// url: getNativePath() + "resources/queryResourcesTree.do?soId=bbb7001c67c442540167c4a2a604000b",
|
// data: {
|
// "limit": 10000
|
// },
|
// dataType: "json",
|
// async: false,
|
// success: function (result) {
|
// var resultObj = result.data;
|
// for (var i = 0; i < resultObj.length; i++) {
|
// var searchCatalog = {};
|
// searchCatalog.id = resultObj[i].resourcesId;
|
// searchCatalog.pId = resultObj[i].resourcesPid;
|
// searchCatalog.name = resultObj[i].resourcesName;
|
// searchCatalog.Datatime = resultObj[i].resourcesData;
|
// searchCatalog.Url = resultObj[i].resourcesUrl;
|
// _ztreeObj.push(searchCatalog);
|
// }
|
// return _ztreeObj;
|
// },
|
// error: function (e) {
|
// console.log(e);
|
// alert("请求失败");
|
// }
|
// });
|
var setting = {
|
view: {
|
addHoverDom: homeObj.addHoverDom,
|
removeHoverDom: homeObj.removeHoverDom
|
},
|
check: {
|
enable: true
|
},
|
data: {
|
simpleData: {
|
enable: true
|
}
|
},
|
callback: {
|
beforeClick: homeObj._beforeClick,
|
onCheck: homeObj._zTreeOnCheck
|
}
|
};
|
ConfigData.treeNodes = _ztreeObj;//将目录树节点存入全局
|
$.fn.zTree.init($("#mapBrowseTree"), setting, _ztreeObj);
|
},
|
_beforeClick: function (treeId, treeNode) {
|
if (!treeNode.path && treeNode.isParent) {
|
var treeObj = $.fn.zTree.getZTreeObj(treeId);
|
treeObj.expandNode(treeNode, !treeNode.open, false, true, true);
|
}
|
return treeNode.path && !treeNode.isParent;
|
},
|
_zTreeOnCheck: function (event, treeId, treeNode) {
|
// 测试代码
|
if (treeNode.name.indexOf('监控点') != -1) {
|
AppEvent.dispatchAppEvent('popup', {
|
attributes: {
|
'生态监测': '鄱阳湖国家湿地公园',
|
'实时数据': '鄱阳湖国家湿地公园',
|
'全景': '鄱阳湖国家湿地公园',
|
'视频监控': '鄱阳湖国家湿地公园',
|
'历史数据': '鄱阳湖国家湿地公园',
|
'基本信息': '鄱阳湖国家湿地公园'
|
}
|
});
|
return;
|
}
|
|
//复选框选择事件
|
var treeObj = $.fn.zTree.getZTreeObj("mapBrowseTree");
|
var nodes = treeObj.getChangeCheckedNodes(); //状态改变的节点
|
for (var index in nodes) {
|
//筛选根节点
|
if (!nodes[index].isParent) {
|
//选中的节点
|
if (nodes[index].checked) {
|
nodes[index].checkedOld = true;
|
var nodeobj = nodes[index];
|
var layerobj = nodeobj.Url;
|
var template = new InfoTemplate();
|
template.setTitle(homeObj._getGraphicTitle);
|
template.setContent(homeObj._getTextContent);
|
var baseurl = layerobj.substring(0, layerobj.lastIndexOf('/'));
|
var i = layerobj.substring(layerobj.lastIndexOf('/') + 1, layerobj.length) * 1;
|
var selectLayer = new ArcGISDynamicMapServiceLayer(baseurl);
|
var templates = {};
|
templates[i] = {
|
infoTemplate: template
|
};
|
selectLayer.setInfoTemplates(templates);
|
selectLayer.setVisibleLayers([i]);
|
// var selectLayer = new FeatureLayer(layerobj, {infoTemplate: template, outFields: ['*']});
|
selectLayer.on("error", function (evt) {
|
var msg = evt.error.message;
|
alert(msg);
|
});
|
ConfigData.layers[nodeobj.tId] = selectLayer;
|
homeObj._map.addLayer(selectLayer);
|
} else {
|
nodes[index].checkedOld = false;
|
if (ConfigData.layers[nodes[index].tId]) {
|
homeObj._map.removeLayer(ConfigData.layers[nodes[index].tId]);
|
}
|
ConfigData.layers[nodes[index].tId] = null;
|
delete ConfigData.layers[nodes[index].tId];
|
}
|
}
|
}
|
},
|
_getGraphicTitle: function (graphic) {
|
var layer = graphic.getLayer();
|
if (layer.name.indexOf("城") != -1 && layer.name.indexOf("湿") != -1) {
|
var title = graphic.attributes[layer.displayField] + "第" + graphic.attributes["WETLAND_NO"] + "号湿地斑块";
|
} else {
|
var title = graphic.attributes[layer.displayField];
|
}
|
return title;
|
},
|
_getTextContent: function (graphic) {
|
homeObj.content = '';
|
var id = graphic.attributes.OBJECTID;
|
homeObj.content += "<div class='con'>";
|
var layer = graphic.getLayer();
|
var layerName = layer.name;
|
if (layerName.indexOf("省重要") != -1) {
|
panoUrl = graphic.attributes.URL;
|
} else {
|
panoUrl = '';
|
}
|
for (var a = 0; a < layer.fields.length; a++) {
|
var ming = layer.fields[a].name;
|
var ali = layer.fields[a].alias;
|
if (ali != "OBJECTID" && graphic.attributes[ming]) {
|
var regs = new RegExp("[\\u4E00-\\u9FFF]+", "g");
|
if (regs.test(ali) && ali.toLowerCase().indexOf("object") == -1 && ali.toLowerCase().indexOf("shape") == -1 && ali.indexOf("area") == -1 &&
|
ali.indexOf("AREA") == -1 && ali.indexOf("Area") == -1 && ali.indexOf("FID") == -1) {
|
homeObj.content += "<div>" + layer.fields[a].alias + ":<b>" + graphic.attributes[ming] + "</b></div>";
|
}
|
}
|
}
|
if (layer.hasAttachments) {
|
var attach = 0; //附件的个数
|
var vedio = 0; //视频个数
|
var docu = 0; //文件个数
|
//根据返回的数据判断是否添加相应的字段；
|
//console.log(layer.name);
|
layer.queryAttachmentInfos(id, function (result) {
|
// console.log(result);
|
imgDiv = [];
|
vedioDiv = '';
|
docuDiv = '';
|
for (var i = 0; i < result.length; i++) {
|
var type = result[i].contentType;
|
if (type.indexOf('image') != -1) {
|
imgDiv.push("<div class='swiper-slide' num=" + attach + "><img src='" + result[i].url + "'/></div>");
|
attach++;
|
} else if (type.indexOf('video') != -1) {
|
vedio++;
|
vedioDiv = "<video controls><source src='" + result[i].url + "' type='video/mp4'></video>";
|
} else if (type.indexOf('application') != -1) {
|
docu++;
|
docuDiv += "<a href='" + result[i].url + "' style='display:block' download='" + result[i].name + "'>" + result[i].name + "</a>";
|
}
|
}
|
$('.actionList').children('a:first').nextAll().remove(); //清除“缩放至”之后的所有元素
|
//判断相应的文件是否存在来添加相应的按钮
|
if (attach > 0) {
|
if (layerName.indexOf("公园") != -1) {
|
$('.actionList').append("<a title=\"图片\" class=\"action zoomTo img\" href=\"javascript:void(0);\"><span>附件</span></a>");
|
} else {
|
$('.actionList').append("<a title=\"图片\" class=\"action zoomTo img\" href=\"javascript:void(0);\"><span>图片</span></a>");
|
}
|
}
|
if (panoUrl.length > 0) {
|
$('.actionList').append("<a title=\"全景\" class=\"action zoomTo qj\" href=\"javascript:void(0);\"><span>全景</span></a>");
|
}
|
if (vedio > 0) {
|
$('.actionList').append("<a title=\"视频\" class=\"action zoomTo vedio\" href=\"javascript:void(0);\"><span>视频</span></a>");
|
}
|
if (docu > 0) {
|
$('.actionList').append("<a title=\"文件\" class=\"action zoomTo docu\" href=\"javascript:void(0);\"><span>文件</span></a>");
|
}
|
if (result.length > 0 || panoUrl.length > 0) {
|
$('.actionList').append("<a title=\"详细信息\" class=\"action zoomTo msg\" href=\"javascript:void(0);\"><span>详细信息</span></a>");
|
}
|
homeObj.content += "</div>";
|
//相应按钮的点击事件
|
homeObj._infowindowClick();
|
// return homeObj.content;
|
}, function (result) {
|
console.log(result);
|
});
|
} else {
|
$('.actionList').children('a:first').nextAll().remove(); //清除“缩放至”之后的所有元素
|
if (layer.name.indexOf("省重要") != -1 && panoUrl.length > 0) {
|
$('.actionList').append("<a title=\"全景\" class=\"action zoomTo qj\" href=\"javascript:void(0);\"><span>全景</span></a>");
|
$('.actionList').append("<a title=\"详细信息\" class=\"action zoomTo msg\" href=\"javascript:void(0);\"><span>详细信息</span></a>");
|
}
|
homeObj._infowindowClick();
|
}
|
return homeObj.content;
|
},
|
_infowindowClick: function () {
|
//先清除上次弹窗所绑定的事件，防止重复执行
|
$('.actionList .img').unbind();
|
$('.actionList .qj').unbind();
|
$('.actionList .vedio').unbind();
|
var html;
|
var timer = setTimeout(function () {
|
html = $('.contentPane .con').html();
|
}, 500); //将记录界面重新写入;
|
//“图片”点击事件
|
$('.actionList .img').click(function () {
|
var inner = "<div class = 'swiper-wrapper'>" + imgDiv[0] + "</div>";
|
$('.contentPane .con').html(inner);
|
if ($(".titlePane [title = '恢复']").attr("title") == "恢复") {
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide img').css("width", "auto"); //用于控制图片的宽度
|
$('.swiper-wrapper .swiper-slide img').smartZoom({
|
"containerClass": "zoomContainer"
|
});
|
} else {
|
$('.swiper-wrapper .swiper-slide img').css("width", $('.contentPane').css("width")); //用于控制图片的宽度
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
}
|
//图片的切换功能，
|
var nums = imgDiv.length;
|
if (nums > 1) {
|
Btns = "<img src='images/nextBtn.jpg' class='nextBtn'><img src='images/prevBtn.jpg' class='prevBtn'>";
|
$('.contentPane .con').append(Btns);
|
$('.nextBtn').click(function () {
|
var num;
|
num = parseInt($('.swiper-wrapper .swiper-slide').attr('num'));
|
if (num == nums - 1) {
|
num = 0;
|
} else {
|
num++;
|
}
|
;
|
if ($(".titlePane [title = '恢复']").attr("title") == "恢复") {
|
$('.contentPane .con .swiper-slide').remove();
|
$('.contentPane .con .swiper-wrapper').append(imgDiv[num]);
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide img').css("width", "auto"); //用于控制图片的宽度
|
$('.swiper-wrapper .swiper-slide img').smartZoom({
|
"containerClass": "zoomContainer"
|
});
|
} else {
|
$('.contentPane .con .swiper-slide').remove();
|
$('.contentPane .con .swiper-wrapper').append(imgDiv[num]);
|
$('.swiper-wrapper .swiper-slide img').css("width", $('.contentPane').css("width")); //用于控制图片的宽度
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
}
|
});
|
$('.prevBtn').click(function () {
|
var num;
|
num = parseInt($('.swiper-wrapper .swiper-slide').attr('num'));
|
if (num == 0) {
|
num = nums - 1;
|
} else {
|
num--;
|
}
|
;
|
if ($(".titlePane [title = '恢复']").attr("title") == "恢复") {
|
$('.contentPane .con .swiper-slide').remove();
|
$('.contentPane .con .swiper-wrapper').append(imgDiv[num]);
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide img').css("width", "auto"); //用于控制图片的宽度
|
$('.swiper-wrapper .swiper-slide img').smartZoom({
|
"containerClass": "zoomContainer"
|
});
|
} else {
|
$('.contentPane .con .swiper-slide').remove();
|
$('.contentPane .con .swiper-wrapper').append(imgDiv[num]);
|
$('.swiper-wrapper .swiper-slide img').css("width", $('.contentPane').css("width")); //用于控制图片的宽度
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
}
|
});
|
}
|
});
|
//文档点击事件
|
$('.actionList .docu').click(function () {
|
$('.contentPane .con').html('');
|
$('.contentPane .con').html(docuDiv);
|
});
|
//“全景”点击事件
|
$('.actionList .qj').click(function () {
|
if ($('.contentPane iframe').css('display') != "block" && $('.contentPane img').length == 0 && $('.contentPane video').length == 0) {
|
html = $('.contentPane .con').html(); //记录现有界面
|
}
|
$('.contentPane .con').empty();
|
$('.contentPane .con').append("<iframe name=\"i\" src=" + panoUrl + "></iframe>");
|
$('.contentPane .con iframe').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
});
|
//“视频”点击事件
|
$('.actionList .vedio').click(function () {
|
$('.contentPane .con').html(vedioDiv);
|
$('.contentPane .con video').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
});
|
//“详细信息”点击事件，点击返回属性页
|
$('.actionList .msg').click(function () { //返回按钮点击事件
|
$('.contentPane .con').html(html); //将记录界面重新写入
|
});
|
//关闭按钮点击事件
|
$(".close").click(function () {
|
if ($(".con").children("iframe").length > 0) {
|
$(".con").text('');
|
}
|
});
|
//“最大化按钮”点击事件，点击改变信息框样式
|
$('.titlePane .maximize').unbind().click(function () {
|
setTimeout(function () {
|
console.log($('.swiper-wrapper .swiper-slide').length);
|
if ($(".titlePane [title = '恢复']").attr("title") == "恢复" && $('.swiper-wrapper .swiper-slide').length > 0) {
|
var num = parseInt($('.swiper-wrapper .swiper-slide').attr('num'));
|
$('.contentPane .con .swiper-slide').remove();
|
$('.contentPane .con .swiper-wrapper').append(imgDiv[num]);
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
$('.swiper-wrapper .swiper-slide img').css("width", "auto"); //用于控制图片的宽度
|
$('.swiper-wrapper .swiper-slide img').smartZoom({
|
"containerClass": "zoomContainer"
|
});
|
} else {
|
var num = parseInt($('.swiper-wrapper .swiper-slide').attr('num'));
|
$('.contentPane .con .swiper-slide').remove();
|
$('.contentPane .con .swiper-wrapper').append(imgDiv[num]);
|
$('.swiper-wrapper .swiper-slide img').css("width", $('.contentPane').css("width")); //用于控制图片的宽度
|
$('.swiper-wrapper , .swiper-slide').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
$('.swiper-wrapper .swiper-slide div').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
$('.contentPane .con iframe').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
}
|
if ($(".titlePane [title = '恢复']").attr("title") == "恢复") {
|
$('.contentPane .con iframe').css({
|
"width": $('.contentPane').css("width"),
|
"height": $('.contentPane').css("height")
|
});
|
} else {
|
$('.contentPane .con iframe').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
}
|
$('.contentPane .con video').css({
|
"width": $('.contentPane').css("width"),
|
"height": "auto"
|
});
|
}, 100);
|
});
|
},
|
//ztree添加自定义图标
|
addHoverDom: function (treeId, treeNode) {
|
// debugger
|
if ($("#diyBtn_" + treeNode.id).length > 0 || treeNode.isParent) {
|
return;
|
}
|
|
var aObj = $("#" + treeNode.tId + "_a");
|
var editStr = "<span id='diyBtn_space_" + treeNode.id + "' > </span>"
|
+ "<button type='button' class='diyBtn1' id='diyBtn_" + treeNode.id
|
+ "' title='打开编辑' onfocus='this.blur();'></button>";
|
aObj.append(editStr);
|
var btn = $("#diyBtn_" + treeNode.id);
|
if (btn) {
|
btn.on("click", function () {
|
//根据节点生成featrueLayer替换原来的dynamicLayer
|
var layerobj = treeNode.Url;
|
var template = new InfoTemplate();
|
template.setTitle(homeObj._getGraphicTitle);
|
template.setContent(homeObj._getTextContent);
|
var selectLayer = new FeatureLayer(layerobj, {infoTemplate: template, outFields: ['*'],mode: FeatureLayer.MODE_ONDEMAND,displayOnPan:false});
|
selectLayer.on("error", function (evt) {
|
var msg = evt.error.message;
|
alert(msg);
|
});
|
//先移除地图上原有的动态图层，在将新图层添加上去，并替换configData里的图层
|
homeObj._map.removeLayer(ConfigData.layers[treeNode.tId]);
|
homeObj._map.addLayer(selectLayer);
|
ConfigData.layers[treeNode.tId] = selectLayer;
|
selectLayer.on('load',function (e) {
|
var selectedLayer = e.layer;
|
//点击设置，需要再次获取图层所有符号，因为可能更换过，而不是用初始符号
|
var symbols1 = [];
|
var renderer = selectedLayer.renderer;
|
if (renderer instanceof SimpleRenderer) {
|
symbols1[0] = {
|
label: selectedLayer.name,
|
symbol: renderer.symbol
|
};
|
} else if (renderer instanceof ClassBreaksRenderer) {
|
symbols1 = arrayUtils.map(renderer.infos, function (info) {
|
return {
|
label: info.value,
|
symbol: info.symbol
|
};
|
});
|
} else if (renderer instanceof UniqueValueRenderer) {
|
symbols1 = arrayUtils.map(renderer.infos, function (info) {
|
return {
|
label: info.value,
|
symbol: info.symbol
|
};
|
});
|
}
|
//调用自定义图层样式函数
|
homeObj._openSymbolStyler(selectedLayer, symbols1, 0,treeNode);
|
})
|
});
|
}
|
},
|
removeHoverDom: function (treeId, treeNode) {
|
$("#diyBtn_" + treeNode.id).unbind().remove();
|
$("#diyBtn_space_" + treeNode.id).unbind().remove();
|
},
|
//打开符号设置部件，参数说明，checkedLayer选中的图层，symbols图层符号数组，index符号索引。注意不能一次只能针对一个符号修改
|
_openSymbolStyler: function (checkedLayer, symbols, index,treeNode) {
|
homeObj._selectLayer = checkedLayer;
|
var defaultSymbol = symbols[index].symbol;
|
//判断是否为点图层
|
if (homeObj._selectLayer.geometryType != "esriGeometryPoint") {
|
if (homeObj._styler) {
|
|
} else {
|
// if(homeObj._selectLayer.geometryType != "esriGeometryPoint"){
|
|
// 销毁上次生成的节点，防止重复注册
|
// homeObj._styler.destroy();
|
// domConstruct.destroy("applySymboldiv");
|
// domConstruct.destroy("styler");
|
domConstruct.create('div', {
|
id: 'styler',
|
style: 'display:none'
|
}, 'editor');
|
var applySymboldiv = domConstruct.create("div", {
|
id: "applySymboldiv",
|
class: "options-panel"
|
});
|
|
domConstruct.place(applySymboldiv, "styler");
|
|
var applySymbolButton = domConstruct.create("input", {
|
type: "button",
|
value: "使用符号"
|
}, applySymboldiv);
|
var canelSymbolButton = domConstruct.create("input", {
|
type: "button",
|
value: "取消使用"
|
}, applySymboldiv);
|
|
on(applySymbolButton, "click", lang.hitch(applySymbolButton, function (a, evt) {
|
var style = homeObj._styler.getStyle();
|
|
if (homeObj._selectLayer.renderer instanceof SimpleRenderer) {
|
homeObj._selectLayer.renderer.symbol = style.symbol;
|
} else if (homeObj._selectLayer.renderer instanceof ClassBreaksRenderer) {
|
homeObj._selectLayer.renderer.infos[a].symbol = style.symbol;
|
} else if (homeObj._selectLayer.renderer instanceof UniqueValueRenderer) {
|
homeObj._selectLayer.renderer.infos[a].symbol = style.symbol;
|
} else {
|
|
}
|
homeObj._selectLayer.id = homeObj._selectLayer.name;
|
homeObj._selectLayer.refresh();
|
domStyle.set("styler", "display", "none");
|
}, index));
|
|
on(canelSymbolButton, "click", lang.hitch(homeObj, function (evt) {
|
domStyle.set("styler", "display", "none");
|
}));
|
|
//Create instance of SymbolStyler and pass in the domNode，注意跨域会读取不到符号数据，需同源
|
homeObj._styler = new SymbolStyler({
|
portalUrl: ''
|
}, "styler");
|
//Must call startup
|
homeObj._styler.startup();
|
}
|
homeObj._styler.edit(defaultSymbol, homeObj._getStylerOptions(defaultSymbol));
|
$("#styler").show();
|
$("#point_styler").hide();
|
} else {
|
//自定义点图层样式修改窗体--目前只针对于SimpleRenderer
|
// console.log(homeObj._selectLayer.renderer.symbol);
|
$("#styler").hide();
|
//为table标签中添加子候选项---即icon列表，并添加点击事件
|
$("#icon_table").empty();
|
var table_row = ["black", "blue", "green", "red", "yellow"];
|
var arr_td = [];
|
//获取项目根目录当前所在地址
|
var baseUrl = getIndexUrl("/wetlandmap");
|
for (var x in table_row) {
|
for (var y = 1; y < 32; y++) {
|
arr_td.push("" + baseUrl + "<td><img src=" + table_row[x] + "'/widgets/index/images/icon//.png'/" + table_row[x] + y + "></td>" + "");
|
}
|
}
|
$("#icon_table").append("<tr ></tr>");
|
var td_num = 0;
|
for (var z in arr_td) {
|
if (td_num > 5) {
|
$("#icon_table").append("<tr ></tr>");
|
td_num = 0;
|
}
|
$("#icon_table tr:last").append(arr_td[z]);
|
td_num++;
|
}
|
$("#icon_table").unbind("click").click(function (evt) {
|
$("#icon_table img").removeClass("on_selected_td");
|
if (evt.target.localName == "img") {
|
$(evt.target).addClass("on_selected_td");
|
$("#original_img").attr("src", $("#icon_table .on_selected_td").attr("src"));
|
}
|
});
|
//为使用图像按钮添加点击事件,并为图像输入框添加change事件
|
$("#custom_img a").unbind("click").click(function () {
|
$("#custom_img input").toggle();
|
});
|
$("#custom_img input").change(function () {
|
$("#original_img").attr("src", $("#custom_img input").val());
|
var val = parseFloat($("#px_value").val());
|
$("#original_img").css("height", val + "px");
|
});
|
//像素值输入栏加减按钮添加点击事件,及输入框输入事件
|
$("#value_add").unbind("click").click(function () {
|
var val = parseFloat($("#px_value").val()) + 1;
|
$("#px_value").val(val);
|
$("#original_img").css("height", val + "px");
|
});
|
$("#value_dec").unbind("click").click(function () {
|
var val = parseFloat($("#px_value").val()) - 1;
|
$("#px_value").val(val);
|
$("#original_img").css("height", val + "px");
|
});
|
$("#px_value").unbind("change").change(function () {
|
var val = parseFloat($("#px_value").val());
|
$("#original_img").css("height", val + "px");
|
});
|
|
//添加确定和取消按钮并为其添加点击事件
|
domConstruct.destroy("applySymboldiv1");
|
|
var applySymboldiv1 = domConstruct.create("div", {
|
id: "applySymboldiv1",
|
class: "options-panel"
|
});
|
|
domConstruct.place(applySymboldiv1, "point_styler");
|
|
var applySymbolButton1 = domConstruct.create("input", {
|
type: "button",
|
value: "使用符号"
|
}, applySymboldiv1);
|
var canelSymbolButton1 = domConstruct.create("input", {
|
type: "button",
|
value: "取消使用"
|
}, applySymboldiv1);
|
|
on(applySymbolButton1, "click", lang.hitch(applySymbolButton1, function (a, evt) {
|
var imgsrc = null;
|
if ($("#custom_img input").is(":hidden") == false && $.trim($("#custom_img input").val())) {
|
imgsrc = $("#custom_img input").val();
|
} else if ($.trim($("#icon_table .on_selected_td").attr("src"))) {
|
imgsrc = $("#icon_table .on_selected_td").attr("src");
|
} else {
|
var persent = parseFloat(homeObj._selectLayer.renderer.symbol.width) / parseFloat(homeObj._selectLayer.renderer.symbol.height);
|
homeObj._selectLayer.renderer.symbol.height = $("#px_value").val();
|
homeObj._selectLayer.renderer.symbol.width = parseFloat($("#px_value").val()) * persent;
|
}
|
if (imgsrc) {
|
var icon_size = $("#px_value").val();
|
if (homeObj._selectLayer.renderer instanceof SimpleRenderer) {
|
var select_symbol = new PictureMarkerSymbol(imgsrc, icon_size, icon_size);
|
homeObj._selectLayer.renderer.symbol = select_symbol;
|
} else if (homeObj._selectLayer.renderer instanceof ClassBreaksRenderer) {
|
// homeObj._selectLayer.renderer.infos[a].symbol = style.symbol;
|
} else if (homeObj._selectLayer.renderer instanceof UniqueValueRenderer) {
|
// homeObj._selectLayer.renderer.infos[a].symbol = style.symbol;
|
} else {
|
|
}
|
}
|
//刷新图层，并隐藏窗口
|
homeObj._selectLayer.id = homeObj._selectLayer.name;
|
homeObj._selectLayer.refresh();
|
domStyle.set("point_styler", "display", "none");
|
$("#original_img").css("height", "24px");
|
}, index));
|
|
on(canelSymbolButton1, "click", lang.hitch(this, function (evt) {
|
domStyle.set("point_styler", "display", "none");
|
$("#original_img").css("height", "24px");
|
}));
|
$("#point_styler").addClass("esriSymbolStyler");
|
$("#point_styler #original_img").attr("src", homeObj._selectLayer.renderer.symbol.url);
|
$("#point_styler #original_img").css("height", homeObj._selectLayer.renderer.symbol.height + "px");
|
$("#px_value").val(homeObj._selectLayer.renderer.symbol.height);
|
$("#point_styler").show();
|
}
|
},
|
_getStylerOptions: function (symbol) {
|
var styleModule = basic;
|
return {
|
schemes: styleModule.getSchemes({
|
theme: "default",
|
basemap: "topo",
|
geometryType: homeObj._getGeometryType(symbol)
|
})
|
}
|
|
},
|
_getGeometryType: function (symbol) {
|
var type = symbol.type;
|
return type === "picturefillsymbol" || type === "simplefillsymbol" ? "polygon" :
|
type === "cartographiclinesymbol" || type === "simplelinesymbol" ? "line" :
|
"point";
|
},
|
//专题图点击和缩放
|
totalily: function () {
|
$(".fenbu-img div").mousemove(function () {
|
$(this).css({"z-index": "10", "margin-top": "-10px", "cursor": "pointer"})
|
}).mouseout(function () {
|
$(this).css({"z-index": "", "margin-top": "0"})
|
});
|
$(".fenbu-img div img").click(function (e) {
|
$(".Bigimgs").show()
|
$("#oimg").css({"width": "620px", "height": "887.15px"})
|
$("#oimg").attr("src", $(this).attr("bgpic"))
|
var wid = ($(".Bigimgs").width() - 720) / 2 + "px"
|
$(".ims").css("left", wid)
|
// homeObj.addText(e); //此句的作用是把参数e传给本文第159行的函数，使其可以获得专题图的名称
|
});
|
$(".colses").click(function () {
|
$(".Bigimgs").hide()
|
});
|
//图片拖拽
|
var $div_img = $(".ims");
|
//绑定鼠标左键按住事件
|
$div_img.bind("mousedown", function (event) {
|
|
event.preventDefault && event.preventDefault(); //去掉图片拖动响应
|
//获取需要拖动节点的坐标
|
var offset_x = $(this)[0].offsetLeft;//x坐标
|
var offset_y = $(this)[0].offsetTop;//y坐标
|
//获取当前鼠标的坐标
|
var mouse_x = event.pageX;
|
var mouse_y = event.pageY;
|
//绑定拖动事件
|
//由于拖动时，可能鼠标会移出元素，所以应该使用全局（document）元素
|
$(".ims").bind("mousemove", function (ev) {
|
// 计算鼠标移动了的位置
|
var _x = ev.pageX - mouse_x;
|
var _y = ev.pageY - mouse_y;
|
//设置移动后的元素坐标
|
var now_x = (offset_x + _x) + "px";
|
var now_y = (offset_y + _y) + "px";
|
//改变目标元素的位置
|
$div_img.css({
|
top: now_y,
|
left: now_x
|
});
|
});
|
});
|
//当鼠标左键松开，接触事件绑定
|
$(".ims").bind("mouseup", function () {
|
$(this).unbind("mousemove");
|
});
|
|
// 图片放大缩小
|
var img1 = document.getElementById("oimg");
|
|
function getsize(obj, att) {
|
if (document.all) {
|
return obj.currentStyle[att];
|
}
|
else {
|
return getComputedStyle(obj, att)[att];
|
}
|
}
|
|
//火狐和IE兼容的获得鼠标滚轮信息
|
if (img1.addEventListener) {
|
img1.onmousewheel = scrollfun;
|
img1.addEventListener("DOMMouseScroll", scrollfun, false);
|
}
|
|
function scrollfun(e) {
|
var ev = e || window.event;//兼容分别为IE和火狐
|
var num = ev.wheelDelta || ev.detail;//兼容分别为IE和火狐
|
if ((num == -3 || num == 120) && img1.offsetWidth < 3000) {
|
img1.style.width = (img1.offsetWidth) * 1.2 + "px";
|
img1.style.height = (img1.offsetHeight) * 1.2 + "px";
|
}
|
else if ((num == 3 || num == -120) && img1.offsetWidth > 60) {
|
img1.style.width = (img1.offsetWidth) / 1.2 + "px";
|
img1.style.height = (img1.offsetHeight) / 1.2 + "px";
|
}
|
}
|
|
// console.log($("#MapBrowseWidget").height()-490+"px")
|
// $(".zhuantitu").height($("#MapBrowseWidget").height() - $("#sdjj").height() - $("#ztgh").height() - $("#jczd").height() - 100 + "px");
|
},
|
//↓↓↓鼠标移动到专题图栏左右两个箭头，专题图自动向左或向右滚动↓↓↓
|
thematicDiagramMove: function () {
|
// 鼠标移动函数
|
var left = 0;
|
var current = +new Date;
|
var previous = +new Date;
|
var param = 1; // 方向
|
var speed = 0.12;
|
var autoMove;
|
var max_left = ($(".fenbu-img div").length - 1) * 30 + $(".img-responsive").eq(0).width() - $(".fenbu-img").width();
|
|
function loop() {
|
var current = +new Date;
|
var dt = current - previous;
|
previous = current;
|
update(dt);
|
draw();
|
// console.log(1122222222222222);
|
}
|
|
function update(dt) {
|
var max_left = ($(".fenbu-img div").length - 1) * 30 + $(".img-responsive").eq(0).width() - $(".fenbu-img").width();
|
left += param * (dt * speed);
|
if (left < max_left * -1 && param < 0) {
|
left = max_left * -1;
|
} else if (left > 0 && param > 0) {
|
left = 0;
|
}
|
}
|
|
function draw() {
|
$(".fenbu-img ").css({"left": left + "px"})
|
}
|
|
function StartMove(direction, _speed) {
|
current = +new Date;
|
previous = +new Date;
|
param = direction;
|
speed = _speed;
|
autoMove = setInterval(loop, 1000 / 60);
|
}
|
|
function PauseMove() {
|
clearInterval(autoMove);
|
}
|
|
//向左移动
|
$(".myPrevBtn").mouseenter(function () {
|
StartMove(1, 0.07);
|
}).mouseout(function () {
|
PauseMove();
|
}).mousedown(function () {
|
PauseMove();
|
StartMove(1, 0.07);
|
}).mouseup(function () {
|
PauseMove();
|
});
|
//向右移动
|
$("span.myNextBtn").mouseenter(function () {
|
StartMove(-1, 0.07);
|
}).mouseout(function () {
|
PauseMove();
|
}).mousedown(function () {
|
PauseMove();
|
StartMove(-1, 0.07);
|
}).mouseup(function () {
|
PauseMove();
|
});
|
}
|
});
|
return Widget;
|
});
|
