|
@@ -1683,3 +1683,137 @@ function getListData(queryParam = {}) {
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
symbol: "none",
|
|
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('deviceLinkChart2_img');
|
|
|
|
|
+ setTimeout(function() {
|
|
|
|
|
+ img1.src = myChart.getDataURL();
|
|
|
|
|
+ }, 1000)
|
|
|
|
|
+
|
|
|
|
|
+ })();
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ //数据波动关联
|
|
|
|
|
+
|
|
|
|
|
+ let data_fluctuation = result.RESULT[0].data_fluctuation;
|
|
|
|
|
+
|
|
|
|
|
+ // 结论数据渲染
|
|
|
|
|
+ var items = '';
|
|
|
|
|
+ var conclusion = data_fluctuation.conclusion
|
|
|
|
|
+ for (x in conclusion) {
|
|
|
|
|
+ xIndex = x.substr(x.length - 1, 1);
|
|
|
|
|
+ items += `<div>${xIndex}、${conclusion[x]}</div>`
|
|
|
|
|
+ }
|
|
|
|
|
+ $('.exportBox .data_fluctuation .summaryDetail').html(items);
|
|
|
|
|
+
|
|
|
|
|
+ // 数据波动关联
|
|
|
|
|
+ (function() {
|
|
|
|
|
+
|
|
|
|
|
+ let position = [];
|
|
|
|
|
+ let before_fluctuation = [];
|
|
|
|
|
+ let after_fluctuation = [];
|
|
|
|
|
+ let volatility_data = data_fluctuation.volatility_data;
|
|
|
|
|
+ volatility_data.forEach(function(item, index) {
|
|
|
|
|
+
|
|
|
|
|
+ //楼层
|
|
|
|
|
+ position.push(item.position)
|
|
|
|
|
+
|
|
|
|
|
+ //开始值
|
|
|
|
|
+ before_fluctuation.push(item.before_fluctuation)
|
|
|
|
|
+
|
|
|
|
|
+ //结束值
|
|
|
|
|
+ after_fluctuation.push(item.after_fluctuation)
|
|
|
|
|
+ });
|
|
|
|
|
+ // 1. 实例化对象
|
|
|
|
|
+ var myChart = echarts.init(document.querySelector("#dataChangeChart1"));
|
|
|
|
|
+ var xData = position;
|
|
|
|
|
+ // 2.指定配置
|
|
|
|
|
+ var option = {
|
|
|
|
|
+ backgroundColor: 'transparent',
|
|
|
|
|
+ color: ['rgba(0,150,255,.5)', 'rgba(255,156,0,.5)'],
|
|
|
|
|
+ tooltip: {
|
|
|
|
|
+ backgroundColor: '#12DFE0',
|
|
|
|
|
+ //提示框组件
|
|
|
|
|
+ trigger: 'axis',
|
|
|
|
|
+ formatter: '{a0}: {c0}<br />{a1}: {c1}<br />时间：' + chooseTime + '',
|
|
|
|
|
+ axisPointer: {
|
|
|
|
|
+ type: 'shadow',
|
|
|
|
|
+ },
|
|
|
|
|
+ textStyle: {
|
|
|
|
|
+ fontStyle: 'normal',
|
|
|
|
|
+ fontFamily: '微软雅黑',
|
|
|
|
|
+ align: 'left' //图例左对齐
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ legend: {
|
|
|
|
|
+ // 如果series 对象有name 值，则 legend可以不用写data
|
|
|
|
|
+ itemGap: 20,
|
|
|
|
|
+ itemHeight: 2,
|
|
|
|
|
+ itemWidth: 15,
|
|
|
|
|
+ icon: 'rect',
|
|
|
|
|
+ textStyle: {
|
|
|
|
|
+ color: "#AAA"
|
|
|
|
|
+ },
|
|
|
|
|
+ top: "bottom",
|
|
|
|
|
+ },
|
|
|
|
|
+ grid: {
|
|
|
|
|
+ left: '0',
|
|
|
|
|
+ right: '0',
|
|
|
|
|
+ bottom: '40',
|
|
|
|
|
+ top: '0',
|
|
|
|
|
+ containLabel: true,
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ //添加横线滚动条
|
|
|
|
|
+ dataZoom: {
|
|
|
|
|
+ start: 0, //默认为0
|
|
|
|
|
+ end: 100 - 1500 / 1, //默认为100
|
|
|
|
|
+ type: 'slider',
|
|
|
|
|
+ show: xData.length > 10 ? true : false,
|
|
|
|
|
+ xAxisIndex: [0],
|
|
|
|
|
+ handleSize: 0, //滑动条的 左右2个滑动条的大小
|
|
|
|
|
+ height: 4, //组件高度
|
|
|
|
|
+ left: 20, //左边的距离
|
|
|
|
|
+ right: 20, //右边的距离
|
|
|
|
|
+ bottom: 20, //右边的距离
|
|
|
|
|
+ handleColor: '#CBBCDB', //h滑动图标的颜色
|
|
|
|
|
+ handleStyle: {
|
|
|
|
|
+ borderColor: "#CBBCDB",
|
|
|
|
|
+ borderWidth: "1",
|
|
|
|
|
+ shadowBlur: 2,
|
|
|
|
|
+ background: "#CBBCDB",
|
|
|
|
|
+ shadowColor: "#CBBCDB",
|
|
|
|
|
+ },
|
|
|
|
|
+ textStyle: {
|
|
|
|
|
+ color: "#fff"
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ backgroundColor: 'rgba(37, 46, 100, 0.45)', //两边未选中的滑动条区域的颜色
|
李欣儒