|
|
@@ -1,2382 +1,2384 @@
|
|
|
-/*
|
|
|
- 电气火灾数据对接
|
|
|
-*/
|
|
|
-
|
|
|
-
|
|
|
-//建筑下拉
|
|
|
-getNameList();
|
|
|
-
|
|
|
-function getNameList(queryParam = {}) {
|
|
|
-
|
|
|
- ajaxRequest(GET_NAME_LIST_DATA, "POST", queryParam, function(result) {
|
|
|
- let data = result.RESULT;
|
|
|
- let items = '';
|
|
|
-
|
|
|
- data.forEach(function(item, key) {
|
|
|
-
|
|
|
- items += `<option value="${item.owner_id}" style="background-color: #666666">${item.owner_name}</option>`
|
|
|
-
|
|
|
- })
|
|
|
- $('#building').html(items);
|
|
|
-
|
|
|
- }, function(errorMsg) {
|
|
|
- // alert("请求数据失败!");
|
|
|
- }, 2)
|
|
|
-};
|
|
|
-
|
|
|
-//日期筛选
|
|
|
-layui.use('laydate', function() {
|
|
|
- var laydate = layui.laydate;
|
|
|
- ///年月选择器
|
|
|
- laydate.render({
|
|
|
- elem: '#chooseTime',
|
|
|
- type: 'month',
|
|
|
- max: -30, //7天后
|
|
|
- trigger: 'click', //呼出事件改成click
|
|
|
- done: function(value, date, endDate) {
|
|
|
- setTimeout(function() {
|
|
|
- getListData(getSearchParamObj());
|
|
|
- }, 100)
|
|
|
- }
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
-});
|
|
|
-
|
|
|
-//建筑筛选
|
|
|
-$("#building").change(function() {
|
|
|
- setTimeout(function() {
|
|
|
- getListData(getSearchParamObj());
|
|
|
- }, 100)
|
|
|
-
|
|
|
-});
|
|
|
-
|
|
|
-// 数据请求传参
|
|
|
-getListData(getSearchParamObj());
|
|
|
-
|
|
|
-function getListData(queryParam = {}) {
|
|
|
-
|
|
|
- ajaxRequest(ELE_FIRE_DATA, "POST", queryParam, function(result) {
|
|
|
-
|
|
|
- if (result.totalCount != 0) {
|
|
|
-
|
|
|
- /*
|
|
|
- 主页面数据对接 start
|
|
|
- */
|
|
|
-
|
|
|
- //数据统计
|
|
|
- var data_statistics = result.RESULT[0].data_statistics;
|
|
|
- $('.total').html(data_statistics.alarm_number);
|
|
|
- $('.solved').html(data_statistics.processing_number);
|
|
|
- $('.unsolve').html(data_statistics.unprocessed_number);
|
|
|
-
|
|
|
- // 环状饼图定制 （数据统计计算）
|
|
|
- (function() {
|
|
|
- // 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector(".bar-3d .chart"));
|
|
|
-
|
|
|
- // 生成扇形的曲面参数方程，用于 series-surface.parametricEquation
|
|
|
- function getParametricEquation(startRatio, endRatio, isSelected, isHovered, k, height) {
|
|
|
-
|
|
|
- // 计算
|
|
|
- let midRatio = (startRatio + endRatio) / 2;
|
|
|
-
|
|
|
- let startRadian = startRatio * Math.PI * 2;
|
|
|
- let endRadian = endRatio * Math.PI * 2;
|
|
|
- let midRadian = midRatio * Math.PI * 2;
|
|
|
-
|
|
|
- // 如果只有一个扇形，则不实现选中效果。
|
|
|
- if (startRatio === 0 && endRatio === 1) {
|
|
|
- isSelected = false;
|
|
|
- }
|
|
|
-
|
|
|
- // 通过扇形内径/外径的值，换算出辅助参数 k（默认值 1/3）
|
|
|
- k = typeof k !== 'undefined' ? k : 1 / 3;
|
|
|
-
|
|
|
- // 计算选中效果分别在 x 轴、y 轴方向上的位移（未选中，则位移均为 0）
|
|
|
- let offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0;
|
|
|
- let offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0;
|
|
|
-
|
|
|
- // 计算高亮效果的放大比例（未高亮，则比例为 1）
|
|
|
- let hoverRate = isHovered ? 1.05 : 1;
|
|
|
-
|
|
|
- // 返回曲面参数方程
|
|
|
- return {
|
|
|
-
|
|
|
- u: {
|
|
|
- min: -Math.PI,
|
|
|
- max: Math.PI * 3,
|
|
|
- step: Math.PI / 32
|
|
|
- },
|
|
|
-
|
|
|
- v: {
|
|
|
- min: 0,
|
|
|
- max: Math.PI * 2,
|
|
|
- step: Math.PI / 20
|
|
|
- },
|
|
|
-
|
|
|
- x: function(u, v) {
|
|
|
- if (u < startRadian) {
|
|
|
- return offsetX + Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
- }
|
|
|
- if (u > endRadian) {
|
|
|
- return offsetX + Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
- }
|
|
|
- return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
- },
|
|
|
-
|
|
|
- y: function(u, v) {
|
|
|
- if (u < startRadian) {
|
|
|
- return offsetY + Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
- }
|
|
|
- if (u > endRadian) {
|
|
|
- return offsetY + Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
- }
|
|
|
- return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
- },
|
|
|
-
|
|
|
- z: function(u, v) {
|
|
|
- if (u < -Math.PI * 0.5) {
|
|
|
- return Math.sin(u);
|
|
|
- }
|
|
|
- if (u > Math.PI * 2.5) {
|
|
|
- return Math.sin(u);
|
|
|
- }
|
|
|
- return Math.sin(v) > 0 ? 1 : -1;
|
|
|
- }
|
|
|
- };
|
|
|
- }
|
|
|
-
|
|
|
- // 生成模拟 3D 饼图的配置项
|
|
|
- function getPie3D(pieData, internalDiameterRatio) {
|
|
|
-
|
|
|
- let series = [];
|
|
|
- let sumValue = 0;
|
|
|
- let startValue = 0;
|
|
|
- let endValue = 0;
|
|
|
- let legendData = [];
|
|
|
- let k = typeof internalDiameterRatio !== 'undefined' ? (1 - internalDiameterRatio) / (1 + internalDiameterRatio) : 1 / 3;
|
|
|
-
|
|
|
- // 为每一个饼图数据，生成一个 series-surface 配置
|
|
|
- for (let i = 0; i < pieData.length; i++) {
|
|
|
-
|
|
|
- sumValue += pieData[i].value;
|
|
|
-
|
|
|
- let seriesItem = {
|
|
|
- name: typeof pieData[i].name === 'undefined' ? `series${i}` : pieData[i].name,
|
|
|
- type: 'surface',
|
|
|
- parametric: true,
|
|
|
- wireframe: {
|
|
|
- show: false
|
|
|
- },
|
|
|
- pieData: pieData[i],
|
|
|
- pieStatus: {
|
|
|
- selected: false,
|
|
|
- hovered: false,
|
|
|
- k: k
|
|
|
- }
|
|
|
- };
|
|
|
-
|
|
|
- if (typeof pieData[i].itemStyle != 'undefined') {
|
|
|
-
|
|
|
- let itemStyle = {};
|
|
|
-
|
|
|
- typeof pieData[i].itemStyle.color != 'undefined' ? itemStyle.color = pieData[i].itemStyle.color : null;
|
|
|
- typeof pieData[i].itemStyle.opacity != 'undefined' ? itemStyle.opacity = pieData[i].itemStyle.opacity : null;
|
|
|
-
|
|
|
- seriesItem.itemStyle = itemStyle;
|
|
|
- }
|
|
|
- series.push(seriesItem);
|
|
|
- }
|
|
|
-
|
|
|
- // 使用上一次遍历时，计算出的数据和 sumValue，调用 getParametricEquation 函数，
|
|
|
- // 向每个 series-surface 传入不同的参数方程 series-surface.parametricEquation，也就是实现每一个扇形。
|
|
|
- for (let i = 0; i < series.length; i++) {
|
|
|
- endValue = startValue + series[i].pieData.value;
|
|
|
- // console.log(series[i]);
|
|
|
- series[i].pieData.startRatio = startValue / sumValue;
|
|
|
- series[i].pieData.endRatio = endValue / sumValue;
|
|
|
- series[i].parametricEquation = getParametricEquation(series[i].pieData.startRatio, series[i].pieData.endRatio, false, false, k, series[i].pieData.value);
|
|
|
-
|
|
|
- startValue = endValue;
|
|
|
-
|
|
|
- legendData.push(series[i].name);
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- // 准备待返回的配置项，把准备好的 legendData、series 传入。
|
|
|
- let option = {
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- formatter: params => {
|
|
|
- if (params.seriesName !== 'mouseoutSeries') {
|
|
|
- // return `${params.seriesName}<br/><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color};"></span>${option.series[params.seriesIndex].pieData.value}%`;
|
|
|
- return `${params.seriesName}: ${option.series[params.seriesIndex].pieData.value}%`;
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- xAxis3D: {
|
|
|
- min: -1,
|
|
|
- max: 1
|
|
|
- },
|
|
|
- yAxis3D: {
|
|
|
- min: -1,
|
|
|
- max: 1
|
|
|
- },
|
|
|
- zAxis3D: {
|
|
|
- min: -1,
|
|
|
- max: 1
|
|
|
- },
|
|
|
- grid3D: {
|
|
|
-
|
|
|
-
|
|
|
- show: false,
|
|
|
- boxHeight: 40,
|
|
|
- top: '-10%',
|
|
|
- // bottom: '80%',
|
|
|
- // environment: '../images/3d-bg.png', //aa背景色
|
|
|
-
|
|
|
- viewControl: {
|
|
|
- distance: 170, //aa距离
|
|
|
- alpha: 21, //aa角度
|
|
|
- beta: 60, //aa角度
|
|
|
- zoomSensitivity: false //是否开启缩放和平移
|
|
|
- },
|
|
|
- },
|
|
|
- series: series
|
|
|
- };
|
|
|
- return option;
|
|
|
- }
|
|
|
-
|
|
|
- // 传入数据生成 option
|
|
|
- var option = getPie3D([{
|
|
|
- name: '已处理率',
|
|
|
- value: data_statistics.treatment_rate,
|
|
|
- itemStyle: {
|
|
|
- opacity: 0.5,
|
|
|
- color: 'rgba(0,127,244,.8)',
|
|
|
- }
|
|
|
- }, {
|
|
|
- name: '未处理率',
|
|
|
- value: data_statistics.untreated_rate,
|
|
|
- itemStyle: {
|
|
|
- opacity: 0.5,
|
|
|
- color: 'rgba(209,126,23,.8)',
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- ], 2);
|
|
|
-
|
|
|
- // 把配置给实例对象
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize", function() {
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
-
|
|
|
- })();
|
|
|
-
|
|
|
- // 折线图定制 (数据离散率挖掘)
|
|
|
- (function() {
|
|
|
-
|
|
|
- let dispersion_rate = result.RESULT[0].dispersion_rate;
|
|
|
-
|
|
|
- // 结论数据渲染
|
|
|
- var items = '';
|
|
|
- var conclusion = dispersion_rate.conclusion
|
|
|
- for (x in conclusion) {
|
|
|
- xIndex = x.substr(x.length - 1, 1);
|
|
|
- items += `<p>${xIndex}、${conclusion[x]}</p>`
|
|
|
- }
|
|
|
- $('.divergence .summaryDetail').html(items);
|
|
|
-
|
|
|
- // 三相电压
|
|
|
- let a = [];
|
|
|
- let b = [];
|
|
|
- let c = [];
|
|
|
- let d = [];
|
|
|
- let voltage = dispersion_rate.voltage;
|
|
|
- voltage.forEach(function(item, index) {
|
|
|
- a.push(item.variance)
|
|
|
- b.push(item.standard_deviation)
|
|
|
- c.push(item.average_value)
|
|
|
- d.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
- // 三相电流
|
|
|
- let a2 = [];
|
|
|
- let b2 = [];
|
|
|
- let c2 = [];
|
|
|
- let d2 = [];
|
|
|
- let electric_current = dispersion_rate.electric_current;
|
|
|
- electric_current.forEach(function(item, index) {
|
|
|
- a2.push(item.variance)
|
|
|
- b2.push(item.standard_deviation)
|
|
|
- c2.push(item.average_value)
|
|
|
- d2.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
- // 三相温度
|
|
|
- let a3 = [];
|
|
|
- let b3 = [];
|
|
|
- let c3 = [];
|
|
|
- let d3 = [];
|
|
|
- let temperature = dispersion_rate.temperature;
|
|
|
- temperature.forEach(function(item, index) {
|
|
|
- a3.push(item.variance)
|
|
|
- b3.push(item.standard_deviation)
|
|
|
- c3.push(item.average_value)
|
|
|
- d3.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
- // 漏电电流
|
|
|
- let a4 = [];
|
|
|
- let b4 = [];
|
|
|
- let c4 = [];
|
|
|
- let d4 = [];
|
|
|
- let leakage_current = dispersion_rate.leakage_current;
|
|
|
- leakage_current.forEach(function(item, index) {
|
|
|
- a4.push(item.variance)
|
|
|
- b4.push(item.standard_deviation)
|
|
|
- c4.push(item.average_value)
|
|
|
- d4.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- sortName: "三相电压",
|
|
|
- data: [a, b, c, d]
|
|
|
- },
|
|
|
- {
|
|
|
- sortName: "三相电流",
|
|
|
- data: [a2, b2, c2, d2]
|
|
|
- },
|
|
|
- {
|
|
|
- sortName: "三相温度",
|
|
|
- data: [a3, b3, c3, d3]
|
|
|
- }, {
|
|
|
- sortName: "漏电电流",
|
|
|
- data: [a4, b4, c4, d4]
|
|
|
- },
|
|
|
- ];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < leakage_current.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector(".divergence .chart"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: [{
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#F9860C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#fff' // 100% 处的颜色
|
|
|
- }],
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#07E1F1' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#0456CB' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#11F90C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#3FC713' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- ],
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#fff"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "20%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: d,
|
|
|
- axisTick: {
|
|
|
- show: true
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- interval: 0,
|
|
|
- show: false,
|
|
|
- // color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.3)'
|
|
|
- }
|
|
|
- },
|
|
|
- splitNumber: 8,
|
|
|
- splitLine: {
|
|
|
- show: false
|
|
|
- },
|
|
|
- splitArea: {
|
|
|
- show: true,
|
|
|
- areaStyle: {
|
|
|
- color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- // scale: true,
|
|
|
- // min: 'dataMin',
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#012f4a" // 分割线颜色
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "方差",
|
|
|
- type: "line",
|
|
|
- data: a
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "标准差",
|
|
|
- type: "line",
|
|
|
- data: b
|
|
|
- }, {
|
|
|
- symbol: "none",
|
|
|
- name: "平均值",
|
|
|
- type: "line",
|
|
|
- data: c
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize", function() {
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
-
|
|
|
- // 点击切换效果
|
|
|
- $(".divergence .tab-line").on("click", "a", function() {
|
|
|
- $(this).addClass('active').siblings().removeClass('active')
|
|
|
- var obj = sortData[$(this).index()];
|
|
|
- option.series[0].data = obj.data[0];
|
|
|
- option.series[1].data = obj.data[1];
|
|
|
- option.series[2].data = obj.data[2];
|
|
|
-
|
|
|
- // 重新渲染
|
|
|
- myChart.setOption(option);
|
|
|
-
|
|
|
- });
|
|
|
- })();
|
|
|
-
|
|
|
- // 折线图定制 (电老化分析)
|
|
|
- (function() {
|
|
|
-
|
|
|
- let electrical_aging = result.RESULT[0].electrical_aging;
|
|
|
- // console.log(electrical_aging)
|
|
|
-
|
|
|
- // 结论数据渲染
|
|
|
- var items = '';
|
|
|
- var conclusion = electrical_aging.conclusion
|
|
|
- for (x in conclusion) {
|
|
|
- xIndex = x.substr(x.length - 1, 1);
|
|
|
- items += `<p>${xIndex}、${conclusion[x]}</p>`
|
|
|
- }
|
|
|
- $('.oldAnalysis .summaryDetail').html(items);
|
|
|
-
|
|
|
-
|
|
|
- // 异常设备监控电缆数据
|
|
|
- let a = [];
|
|
|
- let b = [];
|
|
|
- let data_time = [];
|
|
|
-
|
|
|
- let abnormal_equipment = electrical_aging.abnormal_equipment;
|
|
|
- abnormal_equipment.forEach(function(item, index) {
|
|
|
- a.push(item.electric_current)
|
|
|
- b.push(item.voltage)
|
|
|
- data_time.push(item.data_time)
|
|
|
- });
|
|
|
- // console.log(data_time)
|
|
|
-
|
|
|
- // 漏电告警数据
|
|
|
- let a2 = [];
|
|
|
- let b2 = [];
|
|
|
- let data_time2 = [];
|
|
|
-
|
|
|
- let leakage_alarm = electrical_aging.leakage_alarm;
|
|
|
- leakage_alarm.forEach(function(item, index) {
|
|
|
- a2.push(item.electric_current)
|
|
|
- b2.push(item.voltage)
|
|
|
- data_time2.push(item.data_time)
|
|
|
- });
|
|
|
- // console.log(data_time2)
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- sortName: "异常设备",
|
|
|
- data: [a, b]
|
|
|
-
|
|
|
- },
|
|
|
- {
|
|
|
- sortName: "漏电告警",
|
|
|
- data: [a2, b2]
|
|
|
- }
|
|
|
- ];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < leakage_alarm.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector(".oldAnalysis .chart"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: ["#FF9C00", "#0096FF"], // 通过这个color修改两条线的颜色
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
-
|
|
|
- formatter: function(params) {
|
|
|
- if ($('#active').hasClass('active')) {
|
|
|
- var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time[params[0].dataIndex];
|
|
|
- } else {
|
|
|
- var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time2[params[0].dataIndex];
|
|
|
- }
|
|
|
- return res;
|
|
|
- },
|
|
|
- // formatter: '{a0}: {c0}<br />{a1}: {c1}<br />时间：' + chooseTime + ''
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#fff"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "15%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: xData,
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#012f4a" // 分割线颜色
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "电流",
|
|
|
- type: "line",
|
|
|
- smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(255,156,0, 0.4)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(255,156,0, 0.3)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "电压",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(0,150,255,0.5)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(0,150,255, 0.1)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[1]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize", function() {
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
-
|
|
|
- // 点击切换效果
|
|
|
- $(".oldAnalysis .tab-line").on("click", "a", function() {
|
|
|
- $(this).addClass('active').siblings().removeClass('active')
|
|
|
- var obj = sortData[$(this).index()];
|
|
|
- option.series[0].data = obj.data[0];
|
|
|
- option.series[1].data = obj.data[1];
|
|
|
- // 重新渲染
|
|
|
- myChart.setOption(option);
|
|
|
-
|
|
|
- });
|
|
|
- })();
|
|
|
-
|
|
|
- // 折线图定制 (热老化分析)
|
|
|
- (function() {
|
|
|
-
|
|
|
- let thermal_aging = result.RESULT[0].thermal_aging;
|
|
|
-
|
|
|
- // 结论数据渲染
|
|
|
- var items = '';
|
|
|
- var conclusion = thermal_aging.conclusion
|
|
|
- for (x in conclusion) {
|
|
|
- xIndex = x.substr(x.length - 1, 1);
|
|
|
- items += `<p>${xIndex}、${conclusion[x]}</p>`
|
|
|
- }
|
|
|
- $('.hotAnalysis .summaryDetail').html(items);
|
|
|
-
|
|
|
-
|
|
|
- // 热老化
|
|
|
- let a = [];
|
|
|
- let b = [];
|
|
|
- let c = [];
|
|
|
- let data_time = [];
|
|
|
- let visualization = thermal_aging.visualization;
|
|
|
- visualization.forEach(function(item, index) {
|
|
|
- a.push(item.generation_temperature)
|
|
|
- b.push(item.ambient_temperature)
|
|
|
- c.push(item.Cable_temperature)
|
|
|
- data_time.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- data: [
|
|
|
- // 三个数组是因为有3条线
|
|
|
- a, b, c
|
|
|
- ]
|
|
|
- }];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < visualization.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector(".hotAnalysis .chart"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: ["#05EEE7", "#9999FF", "#FE92B3"], // 通过这个color修改三条线的颜色
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- // formatter: '{a0}: {c0}°C<br />{a1}: {c1}°C<br />{a2}: {c2}°C<br />时间：' + chooseTime + ''
|
|
|
- formatter: function(params) {
|
|
|
- var res = params[0].seriesName + '：' + params[0].value + '°C<br />' + params[1].seriesName + '：' + params[1].value + '°C<br />' + params[2].seriesName + '：' + params[2].value + '°C<br />时间：' + data_time[params[2].dataIndex];
|
|
|
- return res;
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#fff"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "15%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: xData,
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#012f4a" // 分割线颜色
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "线缆产生的温度",
|
|
|
- type: "line",
|
|
|
- smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(5,238,231,.6)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(5,238,231, 0.4)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "环境温度",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(153,153,255,.6)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(153,153,255, 0.4)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[1]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "线缆温度",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(255,147,180,.6)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(255,147,180, 0.4)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[2]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize", function() {
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- })();
|
|
|
-
|
|
|
- /*
|
|
|
- 主页面数据对接 end
|
|
|
- */
|
|
|
-
|
|
|
-
|
|
|
- /*
|
|
|
- 导出数据对接 start
|
|
|
- */
|
|
|
-
|
|
|
-
|
|
|
- //项目情况
|
|
|
- var project_situation = result.RESULT[0].project_situation;
|
|
|
- var items = '';
|
|
|
- items = `<tr>
|
|
|
- <td>单位名称</td>
|
|
|
- <td colspan="5">${project_situation.company_name}</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>进场日期</td>
|
|
|
- <td>${project_situation.entry_date} </td>
|
|
|
- <td>完工日期</td>
|
|
|
- <td>${project_situation.completion_date}</td>
|
|
|
- <td>验收日期</td>
|
|
|
- <td>${project_situation.acceptance_date}</td>
|
|
|
- </tr>`
|
|
|
- $('#project_situation').html(items);
|
|
|
-
|
|
|
- //设备清单
|
|
|
- var equipment_list = result.RESULT[0].equipment_list;
|
|
|
- var items2 = '';
|
|
|
- if (equipment_list) {
|
|
|
- equipment_list.forEach(function(item, key) {
|
|
|
- items2 += `<tr>
|
|
|
- <td>${item.device_name}</td>
|
|
|
- <td>${item.device_info}</td>
|
|
|
- <td>${item.device_code}</td>
|
|
|
- <td>${item.remarks}</td>
|
|
|
- </tr>`;
|
|
|
- })
|
|
|
- $('#equipment_list').html(items2)
|
|
|
- }
|
|
|
-
|
|
|
- //统计时段
|
|
|
- var statistical_period = result.RESULT[0].statistical_period;
|
|
|
- var items3 = '';
|
|
|
- items3 = `<div>统计起始日期：${statistical_period.start_date}</div>
|
|
|
- <div>统计截止日期：${statistical_period.closing_date}</div>
|
|
|
- <div>统计时段时长：${statistical_period.duration}</div>`;
|
|
|
- $('#statistical_period').html(items3)
|
|
|
-
|
|
|
- //数据统计计算
|
|
|
- var data_statistics = result.RESULT[0].data_statistics;
|
|
|
- var items4 = '';
|
|
|
- items4 = `<tr>
|
|
|
- <td>${data_statistics.alarm_number}</td>
|
|
|
- <td>${data_statistics.processing_number}</td>
|
|
|
- <td>${data_statistics.unprocessed_number}</td>
|
|
|
- <td>${data_statistics.treatment_rate}</td>
|
|
|
- <td>${data_statistics.untreated_rate}</td>
|
|
|
- </tr>`;
|
|
|
- $('#data_statistics').html(items4);
|
|
|
-
|
|
|
-
|
|
|
- // 数据离散率挖掘
|
|
|
- let dispersion_rate = result.RESULT[0].dispersion_rate;
|
|
|
-
|
|
|
- // 结论数据渲染
|
|
|
- var items = '';
|
|
|
- var conclusion = dispersion_rate.conclusion
|
|
|
- for (x in conclusion) {
|
|
|
- xIndex = x.substr(x.length - 1, 1);
|
|
|
- items += `<div>${xIndex}、${conclusion[x]}</div>`
|
|
|
- }
|
|
|
- $('.exportBox .divergence .summaryDetail').html(items);
|
|
|
-
|
|
|
- // 数据离散率挖掘1
|
|
|
- (function() {
|
|
|
- // 三相电压
|
|
|
- let a = [];
|
|
|
- let b = [];
|
|
|
- let c = [];
|
|
|
- let d = [];
|
|
|
- let voltage = dispersion_rate.voltage;
|
|
|
- voltage.forEach(function(item, index) {
|
|
|
- a.push(item.variance)
|
|
|
- b.push(item.standard_deviation)
|
|
|
- c.push(item.average_value)
|
|
|
- d.push(item.data_time)
|
|
|
- });
|
|
|
- var sortData = [{
|
|
|
- sortName: "三相电压",
|
|
|
- data: [
|
|
|
- a, b, c, d
|
|
|
- ]
|
|
|
- }, ];
|
|
|
-
|
|
|
- // var xData = function() {
|
|
|
- // var data = [];
|
|
|
- // for (var i = 1; i < voltage.length + 1; i++) {
|
|
|
- // data.push(i);
|
|
|
- // }
|
|
|
- // return data;
|
|
|
- // }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector("#divergenceChart1"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: [{
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#F9860C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#fff' // 100% 处的颜色
|
|
|
- }],
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#07E1F1' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#0456CB' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#11F90C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#3FC713' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- ],
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#aaa"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "20%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: d,
|
|
|
- axisTick: {
|
|
|
- lineStyle: { color: 'rgb(150,150,150)' }
|
|
|
- // show: true // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- interval: 0,
|
|
|
- show: false,
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.3)'
|
|
|
- }
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- show: false
|
|
|
- },
|
|
|
- splitArea: {
|
|
|
- show: true,
|
|
|
- areaStyle: {
|
|
|
- color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- splitNumber: 8,
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#aaa", // 分割线颜色
|
|
|
- opacity: .2
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "方差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "标准差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[1]
|
|
|
- }, {
|
|
|
- symbol: "none",
|
|
|
- name: "平均值",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[2]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
-
|
|
|
- //echarts赋值到src
|
|
|
- var img1 = document.getElementById('divergenceChart1_img');
|
|
|
- setTimeout(function() {
|
|
|
- img1.src = myChart.getDataURL();
|
|
|
- }, 1000)
|
|
|
-
|
|
|
- })();
|
|
|
-
|
|
|
- // 数据离散率挖掘2
|
|
|
- (function() {
|
|
|
-
|
|
|
- // 三相电流
|
|
|
- let a2 = [];
|
|
|
- let b2 = [];
|
|
|
- let c2 = [];
|
|
|
- let d2 = [];
|
|
|
- let electric_current = dispersion_rate.electric_current;
|
|
|
- electric_current.forEach(function(item, index) {
|
|
|
- a2.push(item.variance)
|
|
|
- b2.push(item.standard_deviation)
|
|
|
- c2.push(item.average_value)
|
|
|
- d2.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- sortName: "三相电流",
|
|
|
- data: [
|
|
|
- a2, b2, c2
|
|
|
- ]
|
|
|
- },
|
|
|
-
|
|
|
- ];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < electric_current.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector("#divergenceChart2"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: [{
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#F9860C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#fff' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#07E1F1' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#0456CB' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#11F90C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#3FC713' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- ],
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#aaa"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "20%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: d2,
|
|
|
- axisTick: {
|
|
|
- lineStyle: { color: 'rgb(150,150,150)' },
|
|
|
- show: true
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- interval: 0,
|
|
|
- show: false,
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.3)'
|
|
|
- }
|
|
|
- },
|
|
|
- splitNumber: 8,
|
|
|
- splitLine: {
|
|
|
- show: false
|
|
|
- },
|
|
|
- splitArea: {
|
|
|
- show: true,
|
|
|
- areaStyle: {
|
|
|
- color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- splitNumber: 8,
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#aaa", // 分割线颜色
|
|
|
- opacity: .2
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "方差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "标准差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[1]
|
|
|
- }, {
|
|
|
- symbol: "none",
|
|
|
- name: "平均值",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[2]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
-
|
|
|
- //echarts赋值到src
|
|
|
- var img1 = document.getElementById('divergenceChart2_img');
|
|
|
- setTimeout(function() {
|
|
|
- img1.src = myChart.getDataURL();
|
|
|
- }, 1000)
|
|
|
- })();
|
|
|
-
|
|
|
- // 数据离散率挖掘3
|
|
|
- (function() {
|
|
|
- // 三相温度
|
|
|
- let a3 = [];
|
|
|
- let b3 = [];
|
|
|
- let c3 = [];
|
|
|
- let d3 = [];
|
|
|
- let temperature = dispersion_rate.temperature;
|
|
|
- temperature.forEach(function(item, index) {
|
|
|
- a3.push(item.variance)
|
|
|
- b3.push(item.standard_deviation)
|
|
|
- c3.push(item.average_value)
|
|
|
- d3.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- sortName: "三相温度",
|
|
|
- data: [
|
|
|
- a3, b3, c3
|
|
|
- ]
|
|
|
- }, ];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < temperature.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector("#divergenceChart3"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: [{
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#F9860C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#fff' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#07E1F1' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#0456CB' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#11F90C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#3FC713' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- ],
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#aaa"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "20%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: d3,
|
|
|
- axisTick: {
|
|
|
- lineStyle: { color: 'rgb(150,150,150)' },
|
|
|
- show: true
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- interval: 0,
|
|
|
- show: false,
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.3)'
|
|
|
- }
|
|
|
- },
|
|
|
- splitNumber: 8,
|
|
|
- splitLine: {
|
|
|
- show: false
|
|
|
- },
|
|
|
- splitArea: {
|
|
|
- show: true,
|
|
|
- areaStyle: {
|
|
|
- color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
-
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#aaa", // 分割线颜色
|
|
|
- opacity: .2
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "方差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "标准差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[1]
|
|
|
- }, {
|
|
|
- symbol: "none",
|
|
|
- name: "平均值",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[2]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- //echarts赋值到src
|
|
|
- var img1 = document.getElementById('divergenceChart3_img');
|
|
|
- setTimeout(function() {
|
|
|
- img1.src = myChart.getDataURL();
|
|
|
- }, 1000)
|
|
|
- })();
|
|
|
-
|
|
|
- // 数据离散率挖掘4
|
|
|
- (function() {
|
|
|
- // 漏电电流
|
|
|
- let a4 = [];
|
|
|
- let b4 = [];
|
|
|
- let c4 = [];
|
|
|
- let d4 = [];
|
|
|
- let leakage_current = dispersion_rate.leakage_current;
|
|
|
- leakage_current.forEach(function(item, index) {
|
|
|
- a4.push(item.variance)
|
|
|
- b4.push(item.standard_deviation)
|
|
|
- c4.push(item.average_value)
|
|
|
- d4.push(item.data_time)
|
|
|
- });
|
|
|
- var sortData = [{
|
|
|
- sortName: "三相电流",
|
|
|
- data: [
|
|
|
- a4, b4, c4
|
|
|
- ]
|
|
|
- }, ];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < leakage_current.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector("#divergenceChart4"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: [{
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#F9860C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#fff' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#07E1F1' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#0456CB' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
-
|
|
|
- colorStops: [{
|
|
|
- offset: 0,
|
|
|
- color: '#11F90C' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1,
|
|
|
- color: '#3FC713' // 100% 处的颜色
|
|
|
- }],
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- ],
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#aaa"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "20%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: d4,
|
|
|
- axisTick: {
|
|
|
- lineStyle: { color: 'rgb(150,150,150)' },
|
|
|
- show: true
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- interval: 0,
|
|
|
- show: false,
|
|
|
- // color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.3)'
|
|
|
- }
|
|
|
- },
|
|
|
- splitNumber: 8,
|
|
|
- splitLine: {
|
|
|
- show: false
|
|
|
- },
|
|
|
- splitArea: {
|
|
|
- show: true,
|
|
|
- areaStyle: {
|
|
|
- color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#aaa", // 分割线颜色
|
|
|
- opacity: .2
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "方差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "标准差",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[1]
|
|
|
- }, {
|
|
|
- symbol: "none",
|
|
|
- name: "平均值",
|
|
|
- type: "line",
|
|
|
- data: sortData[0].data[2]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- //echarts赋值到src
|
|
|
- var img1 = document.getElementById('divergenceChart4_img');
|
|
|
- setTimeout(function() {
|
|
|
- img1.src = myChart.getDataURL();
|
|
|
- }, 1000)
|
|
|
- })();
|
|
|
-
|
|
|
-
|
|
|
- // 电老化分析
|
|
|
- let electrical_aging = result.RESULT[0].electrical_aging;
|
|
|
-
|
|
|
- // 结论数据渲染
|
|
|
- var items = '';
|
|
|
- var conclusion = electrical_aging.conclusion
|
|
|
- for (x in conclusion) {
|
|
|
- xIndex = x.substr(x.length - 1, 1);
|
|
|
- items += `<div>${xIndex}、${conclusion[x]}</div>`
|
|
|
- }
|
|
|
- $('.exportBox .oldAnalysis .summaryDetail').html(items);
|
|
|
-
|
|
|
- // 电老化分析1
|
|
|
- (function() {
|
|
|
- // 异常设备监控电缆数据
|
|
|
- let a = [];
|
|
|
- let b = [];
|
|
|
- let data_time = [];
|
|
|
-
|
|
|
- let abnormal_equipment = electrical_aging.abnormal_equipment;
|
|
|
- abnormal_equipment.forEach(function(item, index) {
|
|
|
- a.push(item.electric_current)
|
|
|
- b.push(item.voltage)
|
|
|
- data_time.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- sortName: "异常设备",
|
|
|
- data: [a, b]
|
|
|
- },
|
|
|
-
|
|
|
- ];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < abnormal_equipment.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector("#oldAnalysisChart1"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: ["#FF9C00", "#0096FF"], // 通过这个color修改两条线的颜色
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
-
|
|
|
- // formatter: '{a0}: {c0}<br />{a1}: {c1}<br />时间：' + chooseTime + ''
|
|
|
- formatter: function(params) {
|
|
|
- var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time[params[0].dataIndex];
|
|
|
- return res;
|
|
|
- },
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#aaa"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "15%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: xData,
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#aaa", // 分割线颜色
|
|
|
- opacity: .2
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "电流",
|
|
|
- type: "line",
|
|
|
- smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(255,156,0, 0.4)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(255,156,0, 0.3)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "电压",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(0,150,255,0.5)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(0,150,255, 0.1)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[1]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- var img1 = document.getElementById('oldAnalysisChart1_img');
|
|
|
- setTimeout(function() {
|
|
|
- img1.src = myChart.getDataURL();
|
|
|
- }, 1000)
|
|
|
-
|
|
|
- })();
|
|
|
-
|
|
|
- // 电老化分析2
|
|
|
- (function() {
|
|
|
-
|
|
|
- // 漏电告警数据
|
|
|
- let a2 = [];
|
|
|
- let b2 = [];
|
|
|
- let data_time2 = [];
|
|
|
-
|
|
|
- let leakage_alarm = electrical_aging.leakage_alarm;
|
|
|
- leakage_alarm.forEach(function(item, index) {
|
|
|
- a2.push(item.electric_current)
|
|
|
- b2.push(item.voltage)
|
|
|
- data_time2.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- sortName: "漏电告警",
|
|
|
- data: [a2, b2]
|
|
|
- }];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < leakage_alarm.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector("#oldAnalysisChart2"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: ["#FF9C00", "#0096FF"], // 通过这个color修改两条线的颜色
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- // formatter: '{a0}: {c0}<br />{a1}: {c1}<br />时间：' + chooseTime + ''
|
|
|
- formatter: function(params) {
|
|
|
- var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time2[params[0].dataIndex];
|
|
|
- return res;
|
|
|
- },
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#aaa"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "15%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: xData,
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#aaa", // 分割线颜色
|
|
|
- opacity: .2
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "电流",
|
|
|
- type: "line",
|
|
|
- smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(255,156,0, 0.4)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(255,156,0, 0.3)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "电压",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(0,150,255,0.5)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(0,150,255, 0.1)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[1]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- var img1 = document.getElementById('oldAnalysisChart2_img');
|
|
|
- setTimeout(function() {
|
|
|
- img1.src = myChart.getDataURL();
|
|
|
- }, 1000)
|
|
|
- })();
|
|
|
-
|
|
|
- // 热老化分析
|
|
|
- let thermal_aging = result.RESULT[0].thermal_aging;
|
|
|
-
|
|
|
- // 结论数据渲染
|
|
|
- var items = '';
|
|
|
- var conclusion = thermal_aging.conclusion
|
|
|
- for (x in conclusion) {
|
|
|
- xIndex = x.substr(x.length - 1, 1);
|
|
|
- items += `<div>${xIndex}、${conclusion[x]}</div>`
|
|
|
- }
|
|
|
- $('.exportBox .hotAnalysis .summaryDetail').html(items);
|
|
|
-
|
|
|
- // 热老化
|
|
|
- (function() {
|
|
|
-
|
|
|
- let a = [];
|
|
|
- let b = [];
|
|
|
- let c = [];
|
|
|
- let data_time = [];
|
|
|
- let visualization = thermal_aging.visualization;
|
|
|
- visualization.forEach(function(item, index) {
|
|
|
- a.push(item.generation_temperature)
|
|
|
- b.push(item.ambient_temperature)
|
|
|
- c.push(item.Cable_temperature)
|
|
|
- data_time.push(item.data_time)
|
|
|
- });
|
|
|
-
|
|
|
- var sortData = [{
|
|
|
- data: [a, b, c]
|
|
|
- }];
|
|
|
-
|
|
|
- var xData = function() {
|
|
|
- var data = [];
|
|
|
- for (var i = 1; i < visualization.length + 1; i++) {
|
|
|
- data.push(i);
|
|
|
- }
|
|
|
- return data;
|
|
|
- }();
|
|
|
-
|
|
|
- // 1. 实例化对象
|
|
|
- var myChart = echarts.init(document.querySelector("#hotAnalysisChart1"));
|
|
|
- // 2.指定配置
|
|
|
- var option = {
|
|
|
-
|
|
|
- color: ["#05EEE7", "#9999FF", "#FE92B3"], // 通过这个color修改三条线的颜色
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- textStyle: {
|
|
|
- align: 'left' //图例左对齐
|
|
|
- },
|
|
|
- backgroundColor: '#12DFE0',
|
|
|
- // formatter: '{a0}: {c0}°C<br />{a1}: {c1}°C<br />{a2}: {c2}°C<br />时间：' + chooseTime + ''
|
|
|
- formatter: function(params) {
|
|
|
- var res = params[0].seriesName + '：' + params[0].value + '°C<br />' + params[1].seriesName + '：' + params[1].value + '°C<br />' + params[1].seriesName + '：' + params[1].value + '°C<br />时间：' + data_time[params[0].dataIndex];
|
|
|
- return res;
|
|
|
- },
|
|
|
-
|
|
|
- },
|
|
|
- legend: {
|
|
|
- // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
- itemGap: 20,
|
|
|
- itemHeight: 2,
|
|
|
- itemWidth: 15,
|
|
|
- icon: 'rect',
|
|
|
- textStyle: {
|
|
|
- color: "#aaa"
|
|
|
- },
|
|
|
- top: "bottom",
|
|
|
- },
|
|
|
- grid: {
|
|
|
- top: "0%",
|
|
|
- left: "1%",
|
|
|
- right: "1%",
|
|
|
- bottom: "15%",
|
|
|
- show: true, // 显示边框
|
|
|
- borderWidth: '0', //去除边框
|
|
|
- containLabel: true // 包含刻度文字在内
|
|
|
- },
|
|
|
-
|
|
|
- xAxis: {
|
|
|
- type: "category",
|
|
|
- boundaryGap: false,
|
|
|
- data: xData,
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- color: "#AADDFF" // 文本颜色
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- axisTick: {
|
|
|
- show: false // 去除刻度线
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- show: false // 去除文本
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: false // 去除轴线
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#aaa", // 分割线颜色
|
|
|
- opacity: .2
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [{
|
|
|
- symbol: "none",
|
|
|
- name: "线缆产生的温度",
|
|
|
- type: "line",
|
|
|
- smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(5,238,231,.6)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(5,238,231, 0.4)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[0]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "环境温度",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(153,153,255,.6)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(153,153,255, 0.4)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[1]
|
|
|
- },
|
|
|
- {
|
|
|
- symbol: "none",
|
|
|
- name: "线缆温度",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 0,
|
|
|
- 1, [{
|
|
|
- offset: 0,
|
|
|
- color: "rgba(255,147,180,.6)"
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 0.8,
|
|
|
- color: "rgba(255,147,180, 0.4)"
|
|
|
- }
|
|
|
- ],
|
|
|
- false
|
|
|
- ),
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data: sortData[0].data[2]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- myChart.setOption(option);
|
|
|
- var img1 = document.getElementById('hotAnalysisChart1_img');
|
|
|
- setTimeout(function() {
|
|
|
- img1.src = myChart.getDataURL();
|
|
|
- }, 1000)
|
|
|
-
|
|
|
-
|
|
|
- })();
|
|
|
-
|
|
|
- /*
|
|
|
- 导出数据对接 end
|
|
|
- */
|
|
|
-
|
|
|
- } else {
|
|
|
- // alert('暂无数据')
|
|
|
- layui.use('layer', function() {
|
|
|
- var layer = layui.layer;
|
|
|
-
|
|
|
- layer.alert('暂无数据', { icon: 5 });
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- }, function(errorMsg) {
|
|
|
- layui.use('layer', function() {
|
|
|
- var layer = layui.layer;
|
|
|
- layer.alert('数据请求失败', { icon: 5 });
|
|
|
- });
|
|
|
- }, 1)
|
|
|
-};
|
|
|
-
|
|
|
-function getSearchParamObj() {
|
|
|
- let queryParam = {};
|
|
|
- let buildingVal = $('#building').val();
|
|
|
- let chooseTime = $('#chooseTime').val();
|
|
|
- queryParam.company_code = buildingVal;
|
|
|
- queryParam.generation_time = chooseTime;
|
|
|
- return queryParam;
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-// 打印
|
|
|
-(function() {
|
|
|
-
|
|
|
- $("#btnPrint").click(function() {
|
|
|
-
|
|
|
- print_detail()
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
- var print_detail = function() {
|
|
|
-
|
|
|
- //打印前echarts图表转换成图片 start
|
|
|
- $('#divergenceChart1_img,#divergenceChart2_img,#divergenceChart3_img,#divergenceChart4_img').show()
|
|
|
- $('#divergenceChart1,#divergenceChart2,#divergenceChart3,#divergenceChart4').hide()
|
|
|
- $('#oldAnalysisChart1_img,#oldAnalysisChart2_img').show()
|
|
|
- $('#oldAnalysisChart1,#oldAnalysisChart2').hide()
|
|
|
- $('#hotAnalysisChart1_img').show()
|
|
|
- $('#hotAnalysisChart1').hide()
|
|
|
- // end
|
|
|
-
|
|
|
- var div1_label1 = document.getElementById('printArea').innerHTML;
|
|
|
- var hkey_key;
|
|
|
- var hkey_root = 'HKEY_CURRENT_USER';
|
|
|
- var hkey_path = '\\Software\\Micorsoft\\Internet Explorer\\PageSetup\\';
|
|
|
- var print_win = window.open('打印窗口', '_blank');
|
|
|
- var div = document.createElement('div');
|
|
|
- div.setAttribute('width', '100%');
|
|
|
- div.setAttribute('height', '100%');
|
|
|
- var div_print = document.createElement('div');
|
|
|
- div_print.setAttribute('style', 'width:595px;height:842px;padding:50px 20px;margin:0px auto 0px auto');
|
|
|
- div_print.innerHTML = div1_label1;
|
|
|
- div.appendChild(div_print);
|
|
|
-
|
|
|
- print_win.document.write(div.innerHTML);
|
|
|
- print_win.document.close();
|
|
|
- try {
|
|
|
- var RegWsh = new ActiveXObject('WScript.Shell');
|
|
|
- hkey_key = 'header';
|
|
|
- RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, '');
|
|
|
- hkey_key = 'footer';
|
|
|
- RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, '');
|
|
|
- } catch (e) {}
|
|
|
- print_win.print();
|
|
|
- print_win.close();
|
|
|
- }
|
|
|
+/*
|
|
|
+ 电气火灾数据对接
|
|
|
+*/
|
|
|
+// const URL = document.location.protocol+"//"+window.location.host;
|
|
|
+//动态获取登录用户名
|
|
|
+// const aaa = sessionStorage.getItem('V_LOGINNAME');
|
|
|
+// const LOGIN_NAME = aaa;
|
|
|
+
|
|
|
+updateUserState({
|
|
|
+ "queryJson": '{"V_LOGINNAME": "'+LOGIN_NAME+'","STATE":1}' //用户名需更改为动态获取到的
|
|
|
+});
|
|
|
+
|
|
|
+function updateUserState(params = {}) {
|
|
|
+ $.ajax({
|
|
|
+ type: "POST",
|
|
|
+ url: URL + "/YtIoT/iot/userstate/updateUserState",
|
|
|
+ data: params,
|
|
|
+ success: function(data) {},
|
|
|
+ error: function() {
|
|
|
+ console.log("发生错误")
|
|
|
+ },
|
|
|
+ complete: function() {
|
|
|
+ // console.log("ajax请求完事，最终操作在这里完成")
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+//建筑下拉
|
|
|
+getNameList();
|
|
|
+
|
|
|
+function getNameList(queryParam = {}) {
|
|
|
+
|
|
|
+ ajaxRequest(GET_NAME_LIST_DATA, "POST", queryParam, function(result) {
|
|
|
+ let data = result.RESULT;
|
|
|
+ let items = '';
|
|
|
+
|
|
|
+ data.forEach(function(item, key) {
|
|
|
+
|
|
|
+ items += `<option value="${item.owner_id}">${item.owner_name}</option>`
|
|
|
+
|
|
|
+ })
|
|
|
+ $('#building').html(items);
|
|
|
+
|
|
|
+ }, function(errorMsg) {
|
|
|
+ // alert("请求数据失败!");
|
|
|
+ }, 2)
|
|
|
+};
|
|
|
+
|
|
|
+//日期筛选
|
|
|
+layui.use('laydate', function() {
|
|
|
+ var laydate = layui.laydate;
|
|
|
+ ///年月选择器
|
|
|
+ laydate.render({
|
|
|
+ elem: '#chooseTime',
|
|
|
+ type: 'month',
|
|
|
+ max: -30, //7天后
|
|
|
+ trigger: 'click', //呼出事件改成click
|
|
|
+ done: function(value, date, endDate) {
|
|
|
+ setTimeout(function() {
|
|
|
+ getListData(getSearchParamObj());
|
|
|
+ }, 100)
|
|
|
+ }
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
+});
|
|
|
+
|
|
|
+//建筑筛选
|
|
|
+$("#building").change(function() {
|
|
|
+ setTimeout(function() {
|
|
|
+ getListData(getSearchParamObj());
|
|
|
+ }, 100)
|
|
|
+
|
|
|
+});
|
|
|
+
|
|
|
+// 数据请求传参
|
|
|
+getListData(getSearchParamObj());
|
|
|
+
|
|
|
+function getListData(queryParam = {}) {
|
|
|
+
|
|
|
+ ajaxRequest(ELE_FIRE_DATA, "POST", queryParam, function(result) {
|
|
|
+
|
|
|
+ if (result.totalCount != 0) {
|
|
|
+
|
|
|
+ /*
|
|
|
+ 主页面数据对接 start
|
|
|
+ */
|
|
|
+
|
|
|
+ //数据统计
|
|
|
+ var data_statistics = result.RESULT[0].data_statistics;
|
|
|
+ $('.total').html(data_statistics.alarm_number);
|
|
|
+ $('.solved').html(data_statistics.processing_number);
|
|
|
+ $('.unsolve').html(data_statistics.unprocessed_number);
|
|
|
+
|
|
|
+ // 环状饼图定制 （数据统计计算）
|
|
|
+ (function() {
|
|
|
+ // 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector(".bar-3d .chart"));
|
|
|
+
|
|
|
+ // 生成扇形的曲面参数方程，用于 series-surface.parametricEquation
|
|
|
+ function getParametricEquation(startRatio, endRatio, isSelected, isHovered, k, height) {
|
|
|
+
|
|
|
+ // 计算
|
|
|
+ let midRatio = (startRatio + endRatio) / 2;
|
|
|
+
|
|
|
+ let startRadian = startRatio * Math.PI * 2;
|
|
|
+ let endRadian = endRatio * Math.PI * 2;
|
|
|
+ let midRadian = midRatio * Math.PI * 2;
|
|
|
+
|
|
|
+ // 如果只有一个扇形，则不实现选中效果。
|
|
|
+ if (startRatio === 0 && endRatio === 1) {
|
|
|
+ isSelected = false;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 通过扇形内径/外径的值，换算出辅助参数 k（默认值 1/3）
|
|
|
+ k = typeof k !== 'undefined' ? k : 1 / 3;
|
|
|
+
|
|
|
+ // 计算选中效果分别在 x 轴、y 轴方向上的位移（未选中，则位移均为 0）
|
|
|
+ let offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0;
|
|
|
+ let offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0;
|
|
|
+
|
|
|
+ // 计算高亮效果的放大比例（未高亮，则比例为 1）
|
|
|
+ let hoverRate = isHovered ? 1.05 : 1;
|
|
|
+
|
|
|
+ // 返回曲面参数方程
|
|
|
+ return {
|
|
|
+
|
|
|
+ u: {
|
|
|
+ min: -Math.PI,
|
|
|
+ max: Math.PI * 3,
|
|
|
+ step: Math.PI / 32
|
|
|
+ },
|
|
|
+
|
|
|
+ v: {
|
|
|
+ min: 0,
|
|
|
+ max: Math.PI * 2,
|
|
|
+ step: Math.PI / 20
|
|
|
+ },
|
|
|
+
|
|
|
+ x: function(u, v) {
|
|
|
+ if (u < startRadian) {
|
|
|
+ return offsetX + Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
+ }
|
|
|
+ if (u > endRadian) {
|
|
|
+ return offsetX + Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
+ }
|
|
|
+ return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
+ },
|
|
|
+
|
|
|
+ y: function(u, v) {
|
|
|
+ if (u < startRadian) {
|
|
|
+ return offsetY + Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
+ }
|
|
|
+ if (u > endRadian) {
|
|
|
+ return offsetY + Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
+ }
|
|
|
+ return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate;
|
|
|
+ },
|
|
|
+
|
|
|
+ z: function(u, v) {
|
|
|
+ if (u < -Math.PI * 0.5) {
|
|
|
+ return Math.sin(u);
|
|
|
+ }
|
|
|
+ if (u > Math.PI * 2.5) {
|
|
|
+ return Math.sin(u);
|
|
|
+ }
|
|
|
+ return Math.sin(v) > 0 ? 1 : -1;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ }
|
|
|
+
|
|
|
+ // 生成模拟 3D 饼图的配置项
|
|
|
+ function getPie3D(pieData, internalDiameterRatio) {
|
|
|
+
|
|
|
+ let series = [];
|
|
|
+ let sumValue = 0;
|
|
|
+ let startValue = 0;
|
|
|
+ let endValue = 0;
|
|
|
+ let legendData = [];
|
|
|
+ let k = typeof internalDiameterRatio !== 'undefined' ? 1 : 1 / 3;
|
|
|
+
|
|
|
+ // 为每一个饼图数据，生成一个 series-surface 配置
|
|
|
+ for (let i = 0; i < pieData.length; i++) {
|
|
|
+
|
|
|
+ sumValue += pieData[i].value;
|
|
|
+
|
|
|
+ let seriesItem = {
|
|
|
+ name: typeof pieData[i].name === 'undefined' ? `series${i}` : pieData[i].name,
|
|
|
+ type: 'surface',
|
|
|
+ parametric: true,
|
|
|
+ wireframe: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ pieData: pieData[i],
|
|
|
+ pieStatus: {
|
|
|
+ selected: false,
|
|
|
+ hovered: false,
|
|
|
+ k: k
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ if (typeof pieData[i].itemStyle != 'undefined') {
|
|
|
+
|
|
|
+ let itemStyle = {};
|
|
|
+
|
|
|
+ typeof pieData[i].itemStyle.color != 'undefined' ? itemStyle.color = pieData[i].itemStyle.color : null;
|
|
|
+ typeof pieData[i].itemStyle.opacity != 'undefined' ? itemStyle.opacity = pieData[i].itemStyle.opacity : null;
|
|
|
+
|
|
|
+ seriesItem.itemStyle = itemStyle;
|
|
|
+ }
|
|
|
+ series.push(seriesItem);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 使用上一次遍历时，计算出的数据和 sumValue，调用 getParametricEquation 函数，
|
|
|
+ // 向每个 series-surface 传入不同的参数方程 series-surface.parametricEquation，也就是实现每一个扇形。
|
|
|
+ for (let i = 0; i < series.length; i++) {
|
|
|
+ endValue = startValue + series[i].pieData.value;
|
|
|
+ // console.log(series[i]);
|
|
|
+ series[i].pieData.startRatio = startValue / sumValue;
|
|
|
+ series[i].pieData.endRatio = endValue / sumValue;
|
|
|
+ series[i].parametricEquation = getParametricEquation(series[i].pieData.startRatio, series[i].pieData.endRatio, false, false, k, series[i].pieData.value);
|
|
|
+
|
|
|
+ startValue = endValue;
|
|
|
+
|
|
|
+ legendData.push(series[i].name);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // 准备待返回的配置项，把准备好的 legendData、series 传入。
|
|
|
+ let option = {
|
|
|
+
|
|
|
+ tooltip: {
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ formatter: params => {
|
|
|
+ if (params.seriesName !== 'mouseoutSeries') {
|
|
|
+ // return `${params.seriesName}<br/><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color};"></span>${option.series[params.seriesIndex].pieData.value}%`;
|
|
|
+ return `${params.seriesName}: ${option.series[params.seriesIndex].pieData.value}%`;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis3D: {
|
|
|
+ min: -1,
|
|
|
+ max: 1
|
|
|
+ },
|
|
|
+ yAxis3D: {
|
|
|
+ min: -1,
|
|
|
+ max: 1
|
|
|
+ },
|
|
|
+ zAxis3D: {
|
|
|
+ min: -1,
|
|
|
+ max: 1
|
|
|
+ },
|
|
|
+ grid3D: {
|
|
|
+
|
|
|
+
|
|
|
+ show: false,
|
|
|
+ boxHeight: 50,
|
|
|
+ top: '-10%',
|
|
|
+ // bottom: '80%',
|
|
|
+ // environment: '../images/3d-bg.png', //aa背景色
|
|
|
+
|
|
|
+ viewControl: {
|
|
|
+ distance: 260, //aa距离
|
|
|
+ alpha: 21, //aa角度
|
|
|
+ beta: 60, //aa角度
|
|
|
+ zoomSensitivity: false //是否开启缩放和平移
|
|
|
+ },
|
|
|
+ },
|
|
|
+ series: series
|
|
|
+ };
|
|
|
+ return option;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 传入数据生成 option
|
|
|
+ var option = getPie3D([{
|
|
|
+ name: '已处理率',
|
|
|
+ value: data_statistics.treatment_rate,
|
|
|
+ itemStyle: {
|
|
|
+ opacity: 0.5,
|
|
|
+ color: 'rgba(0,127,244,.8)',
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ name: '未处理率',
|
|
|
+ value: data_statistics.untreated_rate,
|
|
|
+ itemStyle: {
|
|
|
+ opacity: 0.5,
|
|
|
+ color: 'rgba(209,126,23,.8)',
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ ], 2);
|
|
|
+
|
|
|
+ // 把配置给实例对象
|
|
|
+ myChart.setOption(option);
|
|
|
+ window.addEventListener("resize", function() {
|
|
|
+ myChart.resize();
|
|
|
+ });
|
|
|
+
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 折线图定制 (数据离散率挖掘)
|
|
|
+ (function() {
|
|
|
+
|
|
|
+ let dispersion_rate = result.RESULT[0].dispersion_rate;
|
|
|
+
|
|
|
+ // 结论数据渲染
|
|
|
+ var items = '';
|
|
|
+ var conclusion = dispersion_rate.conclusion
|
|
|
+ for (x in conclusion) {
|
|
|
+ xIndex = x.substr(x.length - 1, 1);
|
|
|
+ items += `<p>${xIndex}、${conclusion[x]}</p>`
|
|
|
+ }
|
|
|
+ $('.divergence .summaryDetail').html(items);
|
|
|
+
|
|
|
+ // 三相电压
|
|
|
+ let a = [];
|
|
|
+ let b = [];
|
|
|
+ let c = [];
|
|
|
+ let d = [];
|
|
|
+ let voltage = dispersion_rate.voltage;
|
|
|
+ voltage.forEach(function(item, index) {
|
|
|
+ a.push(item.variance)
|
|
|
+ b.push(item.standard_deviation)
|
|
|
+ c.push(item.average_value)
|
|
|
+ d.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+ // 三相电流
|
|
|
+ let a2 = [];
|
|
|
+ let b2 = [];
|
|
|
+ let c2 = [];
|
|
|
+ let d2 = [];
|
|
|
+ let electric_current = dispersion_rate.electric_current;
|
|
|
+ electric_current.forEach(function(item, index) {
|
|
|
+ a2.push(item.variance)
|
|
|
+ b2.push(item.standard_deviation)
|
|
|
+ c2.push(item.average_value)
|
|
|
+ d2.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+ // 三相温度
|
|
|
+ let a3 = [];
|
|
|
+ let b3 = [];
|
|
|
+ let c3 = [];
|
|
|
+ let d3 = [];
|
|
|
+ let temperature = dispersion_rate.temperature;
|
|
|
+ temperature.forEach(function(item, index) {
|
|
|
+ a3.push(item.variance)
|
|
|
+ b3.push(item.standard_deviation)
|
|
|
+ c3.push(item.average_value)
|
|
|
+ d3.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+ // 漏电电流
|
|
|
+ let a4 = [];
|
|
|
+ let b4 = [];
|
|
|
+ let c4 = [];
|
|
|
+ let d4 = [];
|
|
|
+ let leakage_current = dispersion_rate.leakage_current;
|
|
|
+ leakage_current.forEach(function(item, index) {
|
|
|
+ a4.push(item.variance)
|
|
|
+ b4.push(item.standard_deviation)
|
|
|
+ c4.push(item.average_value)
|
|
|
+ d4.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "三相电压",
|
|
|
+ data: [a, b, c, d]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ sortName: "三相电流",
|
|
|
+ data: [a2, b2, c2, d2]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ sortName: "三相温度",
|
|
|
+ data: [a3, b3, c3, d3]
|
|
|
+ }, {
|
|
|
+ sortName: "漏电电流",
|
|
|
+ data: [a4, b4, c4, d4]
|
|
|
+ },
|
|
|
+ ];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < leakage_current.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector(".divergence .chart"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: [{
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#F9860C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#fff' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#07E1F1' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#0456CB' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#11F90C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#3FC713' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ ],
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#fff"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "20%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: d,
|
|
|
+ axisTick: {
|
|
|
+ show: true
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ show: false,
|
|
|
+ // color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: 'rgba(255,255,255,.3)'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ splitNumber: 8,
|
|
|
+ splitLine: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ splitArea: {
|
|
|
+ show: true,
|
|
|
+ areaStyle: {
|
|
|
+ color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ // scale: true,
|
|
|
+ // min: 'dataMin',
|
|
|
+ type: "value",
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#012f4a" // 分割线颜色
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "方差",
|
|
|
+ type: "line",
|
|
|
+ data: a
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "标准差",
|
|
|
+ type: "line",
|
|
|
+ data: b
|
|
|
+ }, {
|
|
|
+ symbol: "none",
|
|
|
+ name: "平均值",
|
|
|
+ type: "line",
|
|
|
+ data: c
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ window.addEventListener("resize", function() {
|
|
|
+ myChart.resize();
|
|
|
+ });
|
|
|
+
|
|
|
+ // 点击切换效果
|
|
|
+ $(".divergence .tab-line").on("click", "a", function() {
|
|
|
+ $(this).addClass('active').siblings().removeClass('active')
|
|
|
+ var obj = sortData[$(this).index()];
|
|
|
+ option.series[0].data = obj.data[0];
|
|
|
+ option.series[1].data = obj.data[1];
|
|
|
+ option.series[2].data = obj.data[2];
|
|
|
+
|
|
|
+ // 重新渲染
|
|
|
+ myChart.setOption(option);
|
|
|
+
|
|
|
+ });
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 折线图定制 (电老化分析)
|
|
|
+ (function() {
|
|
|
+
|
|
|
+ let electrical_aging = result.RESULT[0].electrical_aging;
|
|
|
+ // console.log(electrical_aging)
|
|
|
+
|
|
|
+ // 结论数据渲染
|
|
|
+ var items = '';
|
|
|
+ var conclusion = electrical_aging.conclusion
|
|
|
+ for (x in conclusion) {
|
|
|
+ xIndex = x.substr(x.length - 1, 1);
|
|
|
+ items += `<p>${xIndex}、${conclusion[x]}</p>`
|
|
|
+ }
|
|
|
+ $('.oldAnalysis .summaryDetail').html(items);
|
|
|
+
|
|
|
+
|
|
|
+ // 异常设备监控电缆数据
|
|
|
+ let a = [];
|
|
|
+ let b = [];
|
|
|
+ let data_time = [];
|
|
|
+
|
|
|
+ let abnormal_equipment = electrical_aging.abnormal_equipment;
|
|
|
+ abnormal_equipment.forEach(function(item, index) {
|
|
|
+ a.push(item.electric_current)
|
|
|
+ b.push(item.voltage)
|
|
|
+ data_time.push(item.data_time)
|
|
|
+ });
|
|
|
+ // console.log(data_time)
|
|
|
+
|
|
|
+ // 漏电告警数据
|
|
|
+ let a2 = [];
|
|
|
+ let b2 = [];
|
|
|
+ let data_time2 = [];
|
|
|
+
|
|
|
+ let leakage_alarm = electrical_aging.leakage_alarm;
|
|
|
+ leakage_alarm.forEach(function(item, index) {
|
|
|
+ a2.push(item.electric_current)
|
|
|
+ b2.push(item.voltage)
|
|
|
+ data_time2.push(item.data_time)
|
|
|
+ });
|
|
|
+ // console.log(data_time2)
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "异常设备",
|
|
|
+ data: [a, b]
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ sortName: "漏电告警",
|
|
|
+ data: [a2, b2]
|
|
|
+ }
|
|
|
+ ];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < leakage_alarm.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector(".oldAnalysis .chart"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: ["#FF9C00", "#0096FF"], // 通过这个color修改两条线的颜色
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+
|
|
|
+ formatter: function(params) {
|
|
|
+ if ($('#active').hasClass('active')) {
|
|
|
+ var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time[params[0].dataIndex];
|
|
|
+ } else {
|
|
|
+ var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time2[params[0].dataIndex];
|
|
|
+ }
|
|
|
+ return res;
|
|
|
+ },
|
|
|
+ // formatter: '{a0}: {c0}<br />{a1}: {c1}<br />时间：' + chooseTime + ''
|
|
|
+
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#fff"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "15%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: xData,
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ type: "value",
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#012f4a" // 分割线颜色
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "电流",
|
|
|
+ type: "line",
|
|
|
+ smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
+ areaStyle: {
|
|
|
+ normal: {
|
|
|
+ color: new echarts.graphic.LinearGradient(
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 1, [{
|
|
|
+ offset: 0,
|
|
|
+ color: "rgba(255,156,0, 0.4)"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.8,
|
|
|
+ color: "rgba(255,156,0, 0.3)"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ false
|
|
|
+ ),
|
|
|
+ shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ data: sortData[0].data[0]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "电压",
|
|
|
+ type: "line",
|
|
|
+ smooth: true,
|
|
|
+ areaStyle: {
|
|
|
+ normal: {
|
|
|
+ color: new echarts.graphic.LinearGradient(
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 1, [{
|
|
|
+ offset: 0,
|
|
|
+ color: "rgba(0,150,255,0.5)"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.8,
|
|
|
+ color: "rgba(0,150,255, 0.1)"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ false
|
|
|
+ ),
|
|
|
+ shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ data: sortData[0].data[1]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ window.addEventListener("resize", function() {
|
|
|
+ myChart.resize();
|
|
|
+ });
|
|
|
+
|
|
|
+ // 点击切换效果
|
|
|
+ $(".oldAnalysis .tab-line").on("click", "a", function() {
|
|
|
+ $(this).addClass('active').siblings().removeClass('active')
|
|
|
+ var obj = sortData[$(this).index()];
|
|
|
+ option.series[0].data = obj.data[0];
|
|
|
+ option.series[1].data = obj.data[1];
|
|
|
+ // 重新渲染
|
|
|
+ myChart.setOption(option);
|
|
|
+
|
|
|
+ });
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 柱状图定制 (热老化分析)
|
|
|
+
|
|
|
+
|
|
|
+ (function() {
|
|
|
+
|
|
|
+ let thermal_aging = result.RESULT[0].thermal_aging;
|
|
|
+
|
|
|
+
|
|
|
+ // 结论数据渲染
|
|
|
+ var items = '';
|
|
|
+ var conclusion = thermal_aging.conclusion
|
|
|
+ for (x in conclusion) {
|
|
|
+ xIndex = x.substr(x.length - 1, 1);
|
|
|
+ items += `<p>${xIndex}、${conclusion[x]}</p>`
|
|
|
+ }
|
|
|
+ $('.hotAnalysis .summaryDetail').html(items);
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ let a = [];
|
|
|
+ let b = [];
|
|
|
+ let c = [];
|
|
|
+ let data_time = [];
|
|
|
+ let visualization = thermal_aging.visualization;
|
|
|
+
|
|
|
+ visualization.forEach(function(item, index) {
|
|
|
+ a.push(item.generation_temperature)
|
|
|
+ b.push(item.ambient_temperature)
|
|
|
+ c.push(item.Cable_temperature)
|
|
|
+ data_time.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ data: [
|
|
|
+ // 三个数组是因为有3条线
|
|
|
+ a, b, c
|
|
|
+ ]
|
|
|
+ }];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < visualization.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector(".hotAnalysis .chart"));
|
|
|
+ // var xData = position;
|
|
|
+
|
|
|
+ var xData = xData;
|
|
|
+
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+ backgroundColor: 'transparent',
|
|
|
+ color: ['rgba(5,238,231,.6)', 'rgba(153,153,255,.6)', 'rgba(255,147,180,.6)'],
|
|
|
+ tooltip: {
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ //提示框组件
|
|
|
+ trigger: 'axis',
|
|
|
+ formatter: function(params) {
|
|
|
+ var res = params[0].seriesName + '：' + params[0].value + '°C<br />' + params[1].seriesName + '：' + params[1].value + '°C<br />' + params[2].seriesName + '：' + params[2].value + '°C<br />' + data_time[params[1].dataIndex];
|
|
|
+ return res;
|
|
|
+ },
|
|
|
+ axisPointer: {
|
|
|
+ type: 'shadow',
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontStyle: 'normal',
|
|
|
+ fontFamily: '微软雅黑',
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: '0',
|
|
|
+ right: '0',
|
|
|
+ bottom: '40',
|
|
|
+ top: '0',
|
|
|
+ containLabel: true,
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#fff"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ //添加横线滚动条
|
|
|
+ dataZoom: {
|
|
|
+ start: 0, //默认为0
|
|
|
+ end: 100 - 1500 / 10, //默认为100
|
|
|
+ type: 'slider',
|
|
|
+ show: xData.length > 4 ? true : false,
|
|
|
+ xAxisIndex: [0],
|
|
|
+ handleSize: 0, //滑动条的 左右2个滑动条的大小
|
|
|
+ height: 4, //组件高度
|
|
|
+ left: 20, //左边的距离
|
|
|
+ right: 20, //右边的距离
|
|
|
+ bottom: 30, //右边的距离
|
|
|
+ handleColor: '#CBBCDB', //h滑动图标的颜色
|
|
|
+ handleStyle: {
|
|
|
+ borderColor: "#CBBCDB",
|
|
|
+ borderWidth: "1",
|
|
|
+ shadowBlur: 2,
|
|
|
+ background: "#CBBCDB",
|
|
|
+ shadowColor: "#CBBCDB",
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ color: "#fff"
|
|
|
+ },
|
|
|
+
|
|
|
+ backgroundColor: 'rgba(37, 46, 100, 0.45)', //两边未选中的滑动条区域的颜色
|
|
|
+ showDataShadow: false, //是否显示数据阴影 默认auto
|
|
|
+ // showDetail: false, //即拖拽时候是否显示详细数值信息 默认true
|
|
|
+ filterMode: 'filter',
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ xAxis: [{
|
|
|
+ type: 'category',
|
|
|
+ // boundaryGap: true,//坐标轴两边留白
|
|
|
+ data: xData,
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ // rotate: 340,
|
|
|
+ // formatter: function(val) {
|
|
|
+ // return val.split("").join("\n");
|
|
|
+ // }, //横轴信息文字竖直显示
|
|
|
+ textStyle: {
|
|
|
+ color: '#AADDFF',
|
|
|
+ fontStyle: 'normal',
|
|
|
+ fontFamily: '微软雅黑',
|
|
|
+ fontSize: 12,
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ axisTick: {
|
|
|
+ //坐标轴刻度相关设置。
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ //坐标轴轴线相关设置
|
|
|
+
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ //坐标轴在 grid 区域中的分隔线。
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ }, ],
|
|
|
+ yAxis: [{
|
|
|
+ type: 'value',
|
|
|
+
|
|
|
+ axisLabel: false,
|
|
|
+ axisLine: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ axisTick: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: true,
|
|
|
+ lineStyle: {
|
|
|
+ color: ['#204C6F'],
|
|
|
+ opacity: 0.3,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ boundaryGap: ['0', '1%'],
|
|
|
+ }],
|
|
|
+ series: [{
|
|
|
+ name: '线缆产生的温度',
|
|
|
+ type: 'bar',
|
|
|
+ data: sortData[0].data[0],
|
|
|
+ barMaxWidth: '11',
|
|
|
+ itemStyle: {
|
|
|
+ borderColor: "#05EEE7",
|
|
|
+ },
|
|
|
+ barGap: '50%',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '环境温度',
|
|
|
+ type: 'bar',
|
|
|
+ data: sortData[0].data[1],
|
|
|
+ barMaxWidth: '11',
|
|
|
+ itemStyle: {
|
|
|
+ borderColor: "#9999FF"
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '线缆温度',
|
|
|
+ type: 'bar',
|
|
|
+ data: sortData[0].data[2],
|
|
|
+ barMaxWidth: '11',
|
|
|
+ itemStyle: {
|
|
|
+ borderColor: "#FE92B3",
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ ],
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ window.addEventListener("resize", function() {
|
|
|
+ myChart.resize();
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ })();
|
|
|
+
|
|
|
+ /*
|
|
|
+ 主页面数据对接 end
|
|
|
+ */
|
|
|
+
|
|
|
+
|
|
|
+ /*
|
|
|
+ 导出数据对接 start
|
|
|
+ */
|
|
|
+
|
|
|
+
|
|
|
+ //项目情况
|
|
|
+ var project_situation = result.RESULT[0].project_situation;
|
|
|
+ var items = '';
|
|
|
+ items = `<tr>
|
|
|
+ <td>单位名称</td>
|
|
|
+ <td colspan="5">${project_situation.company_name}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>进场日期</td>
|
|
|
+ <td>${project_situation.entry_date} </td>
|
|
|
+ <td>完工日期</td>
|
|
|
+ <td>${project_situation.completion_date}</td>
|
|
|
+ <td>验收日期</td>
|
|
|
+ <td>${project_situation.acceptance_date}</td>
|
|
|
+ </tr>`
|
|
|
+ $('#project_situation').html(items);
|
|
|
+
|
|
|
+ //设备清单
|
|
|
+ var equipment_list = result.RESULT[0].equipment_list;
|
|
|
+ var items2 = '';
|
|
|
+ if (equipment_list) {
|
|
|
+ equipment_list.forEach(function(item, key) {
|
|
|
+ items2 += `<tr>
|
|
|
+ <td>${item.device_name}</td>
|
|
|
+ <td>${item.device_info}</td>
|
|
|
+ <td>${item.device_code}</td>
|
|
|
+ <td>${item.remarks}</td>
|
|
|
+ </tr>`;
|
|
|
+ })
|
|
|
+ $('#equipment_list').html(items2)
|
|
|
+ }
|
|
|
+
|
|
|
+ //统计时段
|
|
|
+ var statistical_period = result.RESULT[0].statistical_period;
|
|
|
+ var items3 = '';
|
|
|
+ items3 = `<div>统计起始日期：${statistical_period.start_date}</div>
|
|
|
+ <div>统计截止日期：${statistical_period.closing_date}</div>
|
|
|
+ <div>统计时段时长：${statistical_period.duration}</div>`;
|
|
|
+ $('#statistical_period').html(items3)
|
|
|
+
|
|
|
+ //数据统计计算
|
|
|
+ var data_statistics = result.RESULT[0].data_statistics;
|
|
|
+ var items4 = '';
|
|
|
+ items4 = `<tr>
|
|
|
+ <td>${data_statistics.alarm_number}</td>
|
|
|
+ <td>${data_statistics.processing_number}</td>
|
|
|
+ <td>${data_statistics.unprocessed_number}</td>
|
|
|
+ <td>${data_statistics.treatment_rate}</td>
|
|
|
+ <td>${data_statistics.untreated_rate}</td>
|
|
|
+ </tr>`;
|
|
|
+ $('#data_statistics').html(items4);
|
|
|
+
|
|
|
+
|
|
|
+ // 数据离散率挖掘
|
|
|
+ let dispersion_rate = result.RESULT[0].dispersion_rate;
|
|
|
+
|
|
|
+ // 结论数据渲染
|
|
|
+ var items = '';
|
|
|
+ var conclusion = dispersion_rate.conclusion
|
|
|
+ for (x in conclusion) {
|
|
|
+ xIndex = x.substr(x.length - 1, 1);
|
|
|
+ items += `<div>${xIndex}、${conclusion[x]}</div>`
|
|
|
+ }
|
|
|
+ $('.exportBox .divergence .summaryDetail').html(items);
|
|
|
+
|
|
|
+ // 数据离散率挖掘1
|
|
|
+ (function() {
|
|
|
+ // 三相电压
|
|
|
+ let a = [];
|
|
|
+ let b = [];
|
|
|
+ let c = [];
|
|
|
+ let d = [];
|
|
|
+ let voltage = dispersion_rate.voltage;
|
|
|
+ voltage.forEach(function(item, index) {
|
|
|
+ a.push(item.variance)
|
|
|
+ b.push(item.standard_deviation)
|
|
|
+ c.push(item.average_value)
|
|
|
+ d.push(item.data_time)
|
|
|
+ });
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "三相电压",
|
|
|
+ data: [
|
|
|
+ a, b, c, d
|
|
|
+ ]
|
|
|
+ }, ];
|
|
|
+
|
|
|
+ // var xData = function() {
|
|
|
+ // var data = [];
|
|
|
+ // for (var i = 1; i < voltage.length + 1; i++) {
|
|
|
+ // data.push(i);
|
|
|
+ // }
|
|
|
+ // return data;
|
|
|
+ // }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector("#divergenceChart1"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: [{
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#F9860C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#fff' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#07E1F1' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#0456CB' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#11F90C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#3FC713' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ ],
|
|
|
+
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
+
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#aaa"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "20%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: d,
|
|
|
+ axisTick: {
|
|
|
+ lineStyle: { color: 'rgb(150,150,150)' }
|
|
|
+ // show: true // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ show: false,
|
|
|
+ color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: 'rgba(255,255,255,.3)'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ splitArea: {
|
|
|
+ show: true,
|
|
|
+ areaStyle: {
|
|
|
+ color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ splitNumber: 8,
|
|
|
+ type: "value",
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#aaa", // 分割线颜色
|
|
|
+ opacity: .2
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "方差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[0]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "标准差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[1]
|
|
|
+ }, {
|
|
|
+ symbol: "none",
|
|
|
+ name: "平均值",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[2]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+
|
|
|
+ //echarts赋值到src
|
|
|
+ var img1 = document.getElementById('divergenceChart1_img');
|
|
|
+ setTimeout(function() {
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
+ }, 1000)
|
|
|
+
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 数据离散率挖掘2
|
|
|
+ (function() {
|
|
|
+
|
|
|
+ // 三相电流
|
|
|
+ let a2 = [];
|
|
|
+ let b2 = [];
|
|
|
+ let c2 = [];
|
|
|
+ let d2 = [];
|
|
|
+ let electric_current = dispersion_rate.electric_current;
|
|
|
+ electric_current.forEach(function(item, index) {
|
|
|
+ a2.push(item.variance)
|
|
|
+ b2.push(item.standard_deviation)
|
|
|
+ c2.push(item.average_value)
|
|
|
+ d2.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "三相电流",
|
|
|
+ data: [
|
|
|
+ a2, b2, c2
|
|
|
+ ]
|
|
|
+ },
|
|
|
+
|
|
|
+ ];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < electric_current.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector("#divergenceChart2"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: [{
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#F9860C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#fff' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#07E1F1' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#0456CB' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#11F90C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#3FC713' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ ],
|
|
|
+
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
+
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#aaa"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "20%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: d2,
|
|
|
+ axisTick: {
|
|
|
+ lineStyle: { color: 'rgb(150,150,150)' },
|
|
|
+ show: true
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ show: false,
|
|
|
+ color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: 'rgba(255,255,255,.3)'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ splitNumber: 8,
|
|
|
+ splitLine: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ splitArea: {
|
|
|
+ show: true,
|
|
|
+ areaStyle: {
|
|
|
+ color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ type: "value",
|
|
|
+ splitNumber: 8,
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#aaa", // 分割线颜色
|
|
|
+ opacity: .2
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "方差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[0]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "标准差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[1]
|
|
|
+ }, {
|
|
|
+ symbol: "none",
|
|
|
+ name: "平均值",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[2]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+
|
|
|
+ //echarts赋值到src
|
|
|
+ var img1 = document.getElementById('divergenceChart2_img');
|
|
|
+ setTimeout(function() {
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
+ }, 1000)
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 数据离散率挖掘3
|
|
|
+ (function() {
|
|
|
+ // 三相温度
|
|
|
+ let a3 = [];
|
|
|
+ let b3 = [];
|
|
|
+ let c3 = [];
|
|
|
+ let d3 = [];
|
|
|
+ let temperature = dispersion_rate.temperature;
|
|
|
+ temperature.forEach(function(item, index) {
|
|
|
+ a3.push(item.variance)
|
|
|
+ b3.push(item.standard_deviation)
|
|
|
+ c3.push(item.average_value)
|
|
|
+ d3.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "三相温度",
|
|
|
+ data: [
|
|
|
+ a3, b3, c3
|
|
|
+ ]
|
|
|
+ }, ];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < temperature.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector("#divergenceChart3"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: [{
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#F9860C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#fff' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#07E1F1' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#0456CB' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#11F90C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#3FC713' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ ],
|
|
|
+
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
+
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#aaa"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "20%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: d3,
|
|
|
+ axisTick: {
|
|
|
+ lineStyle: { color: 'rgb(150,150,150)' },
|
|
|
+ show: true
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ show: false,
|
|
|
+ color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: 'rgba(255,255,255,.3)'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ splitNumber: 8,
|
|
|
+ splitLine: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ splitArea: {
|
|
|
+ show: true,
|
|
|
+ areaStyle: {
|
|
|
+ color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ type: "value",
|
|
|
+ axisTick: {
|
|
|
+
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#aaa", // 分割线颜色
|
|
|
+ opacity: .2
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "方差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[0]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "标准差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[1]
|
|
|
+ }, {
|
|
|
+ symbol: "none",
|
|
|
+ name: "平均值",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[2]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ //echarts赋值到src
|
|
|
+ var img1 = document.getElementById('divergenceChart3_img');
|
|
|
+ setTimeout(function() {
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
+ }, 1000)
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 数据离散率挖掘4
|
|
|
+ (function() {
|
|
|
+ // 漏电电流
|
|
|
+ let a4 = [];
|
|
|
+ let b4 = [];
|
|
|
+ let c4 = [];
|
|
|
+ let d4 = [];
|
|
|
+ let leakage_current = dispersion_rate.leakage_current;
|
|
|
+ leakage_current.forEach(function(item, index) {
|
|
|
+ a4.push(item.variance)
|
|
|
+ b4.push(item.standard_deviation)
|
|
|
+ c4.push(item.average_value)
|
|
|
+ d4.push(item.data_time)
|
|
|
+ });
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "三相电流",
|
|
|
+ data: [
|
|
|
+ a4, b4, c4
|
|
|
+ ]
|
|
|
+ }, ];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < leakage_current.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector("#divergenceChart4"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: [{
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#F9860C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#fff' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#07E1F1' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#0456CB' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+
|
|
|
+ colorStops: [{
|
|
|
+ offset: 0,
|
|
|
+ color: '#11F90C' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1,
|
|
|
+ color: '#3FC713' // 100% 处的颜色
|
|
|
+ }],
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ ],
|
|
|
+
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ formatter: '{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}<br />时间：{b}'
|
|
|
+
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#aaa"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "20%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: d4,
|
|
|
+ axisTick: {
|
|
|
+ lineStyle: { color: 'rgb(150,150,150)' },
|
|
|
+ show: true
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ show: false,
|
|
|
+ // color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: 'rgba(255,255,255,.3)'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ splitNumber: 8,
|
|
|
+ splitLine: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ splitArea: {
|
|
|
+ show: true,
|
|
|
+ areaStyle: {
|
|
|
+ color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ type: "value",
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#aaa", // 分割线颜色
|
|
|
+ opacity: .2
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "方差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[0]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "标准差",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[1]
|
|
|
+ }, {
|
|
|
+ symbol: "none",
|
|
|
+ name: "平均值",
|
|
|
+ type: "line",
|
|
|
+ data: sortData[0].data[2]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ //echarts赋值到src
|
|
|
+ var img1 = document.getElementById('divergenceChart4_img');
|
|
|
+ setTimeout(function() {
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
+ }, 1000)
|
|
|
+ })();
|
|
|
+
|
|
|
+
|
|
|
+ // 电老化分析
|
|
|
+ let electrical_aging = result.RESULT[0].electrical_aging;
|
|
|
+
|
|
|
+ // 结论数据渲染
|
|
|
+ var items = '';
|
|
|
+ var conclusion = electrical_aging.conclusion
|
|
|
+ for (x in conclusion) {
|
|
|
+ xIndex = x.substr(x.length - 1, 1);
|
|
|
+ items += `<div>${xIndex}、${conclusion[x]}</div>`
|
|
|
+ }
|
|
|
+ $('.exportBox .oldAnalysis .summaryDetail').html(items);
|
|
|
+
|
|
|
+ // 电老化分析1
|
|
|
+ (function() {
|
|
|
+ // 异常设备监控电缆数据
|
|
|
+ let a = [];
|
|
|
+ let b = [];
|
|
|
+ let data_time = [];
|
|
|
+
|
|
|
+ let abnormal_equipment = electrical_aging.abnormal_equipment;
|
|
|
+ abnormal_equipment.forEach(function(item, index) {
|
|
|
+ a.push(item.electric_current)
|
|
|
+ b.push(item.voltage)
|
|
|
+ data_time.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "异常设备",
|
|
|
+ data: [a, b]
|
|
|
+ },
|
|
|
+
|
|
|
+ ];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < abnormal_equipment.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector("#oldAnalysisChart1"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: ["#FF9C00", "#0096FF"], // 通过这个color修改两条线的颜色
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+
|
|
|
+ // formatter: '{a0}: {c0}<br />{a1}: {c1}<br />时间：' + chooseTime + ''
|
|
|
+ formatter: function(params) {
|
|
|
+ var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time[params[0].dataIndex];
|
|
|
+ return res;
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#aaa"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "15%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: xData,
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ type: "value",
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#aaa", // 分割线颜色
|
|
|
+ opacity: .2
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "电流",
|
|
|
+ type: "line",
|
|
|
+ smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
+ areaStyle: {
|
|
|
+ normal: {
|
|
|
+ color: new echarts.graphic.LinearGradient(
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 1, [{
|
|
|
+ offset: 0,
|
|
|
+ color: "rgba(255,156,0, 0.4)"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.8,
|
|
|
+ color: "rgba(255,156,0, 0.3)"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ false
|
|
|
+ ),
|
|
|
+ shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ data: sortData[0].data[0]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "电压",
|
|
|
+ type: "line",
|
|
|
+ smooth: true,
|
|
|
+ areaStyle: {
|
|
|
+ normal: {
|
|
|
+ color: new echarts.graphic.LinearGradient(
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 1, [{
|
|
|
+ offset: 0,
|
|
|
+ color: "rgba(0,150,255,0.5)"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.8,
|
|
|
+ color: "rgba(0,150,255, 0.1)"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ false
|
|
|
+ ),
|
|
|
+ shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ data: sortData[0].data[1]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ var img1 = document.getElementById('oldAnalysisChart1_img');
|
|
|
+ setTimeout(function() {
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
+ }, 1000)
|
|
|
+
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 电老化分析2
|
|
|
+ (function() {
|
|
|
+
|
|
|
+ // 漏电告警数据
|
|
|
+ let a2 = [];
|
|
|
+ let b2 = [];
|
|
|
+ let data_time2 = [];
|
|
|
+
|
|
|
+ let leakage_alarm = electrical_aging.leakage_alarm;
|
|
|
+ leakage_alarm.forEach(function(item, index) {
|
|
|
+ a2.push(item.electric_current)
|
|
|
+ b2.push(item.voltage)
|
|
|
+ data_time2.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ sortName: "漏电告警",
|
|
|
+ data: [a2, b2]
|
|
|
+ }];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < leakage_alarm.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector("#oldAnalysisChart2"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ color: ["#FF9C00", "#0096FF"], // 通过这个color修改两条线的颜色
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ // formatter: '{a0}: {c0}<br />{a1}: {c1}<br />时间：' + chooseTime + ''
|
|
|
+ formatter: function(params) {
|
|
|
+ var res = params[0].seriesName + '：' + params[0].value + 'mA<br />' + params[1].seriesName + '：' + params[1].value + 'V<br />时间：' + data_time2[params[0].dataIndex];
|
|
|
+ return res;
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#aaa"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "0%",
|
|
|
+ left: "1%",
|
|
|
+ right: "1%",
|
|
|
+ bottom: "15%",
|
|
|
+ show: true, // 显示边框
|
|
|
+ borderWidth: '0', //去除边框
|
|
|
+ containLabel: true // 包含刻度文字在内
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ boundaryGap: false,
|
|
|
+ data: xData,
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ color: "#AADDFF" // 文本颜色
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ yAxis: {
|
|
|
+ type: "value",
|
|
|
+ axisTick: {
|
|
|
+ show: false // 去除刻度线
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: false // 去除文本
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false // 去除轴线
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#aaa", // 分割线颜色
|
|
|
+ opacity: .2
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [{
|
|
|
+ symbol: "none",
|
|
|
+ name: "电流",
|
|
|
+ type: "line",
|
|
|
+ smooth: true, // true 可以让我们的折线显示带有弧度
|
|
|
+ areaStyle: {
|
|
|
+ normal: {
|
|
|
+ color: new echarts.graphic.LinearGradient(
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 1, [{
|
|
|
+ offset: 0,
|
|
|
+ color: "rgba(255,156,0, 0.4)"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.8,
|
|
|
+ color: "rgba(255,156,0, 0.3)"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ false
|
|
|
+ ),
|
|
|
+ shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ data: sortData[0].data[0]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ symbol: "none",
|
|
|
+ name: "电压",
|
|
|
+ type: "line",
|
|
|
+ smooth: true,
|
|
|
+ areaStyle: {
|
|
|
+ normal: {
|
|
|
+ color: new echarts.graphic.LinearGradient(
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 0,
|
|
|
+ 1, [{
|
|
|
+ offset: 0,
|
|
|
+ color: "rgba(0,150,255,0.5)"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.8,
|
|
|
+ color: "rgba(0,150,255, 0.1)"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ false
|
|
|
+ ),
|
|
|
+ shadowColor: "rgba(0, 0, 0, 0.1)"
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ data: sortData[0].data[1]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ var img1 = document.getElementById('oldAnalysisChart2_img');
|
|
|
+ setTimeout(function() {
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
+ }, 1000)
|
|
|
+ })();
|
|
|
+
|
|
|
+ // 热老化分析
|
|
|
+ let thermal_aging = result.RESULT[0].thermal_aging;
|
|
|
+
|
|
|
+ // 结论数据渲染
|
|
|
+ var items = '';
|
|
|
+ var conclusion = thermal_aging.conclusion
|
|
|
+ for (x in conclusion) {
|
|
|
+ xIndex = x.substr(x.length - 1, 1);
|
|
|
+ items += `<div>${xIndex}、${conclusion[x]}</div>`
|
|
|
+ }
|
|
|
+ $('.exportBox .hotAnalysis .summaryDetail').html(items);
|
|
|
+
|
|
|
+ // 热老化
|
|
|
+ (function() {
|
|
|
+
|
|
|
+ let a = [];
|
|
|
+ let b = [];
|
|
|
+ let c = [];
|
|
|
+ let data_time = [];
|
|
|
+ let visualization = thermal_aging.visualization;
|
|
|
+ visualization.forEach(function(item, index) {
|
|
|
+ a.push(item.generation_temperature)
|
|
|
+ b.push(item.ambient_temperature)
|
|
|
+ c.push(item.Cable_temperature)
|
|
|
+ data_time.push(item.data_time)
|
|
|
+ });
|
|
|
+
|
|
|
+ var sortData = [{
|
|
|
+ data: [a, b, c]
|
|
|
+ }];
|
|
|
+
|
|
|
+ var xData = function() {
|
|
|
+ var data = [];
|
|
|
+ for (var i = 1; i < visualization.length + 1; i++) {
|
|
|
+ data.push(i);
|
|
|
+ }
|
|
|
+ return data;
|
|
|
+ }();
|
|
|
+
|
|
|
+ // 1. 实例化对象
|
|
|
+ var myChart = echarts.init(document.querySelector("#hotAnalysisChart1"));
|
|
|
+ // 2.指定配置
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ backgroundColor: 'transparent',
|
|
|
+ color: ['rgba(5,238,231,.6)', 'rgba(153,153,255,.6)', 'rgba(255,147,180,.6)'],
|
|
|
+ tooltip: {
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
+ //提示框组件
|
|
|
+ trigger: 'axis',
|
|
|
+ formatter: function(params) {
|
|
|
+ var res = params[0].seriesName + '：' + params[0].value + '°C<br />' + params[1].seriesName + '：' + params[1].value + '°C<br />' + params[2].seriesName + '：' + params[2].value + '°C<br />' + data_time[params[1].dataIndex];
|
|
|
+ return res;
|
|
|
+ },
|
|
|
+ axisPointer: {
|
|
|
+ type: 'shadow',
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontStyle: 'normal',
|
|
|
+ fontFamily: '微软雅黑',
|
|
|
+ align: 'left' //图例左对齐
|
|
|
+ },
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: '0',
|
|
|
+ right: '0',
|
|
|
+ bottom: '40',
|
|
|
+ top: '0',
|
|
|
+ containLabel: true,
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
+ itemGap: 20,
|
|
|
+ itemHeight: 2,
|
|
|
+ itemWidth: 15,
|
|
|
+ icon: 'rect',
|
|
|
+ textStyle: {
|
|
|
+ color: "#aaa"
|
|
|
+ },
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+
|
|
|
+ xAxis: [{
|
|
|
+ type: 'category',
|
|
|
+ // boundaryGap: true,//坐标轴两边留白
|
|
|
+ data: xData,
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ // rotate: 340,
|
|
|
+ // formatter: function(val) {
|
|
|
+ // return val.split("").join("\n");
|
|
|
+ // }, //横轴信息文字竖直显示
|
|
|
+ textStyle: {
|
|
|
+ color: '#AADDFF',
|
|
|
+ fontStyle: 'normal',
|
|
|
+ fontFamily: '微软雅黑',
|
|
|
+ fontSize: 12,
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ axisTick: {
|
|
|
+ //坐标轴刻度相关设置。
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ //坐标轴轴线相关设置
|
|
|
+
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ //坐标轴在 grid 区域中的分隔线。
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ }, ],
|
|
|
+ yAxis: [{
|
|
|
+ type: 'value',
|
|
|
+
|
|
|
+ axisLabel: false,
|
|
|
+ axisLine: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ axisTick: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: true,
|
|
|
+ lineStyle: {
|
|
|
+ color: ['#aaa'],
|
|
|
+ opacity: 0.2,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ boundaryGap: ['0', '1%'],
|
|
|
+ }],
|
|
|
+ series: [{
|
|
|
+ name: '线缆产生的温度',
|
|
|
+ type: 'bar',
|
|
|
+ data: sortData[0].data[0],
|
|
|
+ barMaxWidth: '11',
|
|
|
+ itemStyle: {
|
|
|
+ borderColor: "#05EEE7",
|
|
|
+ },
|
|
|
+ barGap: '50%',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '环境温度',
|
|
|
+ type: 'bar',
|
|
|
+ data: sortData[0].data[1],
|
|
|
+ barMaxWidth: '11',
|
|
|
+ itemStyle: {
|
|
|
+ borderColor: "#9999FF"
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '线缆温度',
|
|
|
+ type: 'bar',
|
|
|
+ data: sortData[0].data[2],
|
|
|
+ barMaxWidth: '11',
|
|
|
+ itemStyle: {
|
|
|
+ borderColor: "#FE92B3",
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ ],
|
|
|
+ };
|
|
|
+
|
|
|
+ myChart.setOption(option);
|
|
|
+ var img1 = document.getElementById('hotAnalysisChart1_img');
|
|
|
+ setTimeout(function() {
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
+ }, 1000)
|
|
|
+
|
|
|
+
|
|
|
+ })();
|
|
|
+
|
|
|
+ /*
|
|
|
+ 导出数据对接 end
|
|
|
+ */
|
|
|
+
|
|
|
+ } else {
|
|
|
+ // alert('暂无数据')
|
|
|
+ layui.use('layer', function() {
|
|
|
+ var layer = layui.layer;
|
|
|
+
|
|
|
+ layer.alert('暂无数据', { icon: 5 }, function() {
|
|
|
+ location.reload();
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ }, function(errorMsg) {
|
|
|
+ layui.use('layer', function() {
|
|
|
+ var layer = layui.layer;
|
|
|
+ layer.alert('数据请求失败', { icon: 5 });
|
|
|
+ });
|
|
|
+ }, 1)
|
|
|
+};
|
|
|
+
|
|
|
+function getSearchParamObj() {
|
|
|
+ let queryParam = {};
|
|
|
+ let buildingVal = $('#building').val();
|
|
|
+ let chooseTime = $('#chooseTime').val();
|
|
|
+ queryParam.company_code = buildingVal;
|
|
|
+ queryParam.generation_time = chooseTime;
|
|
|
+ return queryParam;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+// 打印
|
|
|
+(function() {
|
|
|
+
|
|
|
+ $("#btnPrint").click(function() {
|
|
|
+
|
|
|
+ print_detail()
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
+ var print_detail = function() {
|
|
|
+
|
|
|
+ //打印前echarts图表转换成图片 start
|
|
|
+ $('#divergenceChart1_img,#divergenceChart2_img,#divergenceChart3_img,#divergenceChart4_img').show()
|
|
|
+ $('#divergenceChart1,#divergenceChart2,#divergenceChart3,#divergenceChart4').hide()
|
|
|
+ $('#oldAnalysisChart1_img,#oldAnalysisChart2_img').show()
|
|
|
+ $('#oldAnalysisChart1,#oldAnalysisChart2').hide()
|
|
|
+ $('#hotAnalysisChart1_img').show()
|
|
|
+ $('#hotAnalysisChart1').hide()
|
|
|
+ // end
|
|
|
+
|
|
|
+ var div1_label1 = document.getElementById('printArea').innerHTML;
|
|
|
+ var hkey_key;
|
|
|
+ var hkey_root = 'HKEY_CURRENT_USER';
|
|
|
+ var hkey_path = '\\Software\\Micorsoft\\Internet Explorer\\PageSetup\\';
|
|
|
+ var print_win = window.open('打印窗口', '_blank');
|
|
|
+ var div = document.createElement('div');
|
|
|
+ div.setAttribute('width', '100%');
|
|
|
+ div.setAttribute('height', '100%');
|
|
|
+ var div_print = document.createElement('div');
|
|
|
+ div_print.setAttribute('style', 'width:595px;height:842px;padding:50px 20px;margin:0px auto 0px auto');
|
|
|
+ div_print.innerHTML = div1_label1;
|
|
|
+ div.appendChild(div_print);
|
|
|
+
|
|
|
+ print_win.document.write(div.innerHTML);
|
|
|
+ print_win.document.close();
|
|
|
+ try {
|
|
|
+ var RegWsh = new ActiveXObject('WScript.Shell');
|
|
|
+ hkey_key = 'header';
|
|
|
+ RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, '');
|
|
|
+ hkey_key = 'footer';
|
|
|
+ RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, '');
|
|
|
+ } catch (e) {}
|
|
|
+ print_win.print();
|
|
|
+ print_win.close();
|
|
|
+ }
|
|
|
})()
|
