$(document).ready(function () { loadYearList("selectYear") //加载年combobox var currentYear = $("#selectYear").combobox("getValue") var powerChart //highChart对象 var highChartData //数据 var chartDataUrl //报表数据请求链接 var gridDataUrl //grid数据请求链接 var comboValue //combobox选中的值 var loadAvgChartData = true //用与最大负荷与其它数据之间的切换 var loadMaxChartData = false //最大负荷默认不取 var loadHarmonicChartData = false //电流,电压谐波默认不取 var loadQtyChartData = false //电能质量数据不取 var seriesDataKeyArr = ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12"] //x轴所有数据的key值 var monitorId var monitorName var wiringWay var seeType var rangeMap = {} //下一个月按钮 $("#nextYear").on("click", function () { if ($(this).linkbutton("options").disabled == false) { currentYear += 1 if (currentYear >= getCurrentYear()) { currentYear = getCurrentYear() $(this).linkbutton("disable") //禁用下一年按钮 } $("#prevYear").linkbutton("enable") //启用下一年按钮 $("#selectYear").combobox("setValue", currentYear) refreshData() } }) $("#prevYear").on("click", function () { if ($(this).linkbutton("options").disabled == false) { currentYear -= 1 if (currentYear <= 2006) { currentYear = 2006 $(this).linkbutton("disable") //禁用下年按钮 } $("#nextYear").linkbutton("enable") //启用下一年按钮 $("#selectYear").combobox("setValue", currentYear) refreshData() } }) $("#nextYear").linkbutton("disable") //禁用下一天按钮 //切换tab switchTab = function (type) { switch (type) { case "2": $("#functionTabs").tabs("select", 2) break case "3": $("#functionTabs").tabs("select", 3) break case "4": $("#functionTabs").tabs("select", 4) break case "6": $("#functionTabs").tabs("select", 1) break case "8": $("#functionTabs").tabs("select", 5) break case "9": $("#functionTabs").tabs("select", 6) break case "11": $("#functionTabs").tabs("select", 7) break case "12": $("#functionTabs").tabs("select", 8) break default: $("#functionTabs").tabs("select", 0) break } } //下方表格的数据请求Url getGridDataUrl = function (year, id) { return "../../web/anal/getYear/" + year + "/" + id + ".json" } //获取负荷,无功功率,功率因数,电流,电压,温度数据请求url getChartDataUrl = function (year, id, type, nodeType) { var url = "" if (type == 7) { url = "../../web/anal/getYear/max/" + year + "/" + id + ".json" } else if (type == 1) { url = "../../web/anal/getYear/avg/" + nodeType + "/" + year + "/" + id + ".json" } else { url = "../../web/anal/getYear/avg/" + year + "/" + id + ".json" } return url } //初始化combobox var currentCombo = "1" initCombox = function () { var dataArr = [ { text: "平均负荷", id: "1" }, { text: "最大负荷", id: "7" }, { text: "无功功率", id: "6" }, { text: "功率因数", id: "2" }, { text: "电流", id: "3" }, { text: "电压", id: "4" }, { text: "温度", id: "5" }, { text: "电流谐波畸变率", id: "8" }, { text: "电压谐波畸变率", id: "9" }, { text: "频率偏差", id: "10" }, { text: "电压偏差", id: "11" }, { text: "三相不平衡度", id: "12" }, ] $("#ImageType").combobox("loadData", dataArr) //加载数据 $("#ImageType").combobox("setValue", currentCombo) //setting default value comboValue = $("#ImageType").combobox("getValue") //current vaule } $("#selectYear").combobox({ valueField: "value", textField: "text", onSelect: function (record) { //bind select event currentYear = record.value if (currentYear >= getCurrentYear()) { currentYear = getCurrentYear() $("#nextYear").linkbutton("disable") $("#prevYear").linkbutton("enable") } else if (currentYear <= 2006) { currentYear = 2006 $("#nextYear").linkbutton("enable") $("#prevYear").linkbutton("disable") } else { $("#nextYear").linkbutton("enable") $("#prevYear").linkbutton("enable") } $("#selectYear").combobox("setValue", currentYear) refreshData() }, }) $("#ImageType").combobox({ valueField: "id", textField: "text", onSelect: function (record) { //bind select event id = record.id //公司类型的只响应平均负荷 if (type == "company" && 1 != record.id) { return } comboValue = id monthPowerUtil.setParams(id) switchTab(id) currentCombo = id chartDataUrl = getChartDataUrl(currentYear, monitorId, comboValue, type) resetAttribute(comboValue) buildCharts(true) }, }) Highcharts.setOptions({ lang: { printChart: "打印图表", downloadPNG: "导出PNG格式图片", downloadJPEG: "导出 JPEG格式图片", downloadPDF: "导出 PDF文档", downloadSVG: "导出 SVG矢量图片", contextButtonTitle: "打印和导出", }, global: { useUTC: false }, }) var highCharts = { chart: { type: "column", renderTo: "container", }, title: { text: "", }, xAxis: { categories: seriesDataKeyArr, }, yAxis: { //max:1500, // 定义Y轴 最大值 //min:0, // 定义最小值 title: { text: "", }, }, tooltip: { shared: true, //是否共享提示,也就是X一样的所有点都显示出来 useHTML: true, //是否使用HTML编辑提示信息 headerFormat: "{point.key}", pointFormat: '' + '', footerFormat: "
{series.name}: {point.y}
", valueDecimals: 2, //数据值保留小数位数 }, series: [], } loadTree = function (tree, dataUrl, loadSuccess, nodeNum) { ajax({ url: dataUrl, success: function (data) { //生成监测点树形结构 $("#" + tree).tree({ data: data.data, onSelect: function (node) { type = node.attribute.type // if(type != 'company') { monitorId = node.id monitorName = node.text wiringWay = node.attribute.wiringWay seeType = node.attribute.seeType rangeMap = buildRangeMap(monitorId) gridDataUrl = getGridDataUrl(currentYear, node.id) chartDataUrl = getChartDataUrl(currentYear, node.id, comboValue, type) highChartData = undefined //清空原来的数据,重新请求数据 loadData() //加载datagrid数据 //} //如果选择的是企业,清空除负荷以外的其他表格数据 if (type == "company") { $("#wgTab").datagrid("loadData", { total: 0, rows: [] }) $("#glTab").datagrid("loadData", { total: 0, rows: [] }) $("#dlTab").datagrid("loadData", { total: 0, rows: [] }) $("#dyTab").datagrid("loadData", { total: 0, rows: [] }) $("#harmonic_ITab").datagrid("loadData", { total: 0, rows: [] }) $("#harmonic_UTab").datagrid("loadData", { total: 0, rows: [] }) $("#uwTab").datagrid("loadData", { total: 0, rows: [] }) $("#inBalanceTab").datagrid("loadData", { total: 0, rows: [] }) } }, onLoadSuccess: function (node, data) { //数据加载成功操作 if (loadSuccess) { $("#" + tree + " li:eq(" + nodeNum + ")") .find("div") .addClass("tree-node-selected") // 设置第一个节点高亮 var n = $("#" + tree).tree("getSelected") if (n != null) { $("#" + tree).tree("select", n.target) // 相当于默认点击了一下第一个节点,执行onSelect方法 } } }, }) }, }) } loadTree("monitorTree", "../../web/getMonitorTree/tree.json", true, 1) loadTree("buildTree", "../../web/buildingmornitor/getBuildingMonitorTree.json") //重新请求数据 //日期修改就需要重新请求数据 refreshData = function () { if (monitorId != undefined) { gridDataUrl = getGridDataUrl(currentYear, monitorId) chartDataUrl = getChartDataUrl(currentYear, monitorId, comboValue, type) loadGridData(gridDataUrl) //加载datagrid数据 highChartData = undefined //清空原来的数据,重新请求数据 buildCharts(false) } else { alert("请选择监测点.") } } //根据选择的节点获取Monitor信息 loadData = function () { initCombox() monthPowerUtil.setParams(comboValue) //这里将请求数据 loadGridData(gridDataUrl) buildCharts(true) } //加载datagrid数据 loadGridData = function (dataUrl) { ajax({ url: dataUrl, beforeSend: function (XHR) { $("#functionTabs").mask("数据加载中...") }, success: function (data) { $("#functionTabs").unmask() gridData = data.data var pKey var qKey var iKey var uKey var pfKey var uwKey var nbKey if (wiringWay == 1) { pKey = ["p", "pa", "pb", "pc"] // 负荷 qKey = ["q", "qa", "qb", "qc"] iKey = ["ia", "ib", "ic", "iz"] uKey = ["ua", "ub", "uc", "uab", "ubc", "uca"] pfKey = ["pf", "pfa", "pfb", "pfc"] uwKey = ["uaW", "ubW", "ucW", "uabW", "ubcW", "ucaW"] nbKey = ["inBalance", "unBalance"] } else { pKey = ["p"] qKey = ["q"] iKey = ["ia", "ic"] uKey = ["uab", "ubc", "uca"] pfKey = ["pf"] uwKey = ["uabW", "ubcW", "ucaW"] if (wiringWay == 0) { nbKey = ["unBalance"] } else { nbKey = ["inBalance", "unBalance"] } } var huKey = ["harmonic_Ua", "harmonic_Ub", "harmonic_Uc"] var hiKey = ["harmonic_Ia", "harmonic_Ib", "harmonic_Ic"] $("#fhTab").datagrid("loadData", getJsonData(rangeMap, pKey, gridData)) $("#wgTab").datagrid("loadData", getJsonData(rangeMap, qKey, gridData)) $("#glTab").datagrid("loadData", getJsonData(rangeMap, pfKey, gridData)) $("#dlTab").datagrid("loadData", getJsonData(rangeMap, iKey, gridData)) $("#dyTab").datagrid("loadData", getJsonData(rangeMap, uKey, gridData)) $("#harmonic_ITab").datagrid("loadData", getJsonData(rangeMap, hiKey, gridData)) $("#harmonic_UTab").datagrid("loadData", getJsonData(rangeMap, huKey, gridData)) $("#uwTab").datagrid("loadData", getJsonData(rangeMap, uwKey, gridData)) $("#inBalanceTab").datagrid("loadData", getJsonData(rangeMap, nbKey, gridData)) }, }) } //根据条件构建 //param:bindCheck是否绑定checkbox //生成子菜单时需要绑定 buildCharts = function (bindCheck) { //刷新highcharts getChartData(getOptionArray()) if (bindCheck) { bindCheckbox() } } //生成报表主题 formatChartTitle = function (name, key, year) { return name + "-" + key + "(" + year + ")" } getOptionArray = function () { var optionArr = [] $("input[name='checkname']:checkbox").each(function () { if ($(this).attr("checked")) { optionArr.push($(this).val()) } }) return optionArr } //获取到数据库中存储的实时数据 getChartData = function (option) { //请求Controller数据 if (highChartData == undefined) { ajax({ url: chartDataUrl, beforeSend: function (XHR) { $("#monitorChart").mask("数据加载中...") }, success: function (data) { $("#monitorChart").unmask() highChartData = data.data fillChart(highChartData, option) }, }) } else { fillChart(highChartData, option) } } //将数据填充到highchart中 fillChart = function (highChartData, option) { var series = [] var nowYear = $("#selectYear").combobox("getValue") for (var i = 0; i < option.length; i++) { var param = option[i] var obj = getSeriesData(nowYear, highChartData, param, seriesDataKeyArr) series.push(obj) } //重新构建数据,同时将封装highcharts var json = JSON.stringify(series) var jsonStr = JSON.parse(json) var ytext var title var key if (comboValue == 1) { ytext = "负荷(kW)" key = "平均负荷曲线" } //负荷 if (comboValue == 2) { ytext = "功率因数" key = "功率因数曲线" } if (comboValue == 3) { ytext = "电流(A)" key = "电流曲线" } if (comboValue == 4) { ytext = "电压(V)" key = "电压曲线" } if (comboValue == 5) { ytext = "温度(℃)" key = "温度曲线" } if (comboValue == 6) { ytext = "无功功率(kVar)" key = "无功功率曲线" } if (comboValue == 7) { ytext = "负荷(kW)" key = "最大负荷曲线" } //负荷 if (comboValue == 8) { ytext = "电流谐波畸变率(%)" key = "电流谐波畸变率曲线" } if (comboValue == 9) { ytext = "电压谐波畸变率(%)" key = "电压谐波畸变率曲线" } if (comboValue == 10) { ytext = "频率偏差(Hz)" key = "频率偏差曲线" } if (comboValue == 11) { ytext = "电压偏差(%)" key = "电压偏差曲线" } if (comboValue == 12) { ytext = "三相不平衡(%)" key = "三相不平衡曲线" } title = formatChartTitle(monitorName, key, currentYear) highCharts.series = jsonStr highCharts.yAxis.title.text = ytext highCharts.title.text = title powerChart = new Highcharts.Chart(highCharts) } //绑定checkbox click event bindCheckbox = function () { $('input:checkbox[name="checkname"]').on("click", function () { var val = $(this).val() //根据name删除曲线 var newName = getNameByParam(val) var nowYear = $("#selectYear").combobox("getValue") var obj = getSeriesData(nowYear, highChartData, val, seriesDataKeyArr) if ($(this).attr("checked") == "checked") { //选中事件 powerChart.addSeries(obj) } else { //取消选中 var series = powerChart.series var index for (var i = 0; i < series.length; i++) { if (series[i].name == newName) { index = i break } } powerChart.series[index].remove() } }) } //添加子选项 //点击单选,动态生成菜单项 var monthPowerUtil = { setParams: function (type) { var html = "" if (type == 2) { if (wiringWay == 1) { html += " " html += " " html += " " html += " " } else { html += " " } } else if (type == 3) { if (wiringWay == 0) { html += " " html += " " } else if (wiringWay == 1) { html += " " html += " " html += " " html += " " } else { html += " " html += " " html += " " } } else if (type == 4) { if (wiringWay == 1) { html += " " html += " " html += " " html += " " html += " " html += " " } else { html += " " html += " " html += " " } } else if (type == 5) { var tempArr = [] var i = tempArr.length if (i > 0) { for (var k = 0; k < i; k++) { if (k == 0) { html += "" } else { html += "" } } } else { html += "" } } else if (type == 6) { if (wiringWay == 1) { html += " " html += " " html += " " html += " " } else { html += " " } } else if (type == 7) { if (wiringWay == 1) { html += " " html += " " html += " " html += " " } else { html += " " } if (seeType == 1) html += " " } else if (type == 8) { //电流畸变率 html += " " html += " " html += " " } else if (type == 9) { html += " " html += " " html += " " } else if (type == 10) { html += "" } else if (type == 11) { if (wiringWay == 1) { html += " " html += " " html += " " html += " " html += " " html += " " } else { html += " " html += " " html += " " } } else if (type == 12) { html += " " html += " " } else { if (wiringWay == 1) { html += " " html += " " html += " " html += " " if (seeType == 1) html += " " } else { html += " " } } $("#checkSpan").html(html) }, } resetAttribute = function (comboValue) { //下拉框选择时对加载数据属性进行重置 if (comboValue == 7) { if (!loadMaxChartData) { highChartData = undefined loadMaxChartData = true loadAvgChartData = false //用与最大负荷与其它数据之间的切换 } } else { if (comboValue <= 6) { if (!loadAvgChartData) { highChartData = undefined loadAvgChartData = true loadMaxChartData = false } } } } /********************************监测点设备列表***********************************/ showEquipmentList = function () { var win = $("#equipment_list").window({ closed: true, }) win.window("open") getData(monitorId) } function getData(monitorId) { $("#equipment_tabel").datagrid("loadData", []) ajax({ url: "/web/equipment/getList/" + monitorId + ".json", type: "post", dataType: "json", data: { pageNo: 1, pageSize: 1000 }, success: function (data) { $("#equipment_tabel").datagrid("loadData", data) }, }) } /********************************监测点设备列表***********************************/ }) //窗口大小变化时延时刷新图表大小 $(window).resize(function () { var width = $(window).width() ;(width -= 220), $("#container").width(width) })