define([
"dojo",
"dojo/_base/declare",
"dojo/_base/lang",
"base/BaseWidget",
"dojo/text!widgets/Statistics/template.html",
"widgets/Statistics/config",
"base/AppEvent",
"base/ConfigData",
"dojo/dom",
"dojo/dom-construct",
"dojo/dom-attr",
"dojo/dom-style",
"dojo/on",
"dojo/_base/array",
"esri/tasks/query",
"esri/tasks/QueryTask",
"esri/symbols/SimpleFillSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/symbols/CartographicLineSymbol",
"esri/graphic",
"esri/Color",
"esri/toolbars/draw",
"esri/tasks/StatisticDefinition",
"dojo/domReady!"
], function (dojo,
declare,
lang,
BaseWidget,
template,
config,
AppEvent,
ConfigData,
dom,
domConstruct,
domAttr,
domStyle,
on,
arrayUtils,
Query,
QueryTask,
SimpleFillSymbol,
SimpleLineSymbol,
CartographicLineSymbol,
Graphic,
Color,
draw,
StatisticDefinition) {
var Widget = declare([BaseWidget], {
widgetName: "StatisticsWidget",
label: "统计分析",
templateString: template,
_map: null,
statisticsArea: null,
loading: false,
statisticsCondition: null,
statisticsData: null,
_layui: null,
constructor: function (options, srcRefNode) {
this._map = options.map;
StatisticsObj = this;
$(window).resize(function () {
setTimeout(function () {
if ($('#statistics-extent').is(':visible')) {
var maxheight = $('#tabcontainer').height() - 345;
$('.statistics-details').css('height', maxheight);
$(".statistics-details").mCustomScrollbar("update"); //更新滚动条
} else {
var maxheight = $('#tabcontainer').height() - 250;
$('.statistics-details').css('height', maxheight);
$(".statistics-details").mCustomScrollbar("update"); //更新滚动条
}
}, 500);
});
//初始化layui弹窗
layui.use('layer', function () {
StatisticsObj._layui = layui.layer;
});
},
postCreate: function () {
},
startup: function () {
this.inherited(arguments);
//初始化图层目录树
StatisticsObj._getservices();
// 运行右侧统计部件,和统计详情展示部件
AppEvent.dispatchAppEvent(AppEvent.RUN_WIDGET, "echartsWidget");
// AppEvent.dispatchAppEvent(AppEvent.RUN_WIDGET, "detailsWidget");
//绑定右侧选择栏选择事件,并派发开始统计方法
StatisticsObj.appendEventHandlers();
},
open: function () {
var maxheight = $('#tabcontainer').height() - 345;
$('.statistics-details').css('height', maxheight);
this.inherited(arguments);
},
_getservices: function () {
//动态构建图层目录树
var ztreeObj = [];
var statistcsLayerName = [];
for (var configKey in config.statistics) {
statistcsLayerName.push(configKey);
}
var resultObj = config.treeData;
for (var i = 0; i < resultObj.length; i++) {
if (resultObj[i].resourcesPid == 0 || statistcsLayerName.indexOf(resultObj[i].resourcesName) != -1) {
var searchCatalog = {};
searchCatalog.id = resultObj[i].resourcesId;
searchCatalog.pId = resultObj[i].resourcesPid;
searchCatalog.name = resultObj[i].resourcesName;
searchCatalog.path = resultObj[i].resourcesUrl;
ztreeObj.push(searchCatalog);
}
}
var setting = {
check: {
enable: false,
},
data: {
simpleData: {
enable: true
}
},
callback: {
onClick: StatisticsObj._zTreeOnClick,
beforeClick: StatisticsObj._beforeClick
}
};
$.fn.zTree.init($("#statisticsTree"), 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;
},
_zTreeOnClick: function (event, treeId, treeNode) {
//目录树点击事件
if (treeNode.path != undefined && treeNode.path != null && treeNode.path != "") {
// 获取目录树相关属性,填充到input栏
$('.statistics-layer-input').val(treeNode.name);
$('.statistics-layer-input').attr('data', treeNode.path);
// 动态获取统计单元配置
StatisticsObj.getStatisticsCondition(treeNode.name);
//关闭选择框
$(".statistics-tree-box").fadeOut(1);
}
},
getStatisticsCondition: function (e) {// 动态获取统计单元配置
for (var statisticsKey in config.statistics) {// 动态获取统计配置
if (e.indexOf(statisticsKey) != -1) {
StatisticsObj.statisticsCondition = config.statistics[statisticsKey];
break;
}
}
//添加对应统计单元
// var optionStr = '';
var optionStr = '';
StatisticsObj.statisticsCondition.condition.map(function (value, index) {
if (value) {
optionStr += '';
}
});
$('#statistics-condition').html(optionStr);
//根据第一项判断是否显示范围选择栏
if (StatisticsObj.statisticsCondition.condition[0] == '行政区') {
$("#statistics-extent").hide();
$("#statistics-city option:first").attr('selected', true);
$("#statistics-county option:first").attr('selected', true);
setTimeout(function () {
var maxheight = $('#tabcontainer').height() - 250;
$('.statistics-details').css('height', maxheight);
$(".statistics-details").mCustomScrollbar("update"); //更新滚动条
}, 200);
} else {
$("#statistics-extent").show();
var maxheight = $('#tabcontainer').height() - 345;
$('.statistics-details').css('height', maxheight);
$(".statistics-details").mCustomScrollbar("update"); //更新滚动条
}
},
getFeaturesIds: function (url) {//先获取所有要素的OID
$("#bg").show();
$.get(url + '?f=pjson', function (e) {
var displayField = JSON.parse(e).displayField;
var statisType = $('#statistics-condition option:selected').attr('data');
AppEvent.dispatchAppEvent("clearcolor");
if ($('#bg').is(":hidden")) $('#bg').show();
var queryTask = new QueryTask(url);
//统计湿地个数
var queryCount = new Query();
queryCount.where = $('#statistics-county').val() != '县区/全市' ? "COUNTY LIKE '" + $('#statistics-county').val() + "'" :
$("#statistics-city").val() != '市/全省' ? "CITY LIKE '" + $('#statistics-city').val() + "'" : '1=1';
if (StatisticsObj.statisticsArea) {//添加查询范围
queryCount.geometry = StatisticsObj.statisticsArea;
queryCount.where = '1=1';//有自定义范围时,将where设为查询所有
}
queryCount.outFields = [displayField, statisType];
queryCount.returnGeometry = false;
queryTask.execute(queryCount, lang.hitch(this, function (result) {
var resultCount = {};
var resultFeature = {};
var datas = result.features;
for (var dictionaryKey in config.dictionary) {//判断是否包括需要字典转换的属性,包括的话直接进行转换
datas.map(function (value) {
if (value.attributes.hasOwnProperty(dictionaryKey)) {
value.attributes[dictionaryKey] = config.dictionary[dictionaryKey][value.attributes[dictionaryKey]];
return;
}
});
}
datas.map(function (value) {
if (resultFeature.hasOwnProperty(value.attributes[statisType])) {
resultFeature[value.attributes[statisType]].push(value.attributes[displayField]);
} else {
resultFeature[value.attributes[statisType]] = [value.attributes[displayField]];
}
});
for (var resultFeatureKey in resultFeature) {
resultCount[resultFeatureKey] = 0;
resultFeature[resultFeatureKey].map(function (item, index) {
if (resultFeature[resultFeatureKey].indexOf(item) === index) {
resultCount[resultFeatureKey]++;
}
});
}
//统计其他信息
var query = new Query();
query.where = $('#statistics-county').val() != '县区/全市' ? "COUNTY LIKE '" + $('#statistics-county').val() + "'" :
$("#statistics-city").val() != '市/全省' ? "CITY LIKE '" + $('#statistics-city').val() + "'" : '1=1';
if (StatisticsObj.statisticsArea) {//添加查询范围
query.geometry = StatisticsObj.statisticsArea;
query.where = '1=1';//有自定义范围时,将where设为查询所有
}
//添加统计参数
var statDefs = [];
for (var itemKey in StatisticsObj.statisticsCondition.item) {
var StatDef = new StatisticDefinition();
if (StatisticsObj.statisticsCondition.item[itemKey] == '湿地个数') {
StatDef.statisticType = "count";
StatDef.onStatisticField = displayField;
StatDef.outStatisticFieldName = "湿地个数";
} else {
StatDef.statisticType = "sum";
StatDef.onStatisticField = StatisticsObj.statisticsCondition.itemFields[itemKey];
StatDef.outStatisticFieldName = StatisticsObj.statisticsCondition.item[itemKey];
}
statDefs.push(StatDef);
}
query.returnGeometry = false;
query.groupByFieldsForStatistics = [statisType];
query.outStatistics = statDefs;
queryTask.execute(query, function (results) {
if (results.features.length > 0) {
var data = results.features;
for (var dictionaryKey in config.dictionary) {//判断是否包括需要字典转换的属性,包括的话直接进行转换
data.map(function (value) {
if (value.attributes.hasOwnProperty(dictionaryKey)) {
value.attributes[dictionaryKey] = config.dictionary[dictionaryKey][value.attributes[dictionaryKey]];
return;
}
});
}
//构造左下方概览列表
var detailsStr = '';
for (var dataKey in data) {
detailsStr += '
' +
'' + $('#statistics-condition').val() + ':' +
data[dataKey].attributes[statisType] + '
';
data[dataKey].attributes['湿地个数'] = resultCount[data[dataKey].attributes[statisType]];
for (var attributesKey in data[dataKey].attributes) {
if (attributesKey != statisType) {
var unit = attributesKey == '湿地个数' ? '(个)' : '(公顷)';
var statisValue = attributesKey == '湿地个数' ? data[dataKey].attributes[attributesKey] : Number(data[dataKey].attributes[attributesKey]).toFixed(2)
detailsStr += '' + attributesKey + ':' +
statisValue + unit + '
';
}
}
detailsStr += '';
}
//展开统计列表
$("#echartsWidget").height('100%');
$("#below_bar").show();
StatisticsObj.statisticsData = data;
//传递数据构造统计图
AppEvent.dispatchAppEvent("menuclick", {
name: $('.statistics-layer-input').val(),
url: $('.statistics-layer-input').attr('data'),
data: StatisticsObj.statisticsData
});
//加载自定义滚动条
$(".statistics-details").mCustomScrollbar("destroy"); //清除滚动条
$('.statistics-details').html(detailsStr);
$('.statistics-results').show();
$(".statistics-details").mCustomScrollbar({
scrollButtons: {
enable: true, //是否添加 滚动条两端按钮支持 值:true,false
scrollType: "continuous", //滚动按钮滚动类型 值:”continuous”(当你点击滚动控制按钮时断断续续滚动) “pixels”(根据每次点击的像素数来滚动)
scrollSpeed: 50, //设置点击滚动按钮时候的滚动速度(默认 20)
scrollAmount: 60 //设置点击滚动按钮时候每次滚动的数值 像素单位 默认 40像素
},
autoHideScrollbar: true,
horizontalScroll: false, //是否创建一个水平滚动条 默认是垂直滚动条
set_width: false, //:设置你内容的宽度 值可以是像素或者百分比
set_height: false, //:设置你内容的高度 值可以是像素或者百分比
mouseWheel: true, //鼠标滚动的支持 值为:true.false
});
//统计列表点击事件
$('.statistics-details li').unbind().click(function (e) {
AppEvent.dispatchAppEvent('showDetails', {
name: $('.statistics-layer-input').val(),
url: $('.statistics-layer-input').attr('data'),
conditionValue: $(this).children('h3').text().split(':')[1],
statisticsArea: StatisticsObj.statisticsArea,
statisticsCondition: StatisticsObj.statisticsCondition,
});
});
$('#bg').hide();
} else {
$(".statistics-details").mCustomScrollbar("destroy"); //清除滚动条
$('.statistics-details').html('无统计结果
');
$('.statistics-results').show();
$('#bg').hide();
}
}, function (er) {
console.log(er);
$(".statistics-details").mCustomScrollbar("destroy"); //清除滚动条
$('.statistics-details').html('统计出错,请稍后重试
');
$('.statistics-results').show();
$('#bg').hide();
});
}));
});
},
// getFeatures: function (url, ids) {//根据要素的OID要素填充到列表中
// //获取当前图层的displayfield
// $.get(url + '?f=pjson', function (e) {
// StatisticsObj.loading = true;
// var displayField = JSON.parse(e).displayField;
// //根据要素的OID列表查询要素详细信息
// var ids = ids;
// var queryTask = new QueryTask(url);
// var query = new Query();
// query.returnGeometry = false;
// query.outFields = ['OBJECTID', displayField, StatisticsObj.statisticsCondition.cityFields[0]];
// if ($('.statistics-layer-input').val().indexOf('城') != -1) {//城区湿地图层要多输出一个字段
// query.outFields.push("WETLAND_NO");
// }
// query.objectIds = ids;
// queryTask.execute(query, function (data) {
// var data = data.features;
// var detailsStr = '';
// if ($('.statistics-layer-input').val().indexOf('城') != -1) {//城区湿地图层显示的名称要组装一下
// for (var dataKey in data) {
// detailsStr += '' +
// '' + data[dataKey].attributes[displayField] + "第" + data[dataKey].attributes["WETLAND_NO"] + "号湿地斑块"
// + '
所在行政区:' + data[dataKey].attributes[StatisticsObj.statisticsCondition.cityFields[0]] + '
'
// }
// } else {
// for (var dataKey in data) {
// detailsStr += '' +
// '' + data[dataKey].attributes[displayField] + '
所在行政区:' +
// data[dataKey].attributes[StatisticsObj.statisticsCondition.cityFields[0]] + '
'
// }
// }
// //加载自定义滚动条
// $(".statistics-details").mCustomScrollbar("destroy"); //清除滚动条
// $('.statistics-details').html(detailsStr);
// $(".statistics-details").mCustomScrollbar({
// scrollButtons: {
// enable: true, //是否添加 滚动条两端按钮支持 值:true,false
// scrollType: "continuous", //滚动按钮滚动类型 值:”continuous”(当你点击滚动控制按钮时断断续续滚动) “pixels”(根据每次点击的像素数来滚动)
// scrollSpeed: 50, //设置点击滚动按钮时候的滚动速度(默认 20)
// scrollAmount: 60 //设置点击滚动按钮时候每次滚动的数值 像素单位 默认 40像素
// },
// autoHideScrollbar: true,
// horizontalScroll: false, //是否创建一个水平滚动条 默认是垂直滚动条
// set_width: false, //:设置你内容的宽度 值可以是像素或者百分比
// set_height: false, //:设置你内容的高度 值可以是像素或者百分比
// mouseWheel: true, //鼠标滚动的支持 值为:true.false
// });
// //统计列表点击事件
// $('.statistics-details li').unbind().click(function (e) {
// AppEvent.dispatchAppEvent('showDetails', {
// id: $(this).attr('data'),
// path: $('.statistics-layer-input').attr('data'),
// item: StatisticsObj.itemsFields
// });
// });
// StatisticsObj.loading = false;
// $('#bg').hide();
// }, function (err) {
// console.log(err);
// $(".statistics-details").mCustomScrollbar("destroy"); //清除滚动条
// $('.statistics-details').html('统计出错,请稍后重试
');
// $('#bg').hide();
// });
// });
// },
appendEventHandlers: function () {// 绑定各类按钮事件
//绑定dom操作事件
$("#StatisticsWidget .statistics-layer-input").click(function () {
$(".statistics-tree-box").fadeToggle(1);
});
$("#StatisticsWidget .statistics-layer-input").blur(function () {
$(".statistics-tree-box").fadeOut(1);
});
$(".statistics-tree-box").mouseenter(function () {
$("#StatisticsWidget .statistics-layer-input").unbind("blur");
});
$(".statistics-tree-box").mouseleave(function () {
$("#StatisticsWidget .statistics-layer-input").focus();
$("#StatisticsWidget .statistics-layer-input").blur(function () {
$(".statistics-tree-box").fadeOut(1);
});
});
//统计范围,区域选择tab标签点击事件
$("#statistics-selectScope1").unbind("click").click(function () {//行政区
if (!$(this).hasClass("selectTab")) {
$("#statistics-selectScope2").removeClass("selectTab");
$(this).addClass("selectTab");
$('#statistics-drawTools').slideUp("fast");
$('#statistics-seek1').slideDown("fast");
}
//清除自定义绘制的范围
if (StatisticsObj.statisticsArea) {
StatisticsObj.statisticsArea = null;
StatisticsObj._map.graphics.clear();
}
});
$("#statistics-selectScope2").unbind("click").click(function () {//自定义
if (!$(this).hasClass("selectTab")) {
$("#statistics-selectScope1").removeClass("selectTab");
$(this).addClass("selectTab");
$('#statistics-seek1').slideUp("fast");
$('#statistics-drawTools').slideDown("fast");
}
});
//统计单元选择事件
$('#statistics-condition').change(function (e) {
if (e.target.value == '行政区') {
$("#statistics-extent").hide();
$("#statistics-city option:first").attr('selected', true);
$("#statistics-county option:first").attr('selected', true);
setTimeout(function () {
var maxheight = $('#tabcontainer').height() - 250;
$('.statistics-details').css('height', maxheight);
$(".statistics-details").mCustomScrollbar("update"); //更新滚动条
}, 200);
} else {
$("#statistics-extent").show();
var maxheight = $('#tabcontainer').height() - 345;
$('.statistics-details').css('height', maxheight);
$(".statistics-details").mCustomScrollbar("update"); //更新滚动条
}
});
//搜索栏清空按钮点击事件--还原各选项,并清空结果
$('.clear_inputs').click(function () {
var maxheight = $('#tabcontainer').height() - 345;
StatisticsObj._map.graphics.clear();
StatisticsObj.statisticsArea = null;
$("#echartsWidget").height(0);
$('.statistics-layer-input').val('');
$("#statistics-city option:first").attr('selected', true);
$("#statistics-county option:first").attr('selected', true);
$("#statistics-condition option:first").attr('selected', true);
$(".statistics-details").mCustomScrollbar("destroy"); //清除滚动条
$('.statistics-details').html('').css('height', maxheight);
$('.statistics-results').hide();
$('#bg').hide();
$("#statistics-extent").show();
});
//搜索栏查询按钮点击事件
$('.search_inputs').click(function () {
if ($('#statistics-condition option:selected').attr('data')) {
StatisticsObj.getFeaturesIds($('.statistics-layer-input').attr('data'));
} else {
StatisticsObj._layui.msg('请完善统计条件', {icon: 0, offset: ['50%', '50%']});
}
});
//选择市区触发事件--查询对应的县区
on(dom.byId("statistics-city"), "change", function () {
$('#statistics-county').html("");
StatisticsObj._countyQuery("statistics-city", "statistics-county");
});
//初始化绘制工具
StatisticsObj.drawStatisticsArea();
},
drawStatisticsArea: function () {//统计范围绘制--方法主体
// 添加线样式
var lineSymbol = new CartographicLineSymbol(
CartographicLineSymbol.STYLE_SOLID,
new Color([250, 0, 0]), 10,
CartographicLineSymbol.CAP_ROUND,
CartographicLineSymbol.JOIN_MITER, 5
);
// 添加面样式
var fillSymbol = new SimpleFillSymbol(
SimpleFillSymbol.STYLE_SOLID,
new SimpleLineSymbol(
SimpleLineSymbol.STYLE_SOLID,
new Color('#fb003b'),
1
),
new Color([0, 0, 0, 0.15])
);
//定义绘制工具初始化函数
var tb = new draw(StatisticsObj._map);
tb.on("draw-end", function (evt) {//定义绘制结束回调函数--添加绘制图形至地图GraphicLayer图层中
//deactivate the toolbar and clear existing graphics
tb.deactivate();
$('.drawTools-active').removeClass('drawTools-active');
StatisticsObj._map.enableMapNavigation();
// 选择绘制的形状
var symbol;
if (evt.geometry.type === "point" || evt.geometry.type === "multipoint") {
symbol = markerSymbol;
} else if (evt.geometry.type === "line" || evt.geometry.type === "polyline") {
symbol = lineSymbol;
} else {
symbol = fillSymbol;
}
StatisticsObj.statisticsArea = evt.geometry;
StatisticsObj._map.graphics.add(new Graphic(evt.geometry, symbol));
});
// 绘制按钮点击事件,获取需要绘制的形状
on(dom.byId("statistics-drawTools"), "click", function (evt) {
if (evt.target.id === "statistics-drawTools") {
return;
}
if (evt.target.id === "clearAll") { //清除按钮清除事件
StatisticsObj._map.graphics.clear();
StatisticsObj.statisticsArea = null;
tb.deactivate();
$('.drawTools-active').removeClass('drawTools-active');
StatisticsObj._map.enableMapNavigation();
return;
}
$('.drawTools-active').removeClass('drawTools-active');
$(evt.target).addClass('drawTools-active');
StatisticsObj._map.graphics.clear();
StatisticsObj.statisticsArea = null;
var tool = evt.target.id.toLowerCase();
StatisticsObj._map.disableMapNavigation();
tb.activate(tool);
});
},
//COUNTY查询--在县区选择栏中动态添加所包含的县区
_countyQuery: function (city, county) {
var city_selected = city;
var count_selected = county;
var Url = ConfigData.areaQueryURL + "/2";
var queryTask = new QueryTask(Url);
var query = new Query();
query.returnGeometry = false;
query.outFields = [
"COUNTY"
];
var queryParam;
if ($('#' + city_selected + ' option:selected').text() != "市/全省") {
queryParam = "CITY like '%" + $('#' + city_selected + ' option:selected').text() + "%'";
}
if (queryParam == null) {
return;
}
query.where = queryParam;
queryTask.execute(query, function (results) {
var optionVal = results.features;
for (var i in optionVal) {
$('#' + count_selected).append("");
}
});
},
});
return Widget;
});