优化大屏加载速度和打包大小
This commit is contained in:
wgx
parent
445f8b6e6a
commit
4c86d844df
|
|
@ -69,12 +69,12 @@ export function login(data) {
|
|||
})
|
||||
}
|
||||
// 污染治理效果折线图
|
||||
export function getIndexSummry(stationCode) {
|
||||
export function getIndexSummry(data) {
|
||||
return requests({
|
||||
url: '/zh-applet-admin/appmana/bigScreen/getIndexSummry?stationCode='+stationCode,
|
||||
url: '/zh-applet-admin/appmana/bigScreen/getIndexSummry',
|
||||
method: 'post',
|
||||
headers: {},
|
||||
stationCode
|
||||
headers: { 'content-type': 'application/json; charset=UTF-8' },
|
||||
data: data? data : {}
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -556,6 +556,49 @@
|
|||
margin-left: 3%;
|
||||
font-family: douyuFont;
|
||||
}
|
||||
.dataTypeEchart{
|
||||
width: 53px;
|
||||
height: 31px;
|
||||
color: #fff;
|
||||
margin-top: 15px;
|
||||
line-height: 32px;
|
||||
background: rgb(14 44 63);
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #4b677c;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
margin-left: 15px;
|
||||
padding: 0px;
|
||||
text-align: center;
|
||||
z-index: 500;
|
||||
position: absolute;
|
||||
}
|
||||
.dataTypeEchart2{
|
||||
width: 66px;
|
||||
height: 32px;
|
||||
color: #fff;
|
||||
margin-top: 15px;
|
||||
line-height: 32px;
|
||||
background: rgb(14 44 63);
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #4b677c;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
margin-left: 15px;
|
||||
padding: 0px;
|
||||
text-align: center;
|
||||
z-index: 500;
|
||||
position: absolute;
|
||||
left: 13px;
|
||||
top: 30px;
|
||||
.el-input__inner{
|
||||
height:30px;
|
||||
background: #0e2e4f;
|
||||
}
|
||||
.el-input__icon{
|
||||
height:36px;
|
||||
}
|
||||
}
|
||||
.zywr_titrt{
|
||||
width: 25%;
|
||||
height: 3vw;
|
||||
|
|
@ -608,48 +651,17 @@
|
|||
}
|
||||
#chart1{height:12vw;}
|
||||
.scdlist{
|
||||
width: 9vw;
|
||||
width: 7vw;
|
||||
height: 2vw;
|
||||
margin-top: 0.4vw;
|
||||
line-height: 2vw;
|
||||
background: rgba(0,0,0,0.8);
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #4b677c;
|
||||
position: absolute;
|
||||
/*position: absolute;*/
|
||||
bottom: 16vw;
|
||||
left: 24%;
|
||||
}
|
||||
.scdlist2{
|
||||
width: 9vw;
|
||||
height: 2vw;
|
||||
line-height: 2vw;
|
||||
background: rgba(0,0,0,0.8);
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #4b677c;
|
||||
position: absolute;
|
||||
bottom: 19vw;
|
||||
left: 24%;
|
||||
}
|
||||
.scdlist3{
|
||||
width: 9vw;
|
||||
height: 2vw;
|
||||
line-height: 2vw;
|
||||
background: rgba(0,0,0,0.8);
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #4b677c;
|
||||
position: absolute;
|
||||
bottom: 22vw;
|
||||
left: 24%;
|
||||
}
|
||||
.scdlist4{
|
||||
width: 9vw;
|
||||
height: 2vw;
|
||||
line-height: 2vw;
|
||||
background: rgba(0,0,0,0.8);
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #4b677c;
|
||||
position: absolute;
|
||||
bottom: 25vw;
|
||||
left: 24%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.scdlistpos{
|
||||
width: 9vw;
|
||||
|
|
@ -697,13 +709,7 @@
|
|||
}
|
||||
.xcdimg{
|
||||
width: 0.9vw;
|
||||
/* margin-top: 0.4vw; */
|
||||
margin-left: 0.4vw;
|
||||
margin-right: 0.4vw;
|
||||
}
|
||||
.xcd2img{
|
||||
width: 0.7vw;
|
||||
/* margin-top: 0.1vw; */
|
||||
margin-top: 0.4vw;
|
||||
margin-left: 0.4vw;
|
||||
margin-right: 0.4vw;
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -20,7 +20,6 @@
|
|||
<div class="nav_btn">
|
||||
<div class="btn_left">
|
||||
<span class="btn_left_time"> {{ nowTime }}</span> <span class="btn_left_tianq" style="z-index: 9999;"></span>
|
||||
|
||||
</div>
|
||||
<div class="btn_right"><hefentianqi />
|
||||
<img src="@/assets/image/quanping.png" class="quanping" v-if="fullscreen==false" @click="screen" alt="">
|
||||
|
|
@ -42,38 +41,17 @@
|
|||
</el-button>
|
||||
<img src="@/assets/image/sanjiao.png" class="sanjiao" alt="">
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<!-- <button @click="isShowBtn" style="position: fixed;top:5.2vw;left:26%;z-index: 999;">切换</button> -->
|
||||
<img src="@/assets/image/qiehuan2.png" @click="isShowBtn" style="position: fixed;top:5.2vw;right:26%;z-index: 999;width:12vw;cursor: pointer;" alt="" v-if="isShow==true" >
|
||||
<img src="@/assets/image/qiehuan.png" @click="isShowBtn" style="position: fixed;top:5.2vw;right:3%;z-index: 999;width:12vw;cursor: pointer;" alt="" v-else>
|
||||
<!-- <img src="@/assets/image/sbdscd.png" @click="sbdscdBtn" style="position: fixed;top:5.2vw;left:26%;z-index: 999;width:12vw;cursor: pointer;" alt="" > -->
|
||||
|
||||
<!-- <el-tooltip content="杀虫灯" effect="light" placement="top">-->
|
||||
<!-- <el-switch-->
|
||||
<!-- v-model="switchValue"-->
|
||||
<!-- active-color="#13ce66"-->
|
||||
<!-- inactive-color="#ff4949"-->
|
||||
<!-- @change="switchBtn"-->
|
||||
<!-- v-if="isShow==true"-->
|
||||
<!-- style="position: fixed;bottom:17.2vw;right:25%;z-index: 999;">-->
|
||||
<!-- </el-switch>-->
|
||||
<!-- <el-switch-->
|
||||
<!-- v-model="switchValue"-->
|
||||
<!-- active-color="#13ce66"-->
|
||||
<!-- inactive-color="#ff4949"-->
|
||||
<!-- @change="switchBtn"-->
|
||||
<!-- v-else-->
|
||||
<!-- style="position: fixed;bottom:6.2vw;right:3%;z-index: 999;">-->
|
||||
<!-- </el-switch>-->
|
||||
<!-- </el-tooltip>-->
|
||||
<div id="container" v-if="fullscreen==false" style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;transform:scale(1.05,1.05);"></div>
|
||||
<div id="container" v-else style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;"></div>
|
||||
<!-- 左上头部-->
|
||||
<img src="@/assets/image/qiehuan2.png" @click="mapTypeSwitch" style="position: fixed;top:5.2vw;right:26%;z-index: 999;width:12vw;cursor: pointer;" alt="" v-if="mapTypeFlag==true" >
|
||||
<img src="@/assets/image/qiehuan.png" @click="mapTypeSwitch" style="position: fixed;top:5.2vw;right:3%;z-index: 999;width:12vw;cursor: pointer;" alt="" v-else>
|
||||
<!-- <div id="container" v-if="fullscreen==false" style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;transform:scale(1.05,1.05);"></div>-->
|
||||
<!-- <div id="container" v-else style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;"></div>-->
|
||||
<div id="container" style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;"></div>
|
||||
<!-- 左上头部 -->
|
||||
<transition enter-active-class="animate__animated animate__backInLeft" leave-active-class="animate__animated animate__backOutLeft">
|
||||
<template v-if="isShow" >
|
||||
<template v-if="mapTypeFlag" >
|
||||
<div class="baseBoxLeft left baseBoxHjleft">
|
||||
<img src="@/assets/image/kuang_zuoshang.png" class="in2con_zlf" alt="">
|
||||
<img src="@/assets/image/kuang_youshang.png" class="in2con_zys" alt="">
|
||||
|
|
@ -97,16 +75,6 @@
|
|||
<span class="in1con_lf_imglf_tit">农田面源污染监测站</span>
|
||||
<span class="in1con_lf_imglf_num"> <animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0" :to="stationCount0" :key="stationCount0" duration="3000"></animate-number>个 </span>
|
||||
</div>
|
||||
<!-- <div class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">-->
|
||||
<!-- <img src="@/assets/image/xmgk02.png" class="in1con_lf_imgone" alt="">-->
|
||||
<!-- <span class="in1con_lf_imglf_tit">畜禽养殖污染监测站</span>-->
|
||||
<!-- <span class="in1con_lf_imglf_num"><animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0" :to="stationCount1" :key="stationCount1" duration="3000"></animate-number>个</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">-->
|
||||
<!-- <img src="@/assets/image/xmgk03.png" class="in1con_lf_imgone" alt="">-->
|
||||
<!-- <span class="in1con_lf_imglf_tit">太阳能诱虫灯</span>-->
|
||||
<!-- <span class="in1con_lf_imglf_num"><animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0" :to="pestLightCount" :key="pestLightCount" duration="3000"></animate-number>盏</span>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</div>
|
||||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||||
|
|
@ -162,74 +130,19 @@
|
|||
</div>
|
||||
</template>
|
||||
</transition>
|
||||
<!-- 禽畜弹窗 -->
|
||||
<el-dialog :visible.sync="qcdtdialogTableVisible">
|
||||
<div class="jctc" id="modal1" >
|
||||
<div class="in1con_lf_tit ">
|
||||
<img src="@/assets/image/tctiimg.png" class="tctiimg" alt="">
|
||||
<span class="in1con_lf_titshow1" >{{qcdtinfor.stationName}}</span>
|
||||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||||
</div>
|
||||
<div class="jctcvban1">
|
||||
<img src="@/assets/image/jctctiao.png" class="jctctiao" alt="">
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon1.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">站点位置：{{qcdtinfor.stationLocation}}</span>
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon2.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">建站时间：{{qcdtinfor.buildTime}}</span>
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon3.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">设备数量：
|
||||
<!-- <span style="color: #f1ff0d;">{{qcdtinfor.deviceCount}}</span> -->
|
||||
<span style="color: #f1ff0d;">5</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon4.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">监测指标</span>
|
||||
</div>
|
||||
<div style="margin-left: 3%;">
|
||||
<!-- survItemList -->
|
||||
<span class="jctc_text" v-for="(item,index) in qcdtinfor.survColorItems" :key="index" :style="{background:(item.color)}" >{{item.name}}</span>
|
||||
<!-- <span class="jctc_text" style="background: #445fb4;">总氮</span>
|
||||
<span class="jctc_text" style="background: #52ac2a;">硝钛氨</span>
|
||||
<span class="jctc_text" style="background: #ac4f2a;">空气温度</span>
|
||||
<span class="jctc_text" style="background: #ac4f2a;">空气湿度</span>
|
||||
<span class="jctc_text" style="background: #4c9bb5;">风速</span>
|
||||
<span class="jctc_text" style="background: #6a4cb5;">风向</span>
|
||||
<span class="jctc_text" style="background: #4cb585;">大气压</span>
|
||||
<span class="jctc_text" style="background: #ad8f49;">太阳全辐射</span>
|
||||
<span class="jctc_text" style="background: #52ac2a;">土壤温度</span>
|
||||
<span class="jctc_text" style="background: #4c9bb5;">土壤盐分</span> -->
|
||||
</div>
|
||||
<img src="@/assets/image/ljjr.png" class="ljjr" @click="addTask3(qcdtinfor)" alt="">
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!-- 地图左下图例-->
|
||||
<div v-if="isShow==true" class="mapTuLi">
|
||||
<!-- <div class="scdlist" @click="sbdscdBtn" style="cursor: pointer;">-->
|
||||
<!-- <img src="@/assets/image/xcd.png" class="xcdimg" alt="">-->
|
||||
<!-- <span class="scdlist_tit">联网式太阳能杀虫灯</span>-->
|
||||
<!-- </div>-->
|
||||
<div class="scdlist2">
|
||||
<img src="@/assets/image/xcd2.png" class="xcd2img" alt="">
|
||||
<span class="scdlist_tit">农田面源污染监测站</span>
|
||||
<div v-if="mapTypeFlag==true" class="mapTuLi">
|
||||
<div class="scdlist" @click="switchIcon('duizhuhe')">
|
||||
<img src="@/assets/image/icon-blue.png" class="xcdimg" alt="">
|
||||
<span class="scdlist_tit">对竹河监测站</span>
|
||||
</div>
|
||||
<div class="scdlist3">
|
||||
<img src="@/assets/image/xcd3.png" class="xcdimg" alt="">
|
||||
<span class="scdlist_tit">畜禽养殖污染监测站</span>
|
||||
<div class="scdlist" @click="switchIcon('tuanbaihe')">
|
||||
<img src="@/assets/image/icon-yellow.png" class="xcdimg" alt="">
|
||||
<span class="scdlist_tit">团百河监测站</span>
|
||||
</div>
|
||||
<!-- <div class="scdlist4">-->
|
||||
<!-- <img src="@/assets/image/xcd4.png" class="xcdimg" alt="">-->
|
||||
<!-- <span class="scdlist_tit">企业站点</span>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
<transition enter-active-class="animate__animated animate__backInUp" leave-active-class="animate__animated animate__backOutDown">
|
||||
<template v-if="isShow">
|
||||
<template v-if="mapTypeFlag">
|
||||
<div class="zlxg_btm">
|
||||
<img src="@/assets/image/kuang_zuoshang.png" class="in2con_zlf" alt="">
|
||||
<img src="@/assets/image/kuang_youshang.png" class="in2con_zys" alt="">
|
||||
|
|
@ -239,23 +152,38 @@
|
|||
<img src="@/assets/image/sanguang.png" class="sanguangbt2" alt="">
|
||||
<div>
|
||||
<span class="zywr_titshow">重要污染物治理效果</span>
|
||||
<el-tabs v-model="activeName" type="card" @tab-click="handleClick" >
|
||||
<el-tab-pane v-for="item in stationInfoList" :key="item.id" :label="item.stationName" :name="item.name" lazy >
|
||||
<template v-if="item.name == 0||item.name==1">
|
||||
<div id="myChartDiv" style="height:12vw;width:100%;" v-if="activeName == item.name"></div>
|
||||
<span class="dataTypeEchart" @click="switchEchartType">
|
||||
{{dataTypeEchart?'监测值':'对比值'}}
|
||||
</span>
|
||||
<el-select class="dataTypeEchart2" v-model="dateType" placeholder="请选择" @change="changeDateType">
|
||||
<el-option
|
||||
v-for="item in dateTypeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-tabs type="card" @tab-click="handleClick" v-show="dataTypeEchart">
|
||||
<el-tab-pane v-for="(item,index) in stationInfoList" :label="item.stationName" lazy >
|
||||
<template >
|
||||
<div :id="`myChartDiv${index}`" style="height:12vw;width:100%;" ></div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div id="zlxgChart" style="height:12vw;width:100%;" v-if="activeName == item.name"></div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-tabs type="card" @tab-click="handleClick" v-show="!dataTypeEchart" >
|
||||
<el-tab-pane v-for="(item,index) in riverList" :label="item.stationName.split('-')[0]" lazy >
|
||||
<template>
|
||||
<div :id="`myChartDiv2${index}`" style="height:12vw;width:100%;" ></div>
|
||||
</template>
|
||||
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</transition>
|
||||
<!-- 右侧展示栏-->
|
||||
<transition enter-active-class="animate__animated animate__backInRight" leave-active-class="animate__animated animate__backOutRight">
|
||||
<template v-if="isShow" >
|
||||
<template v-if="mapTypeFlag" >
|
||||
<div class="leftBox right baseBoxHjleft" style="width:22.5%;overflow: hidden;">
|
||||
<img src="@/assets/image/kuang_zuoshang.png" class="in2con_zlf" alt="">
|
||||
<img src="@/assets/image/kuang_youshang.png" class="in2con_zys" alt="">
|
||||
|
|
@ -416,6 +344,51 @@
|
|||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 监测站弹窗 -->
|
||||
<el-dialog :visible.sync="qcdtdialogTableVisible">
|
||||
<div class="jctc" id="modal1123123" >
|
||||
<div class="in1con_lf_tit ">
|
||||
<img src="@/assets/image/tctiimg.png" class="tctiimg" alt="">
|
||||
<span class="in1con_lf_titshow" >{{qcdtinfor.stationName}}</span>
|
||||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||||
</div>
|
||||
<div class="jctcvban1">
|
||||
<img src="@/assets/image/jctctiao.png" class="jctctiao" alt="">
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon1.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">站点位置：{{qcdtinfor.stationLocation}}</span>
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon2.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">建站时间：{{qcdtinfor.buildTime}}</span>
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon3.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">设备数量：<span style="color: #f1ff0d;">{{qcdtinfor.deviceCount}}</span> </span>
|
||||
</div>
|
||||
<div class="jctc_add">
|
||||
<img src="@/assets/image/jctcicon4.png" class="jctcicon1" alt="">
|
||||
<span class="jctcvban_tit">监测指标</span>
|
||||
</div>
|
||||
<div style="margin-left: 3%;">
|
||||
<!-- survItemList -->
|
||||
<span class="jctc_text" v-for="(item,index) in qcdtinfor.survColorItems" :key="index" :style="{background:(item.color)}" >{{item.name}}</span>
|
||||
<!-- <span class="jctc_text" style="background: #445fb4;">总氮</span>
|
||||
<span class="jctc_text" style="background: #52ac2a;">硝钛氨</span>
|
||||
<span class="jctc_text" style="background: #ac4f2a;">空气温度</span>
|
||||
<span class="jctc_text" style="background: #ac4f2a;">空气湿度</span>
|
||||
<span class="jctc_text" style="background: #4c9bb5;">风速</span>
|
||||
<span class="jctc_text" style="background: #6a4cb5;">风向</span>
|
||||
<span class="jctc_text" style="background: #4cb585;">大气压</span>
|
||||
<span class="jctc_text" style="background: #ad8f49;">太阳全辐射</span>
|
||||
<span class="jctc_text" style="background: #52ac2a;">土壤温度</span>
|
||||
<span class="jctc_text" style="background: #4c9bb5;">土壤盐分</span> -->
|
||||
</div>
|
||||
<img src="@/assets/image/ljjr.png" class="ljjr" @click="addTask3(qcdtinfor)" alt="">
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!-- 台账禽畜弹窗 -->
|
||||
<el-dialog width="60%" :visible.sync="qcdialogTableVisible" >
|
||||
<div class="tz_cov">
|
||||
|
|
@ -579,7 +552,7 @@ import { displayInfo, stationInfo, fwlist, ntfmlist, getNewestData, getPollution
|
|||
import vueSeamlessScroll from 'vue-seamless-scroll'
|
||||
import hefentianqi from '@/pages/weather/weather.vue'
|
||||
export default {
|
||||
name: "Home",
|
||||
name: 'Home',
|
||||
components: {
|
||||
vueSeamlessScroll,
|
||||
hefentianqi,
|
||||
|
|
@ -588,8 +561,12 @@ export default {
|
|||
data(){
|
||||
return {
|
||||
aMap: null,
|
||||
dataTypeEchart: true,
|
||||
markersOrient: [],
|
||||
markersOther: [],
|
||||
lastClickIcon: '',
|
||||
urlimg:'https://fxnsp.zgzhny.com/lh-api/sys/common/static/',
|
||||
isShow: true,
|
||||
mapTypeFlag: true,
|
||||
nowTime: '',
|
||||
briefconCode:"",
|
||||
briefconValue:[],
|
||||
|
|
@ -627,10 +604,9 @@ export default {
|
|||
radiotr: '1',
|
||||
qyinformation:'',
|
||||
listData: [],
|
||||
activeName: '0',
|
||||
NOSummry:[],
|
||||
TNSummry:[],
|
||||
TPSummry:[],
|
||||
summryAllData: null,
|
||||
echartInit: {},
|
||||
riverList:[],
|
||||
qcdtinfor:'',
|
||||
resourcedirect:[],
|
||||
dialogVisible: false,
|
||||
|
|
@ -640,18 +616,21 @@ export default {
|
|||
isShowLightNumber:'1',
|
||||
switchValue:true,
|
||||
fullscreen: false, //全屏
|
||||
dataStr:'',
|
||||
echartIndex: 0,
|
||||
dateType: 'monthDays',
|
||||
dateTypeOptions: [ {
|
||||
value: 'dayhours',
|
||||
label: '日'
|
||||
}, {
|
||||
value: 'monthDays',
|
||||
label: '月'
|
||||
}, {
|
||||
value: 'yearMonth',
|
||||
label: '年'
|
||||
}]
|
||||
};
|
||||
},
|
||||
created(){
|
||||
// 实时时间
|
||||
this.getNowTime();
|
||||
this.indexleft();
|
||||
this.getNewestDataList();
|
||||
this.getPollutionDictList();
|
||||
this.getIndexSummrycover();
|
||||
this.infor();
|
||||
this.indexinfor();
|
||||
},
|
||||
|
||||
computed: {
|
||||
|
|
@ -693,6 +672,7 @@ export default {
|
|||
},
|
||||
},
|
||||
mounted() {
|
||||
console.log('开始初始化！！！！')
|
||||
setTimeout(() =>{
|
||||
this.$nextTick(() => {
|
||||
this.indexinfor();
|
||||
|
|
@ -704,8 +684,16 @@ export default {
|
|||
this.PestLight(this.zoomData,this.isShowLightNumber);
|
||||
})
|
||||
}, 2000)
|
||||
//初始化数据
|
||||
this.getNowTime();
|
||||
this.indexleft();
|
||||
this.getNewestDataList();
|
||||
this.getPollutionDictList();
|
||||
this.infor();
|
||||
this.indexinfor();
|
||||
this.handleClick({index: this.echartIndex});
|
||||
},
|
||||
methods:{
|
||||
methods: {
|
||||
formatter: function (num) {
|
||||
return num.toFixed(3)
|
||||
},
|
||||
|
|
@ -714,35 +702,30 @@ export default {
|
|||
//跳转1
|
||||
window.open(url,"_blank");
|
||||
},
|
||||
isShowBtn(){
|
||||
this.isShow = !this.isShow
|
||||
this.$nextTick(()=> { // 加载echarts图
|
||||
this.zxong()
|
||||
this.zxtwoong()
|
||||
})
|
||||
if (this.isShow==true) {
|
||||
mapTypeSwitch(){
|
||||
this.mapTypeFlag = !this.mapTypeFlag
|
||||
if (this.mapTypeFlag==true) {//正常模式
|
||||
this.zoomData = 14
|
||||
if (this.isShowLight==undefined) {
|
||||
let isShowLight = '1'
|
||||
this.PestLight(this.zoomData,isShowLight);
|
||||
|
||||
} else {
|
||||
let isShowLight = this.isShowLight
|
||||
this.PestLight(this.zoomData,isShowLight);
|
||||
}
|
||||
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
this.$nextTick(()=> {
|
||||
this.handleClick({index: 0});
|
||||
})
|
||||
}, 1000)
|
||||
} else {// 地图模式
|
||||
this.zoomData = 15
|
||||
if (this.isShowLight==undefined) {
|
||||
let isShowLight = '1'
|
||||
this.PestLight(this.zoomData,isShowLight);
|
||||
|
||||
this.PestLight(this.zoomData,'1');
|
||||
} else {
|
||||
let isShowLight = this.isShowLight
|
||||
this.PestLight(this.zoomData,isShowLight);
|
||||
this.PestLight(this.zoomData,this.isShowLight);
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
indexleft(){
|
||||
displayInfo().then(res=>{
|
||||
|
|
@ -764,7 +747,6 @@ export default {
|
|||
this.effect_assess2 = res.result.effect_assess.detailList[2]
|
||||
this.effect_assess3 = res.result.effect_assess.detailList[3]
|
||||
this.effect_assess4 = res.result.effect_assess.detailList[4]
|
||||
|
||||
})
|
||||
},
|
||||
indexinfor(){
|
||||
|
|
@ -1000,53 +982,11 @@ export default {
|
|||
scale:(2 , 2.5)
|
||||
});
|
||||
that.aMap.on('complete', (e) =>{
|
||||
// 创建 AMap.LabelsLayer 图层
|
||||
var layer = new AMap.LabelsLayer({
|
||||
zooms: [3, 20],
|
||||
zIndex: 1000,
|
||||
collision: false,
|
||||
});
|
||||
// 将图层添加到地图
|
||||
that.aMap.add(layer);
|
||||
var markers = [];
|
||||
var markerData = res.result;
|
||||
let LabelMarker = markerData.filter(ele=>ele.type == 'light');
|
||||
let Marker = markerData.filter(ele=>ele.type != 'light');
|
||||
|
||||
LabelMarker.map((item,index)=>{
|
||||
let curData = {
|
||||
position:[item.longitude,item.latitude],
|
||||
icon:{
|
||||
// type: 'image',
|
||||
image:this.urlimg + item.picUrl,
|
||||
anchor:'bottom-center',
|
||||
type:item.type,
|
||||
name:item.name,
|
||||
ids:item.ids,
|
||||
extPics:item.extPics,
|
||||
notes:item.notes,
|
||||
zIndex: item.type=="orient"?999999:item.type=="cusLocaltion"?888888:1,
|
||||
},
|
||||
offset: new AMap.Pixel(item.width,item.height),//偏移量
|
||||
};
|
||||
var labelMarker = new AMap.LabelMarker(curData);
|
||||
|
||||
markers.push(labelMarker);
|
||||
// else {
|
||||
// mouseover
|
||||
// labelMarker.on("click", (e) => {
|
||||
// console.log("eeeeeee",e)
|
||||
// this.$notify({
|
||||
// title: item.name,
|
||||
// duration:1000
|
||||
// });
|
||||
|
||||
// })
|
||||
|
||||
// }
|
||||
})
|
||||
let Marker = markerData.filter(ele=> ele.type != 'light');//其他类型
|
||||
Marker.map(item=>{
|
||||
let marker = new AMap.Marker({
|
||||
zIndex: item.type=='orient'?1000:500,
|
||||
icon: this.urlimg + item.picUrl,
|
||||
position:[item.longitude,item.latitude],
|
||||
offset: new AMap.Pixel(item.width,item.height),//偏移量
|
||||
|
|
@ -1055,29 +995,22 @@ export default {
|
|||
extPics:item.extPics,
|
||||
notes:item.notes,
|
||||
name:item.name,
|
||||
item: item
|
||||
}
|
||||
});
|
||||
if (item.type=="livestock"||item.type=="orient") {
|
||||
marker.on("click", e => {
|
||||
if (item.type=='orient') {//监测站弹窗
|
||||
marker.on('click', e => {
|
||||
let indexnumb = e.target.getExtData().ids.slice(-1);
|
||||
this.qcdtinfor = this.stationInfoList[indexnumb]
|
||||
this.qcdtdialogTableVisible = true
|
||||
console.log('livestock or orient',this.qyinformation)
|
||||
})
|
||||
} else if(item.type=="cusLocaltion"){
|
||||
marker.on("click", e => {
|
||||
this.qyinformation= {
|
||||
extPics:e.target.getExtData().extPics,
|
||||
notes:e.target.getExtData().notes,
|
||||
name:e.target.getExtData().name,
|
||||
}
|
||||
console.log("this.qyinformation",this.qyinformation)
|
||||
this.qyinfordtdialogTableVisible = true
|
||||
})
|
||||
this.markersOrient.push(marker)
|
||||
} else {
|
||||
this.markersOther.push(marker)
|
||||
}
|
||||
marker.setMap(that.aMap);
|
||||
})
|
||||
// 一次性将海量点添加到图层
|
||||
layer.add(markers);
|
||||
this.$forceUpdate()
|
||||
that.aMap.setFitView();
|
||||
setTimeout(() => {
|
||||
|
|
@ -1249,47 +1182,98 @@ export default {
|
|||
this.getPollutionDictCover = res.result
|
||||
})
|
||||
},
|
||||
handleClick(tab, event) {
|
||||
let stationCode = ''
|
||||
getIndexSummry(stationCode).then(res=>{
|
||||
if (res.code ='200') {
|
||||
this.NOSummry = res.result[tab.index].NOSummry
|
||||
this.TNSummry = res.result[tab.index].TNSummry
|
||||
this.TPSummry = res.result[tab.index].TPSummry
|
||||
this.NHSummry = res.result[tab.index].NHSummry
|
||||
this.CODSummry = res.result[tab.index].CODSummry
|
||||
this.dataStr = res.result[4].dataStr
|
||||
changeDateType() {
|
||||
this.summryAllData = null;
|
||||
for(let key in this.echartInit){
|
||||
this.echartInit[key].dispose();
|
||||
}
|
||||
this.$nextTick(()=> { // 加载echarts图
|
||||
this.zxong()
|
||||
this.zxtwoong()
|
||||
})
|
||||
})
|
||||
this.echartInit = {};
|
||||
this.handleClick({index: this.echartIndex});
|
||||
},
|
||||
getIndexSummrycover(){
|
||||
let stationCode = ''
|
||||
getIndexSummry(stationCode).then(res=>{
|
||||
if (res.code ='200') {
|
||||
this.NOSummry = res.result[0].NOSummry
|
||||
this.TNSummry = res.result[0].TNSummry
|
||||
this.TPSummry = res.result[0].TPSummry
|
||||
this.dataStr = res.result[4].dataStr
|
||||
if (this.NOSummry ) {
|
||||
switchEchartType(){
|
||||
this.dataTypeEchart = (!this.dataTypeEchart);
|
||||
this.echartInit = {};
|
||||
this.activeName2 = this.riverList[0].stationName
|
||||
setTimeout(() => {
|
||||
this.handleClick({index: 0});
|
||||
}, 300);
|
||||
},
|
||||
handleClick(tab, event) {
|
||||
this.echartIndex = tab.index - 0;
|
||||
if(this.summryAllData) {
|
||||
this.$nextTick(()=> { // 加载echarts图
|
||||
setTimeout(() =>{
|
||||
this.zxong()
|
||||
}, 1000)
|
||||
this.initEchartData(this.echartIndex)
|
||||
})
|
||||
} else {
|
||||
getIndexSummry({summrayMode: this.dateType}).then(res=>{
|
||||
if (res.code === 200) {
|
||||
this.summryAllData = res.result;
|
||||
let len = this.summryAllData.length;
|
||||
this.riverList = [];
|
||||
this.summryAllData.map((item1,index) => {
|
||||
if(index % 2 === 0 && item1['datas'] && (index + 1) < len) {
|
||||
let data1 = item1['datas'];
|
||||
let keys = Object.keys(data1);
|
||||
let data2 = this.summryAllData[index+1]['datas'];
|
||||
let data3 = {}
|
||||
let item3 = JSON.parse(JSON.stringify(item1));
|
||||
if(data2){
|
||||
keys.map(key => {
|
||||
if(data1[key] instanceof Array) {
|
||||
data3[key] = []
|
||||
data1[key].map((itemSub,index) => {
|
||||
data3[key].push(data2[key][index] - data1[key][index])
|
||||
})
|
||||
}
|
||||
})
|
||||
item3['datas'] = data3;
|
||||
this.riverList.push(item3);
|
||||
}
|
||||
}
|
||||
});
|
||||
// console.log('对比数据初始化：', this.riverList)
|
||||
setTimeout(() => {
|
||||
this.$nextTick(()=> { // 加载echarts图
|
||||
this.initEchartData(this.echartIndex)
|
||||
})
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 折线图数据
|
||||
zxong(){
|
||||
initEchartData(index){
|
||||
this.$nextTick(() => {
|
||||
let divDom = document.getElementById('myChartDiv');
|
||||
if(!divDom){return;}
|
||||
var myChartLine = this.$echarts.init(divDom);
|
||||
let domKey = `myChartDiv${index}`;
|
||||
let data = this.summryAllData[index];
|
||||
if(!this.dataTypeEchart) {// 对比数据
|
||||
domKey = `myChartDiv2${index}`;
|
||||
data = this.riverList[index];
|
||||
}
|
||||
if(this.echartInit[domKey]) {
|
||||
this.echartInit[domKey].dispose()
|
||||
}
|
||||
// console.log('初始化echart：', index, domKey, data, /^\d+$/.test(index) ,this.echartInit[domKey])
|
||||
let divDom = document.getElementById(domKey);
|
||||
if(!divDom){
|
||||
console.log('没找到dom：', domKey, divDom)
|
||||
return;
|
||||
}
|
||||
console.log('开始初始化echart：')
|
||||
let dataObj = [];
|
||||
let i = 0;
|
||||
let colors = ['#2295ee', '#5cdd67', '#c0ca41', '#6115d1', '#ee6922'];
|
||||
for(let key in data['datas']){
|
||||
if(data['datas'][key] instanceof Array) {
|
||||
dataObj[i++] = {
|
||||
name: key,
|
||||
color: colors[i],
|
||||
value: data['datas'][key]
|
||||
}
|
||||
}
|
||||
}
|
||||
let dataStr = data['dateStr']
|
||||
this.echartInit[domKey] = this.$echarts.init(divDom);
|
||||
var optionLine = {
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
|
|
@ -1301,13 +1285,12 @@ export default {
|
|||
bottom: '9%',
|
||||
containLabel: true
|
||||
},
|
||||
toolbox: {
|
||||
},
|
||||
toolbox: {},
|
||||
legend: {
|
||||
padding:[10,50,0,0],
|
||||
x:'right', //可设定图例在左、右、居中
|
||||
y:'top', //可设定图例在上、下、居中
|
||||
data: ['总氮', '总磷', '硝态氮'],
|
||||
data: dataObj.map(item => item.name),
|
||||
textStyle:{
|
||||
fontSize: 12,//字体大小
|
||||
color: '#ffffff'//字体颜色
|
||||
|
|
@ -1315,9 +1298,8 @@ export default {
|
|||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap:false,
|
||||
// data:['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
|
||||
data:this.dataStr,
|
||||
boundaryGap: false,
|
||||
data: dataStr,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#2295ee', //x轴的颜色
|
||||
|
|
@ -1343,147 +1325,22 @@ export default {
|
|||
},
|
||||
},
|
||||
},
|
||||
series: [ {
|
||||
name:'总氮',
|
||||
series: dataObj.map(item => {
|
||||
return {
|
||||
name: item.name,
|
||||
type:'line',
|
||||
stack: '总量1',
|
||||
data:this.TNSummry,
|
||||
data: item.value,
|
||||
lineStyle: {
|
||||
color: '#00FF89' // 设置线的颜色为红色
|
||||
},
|
||||
smooth:true,
|
||||
},
|
||||
{
|
||||
name:'总磷',
|
||||
type:'line',
|
||||
stack: '总量1',
|
||||
data:this.TPSummry,
|
||||
lineStyle: {
|
||||
color: '#FF0D00' // 设置线的颜色为红色
|
||||
},
|
||||
smooth:true,
|
||||
},
|
||||
{
|
||||
name:'硝态氮',
|
||||
type:'line',
|
||||
stack: '总量1',
|
||||
data:this.NOSummry,
|
||||
lineStyle: {
|
||||
color: '#FFC100' // 设置线的颜色为红色
|
||||
color: item.color // 设置线的颜色为红色
|
||||
},
|
||||
smooth:true,
|
||||
}
|
||||
]
|
||||
}),
|
||||
};
|
||||
//为echarts对象加载数据
|
||||
myChartLine.setOption(optionLine);
|
||||
this.echartInit[domKey].setOption(optionLine);
|
||||
})
|
||||
|
||||
},
|
||||
zxtwoong(){ //畜禽数据折线图
|
||||
this.$nextTick(() => {
|
||||
let divDom = document.getElementById('zlxgChart')
|
||||
if(!divDom){return;}
|
||||
var zlxgmyChartLine = this.$echarts.init(divDom);
|
||||
var zlxgoptionLine = {
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
grid: {
|
||||
top:'14%',
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '9%',
|
||||
containLabel: true
|
||||
},
|
||||
toolbox: {
|
||||
},
|
||||
legend: {
|
||||
padding:[10,50,0,0],
|
||||
x:'right', //可设定图例在左、右、居中
|
||||
y:'top', //可设定图例在上、下、居中
|
||||
// data: ['总氮', '总磷', '硝态氮'],
|
||||
textStyle:{
|
||||
fontSize: 12,//字体大小
|
||||
color: '#ffffff'//字体颜色
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap:false,
|
||||
data:this.dataStr,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#2295ee', //x轴的颜色
|
||||
width: 1, //轴线的宽度
|
||||
},
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
/*min:0,
|
||||
max:60,
|
||||
splitNumber:6*/
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
// 设置背景横线
|
||||
color: '#2295ee'
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#2295ee', //x轴的颜色
|
||||
width: 1, //轴线的宽度
|
||||
},
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name:'总氮',
|
||||
type:'line',
|
||||
stack: '总量1',
|
||||
data:this.TNSummry,
|
||||
lineStyle: {
|
||||
color: '#009DB2' // 设置线的颜色为红色
|
||||
},
|
||||
smooth:true,
|
||||
},
|
||||
{
|
||||
name:'总磷',
|
||||
type:'line',
|
||||
stack: '总量1',
|
||||
data:this.TPSummry,
|
||||
lineStyle: {
|
||||
color: '#00FF89' // 设置线的颜色为红色
|
||||
},
|
||||
smooth:true,
|
||||
},
|
||||
{
|
||||
name:' 氨氮',
|
||||
type:'line',
|
||||
stack: '总量1',
|
||||
data:this.NHSummry,
|
||||
lineStyle: {
|
||||
color: '#FF0D00' // 设置线的颜色为红色
|
||||
},
|
||||
smooth:true,
|
||||
},
|
||||
{
|
||||
name:' 化学需氧量',
|
||||
type:'line',
|
||||
stack: '总量1',
|
||||
data:this.CODSummry,
|
||||
lineStyle: {
|
||||
color: '#FFC100' // 设置线的颜色为红色
|
||||
},
|
||||
smooth:true,
|
||||
}
|
||||
]
|
||||
};
|
||||
//为echarts对象加载数据
|
||||
zlxgmyChartLine.setOption(zlxgoptionLine);
|
||||
})
|
||||
|
||||
},
|
||||
// 实时时间
|
||||
getNowTime () {
|
||||
|
|
@ -1569,6 +1426,29 @@ export default {
|
|||
}
|
||||
this.fullscreen = !this.fullscreen;
|
||||
},
|
||||
switchIcon(flag){
|
||||
let that = this;
|
||||
let arr = [];
|
||||
if(this.lastClickIcon == flag){
|
||||
this.lastClickIcon = ''
|
||||
} else {
|
||||
this.lastClickIcon = flag;
|
||||
if(flag == 'duizhuhe'){
|
||||
arr = this.markersOrient.filter(item => item.getExtData().name.indexOf("对竹河") != -1);
|
||||
} else if (flag == 'tuanbaihe'){
|
||||
arr = this.markersOrient.filter(item => item.getExtData().name.indexOf("团柏河") != -1);
|
||||
}
|
||||
}
|
||||
if(arr && arr.length > 0){
|
||||
that.aMap.setFitView(arr, false, [200,500,300,300], 16);
|
||||
// setTimeout(() => {
|
||||
// let temp = that.aMap.getCenter();//矫正显示标点位置在正中心
|
||||
// that.aMap.setZoomAndCenter(that.aMap.getZoom()-2, [temp.lng, temp.lat - 0.15]);
|
||||
// },2000)
|
||||
} else {
|
||||
that.aMap.setFitView(null, false, [100,400,200,200], 16);
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -2442,7 +2322,7 @@ export default {
|
|||
|
||||
.mapTuLi{
|
||||
position: absolute;
|
||||
bottom: -51px;
|
||||
bottom: 334px;
|
||||
left: 456px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -208,27 +208,27 @@
|
|||
<!-- </div>-->
|
||||
<div class="scdlist2">
|
||||
<img src="@/assets/image/xcd2.png" class="xcd2img" alt="">
|
||||
<span class="scdlist_tit">畜禽养殖污染监测站</span>
|
||||
<span class="scdlist_tit">对竹河监测站</span>
|
||||
</div>
|
||||
<div class="scdlist3">
|
||||
<img src="@/assets/image/xcd3.png" class="xcdimg" alt="">
|
||||
<span class="scdlist_tit">畜禽养殖污染监测站</span>
|
||||
<span class="scdlist_tit">团百河监测站</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<!-- <div class="scdlistpos" @click="sbdscdBtn" style="cursor: pointer;">-->
|
||||
<!-- <img src="@/assets/image/xcd.png" class="xcdimg" alt="">-->
|
||||
<!-- <span class="scdlist_tit">联网式太阳能杀虫灯</span>-->
|
||||
<!-- <div v-else>-->
|
||||
<!--<!– <div class="scdlistpos" @click="sbdscdBtn" style="cursor: pointer;">–>-->
|
||||
<!--<!– <img src="@/assets/image/xcd.png" class="xcdimg" alt="">–>-->
|
||||
<!--<!– <span class="scdlist_tit">联网式太阳能杀虫灯</span>–>-->
|
||||
<!--<!– </div>–>-->
|
||||
<!-- <div class="scdlist2pos">-->
|
||||
<!-- <img src="@/assets/image/xcd2.png" class="xcd2img" alt="">-->
|
||||
<!-- <span class="scdlist_tit">畜禽养殖污染监测站</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="scdlist3pos">-->
|
||||
<!-- <img src="@/assets/image/xcd3.png" class="xcdimg" alt="">-->
|
||||
<!-- <span class="scdlist_tit">畜禽养殖污染监测站</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<div class="scdlist2pos">
|
||||
<img src="@/assets/image/xcd2.png" class="xcd2img" alt="">
|
||||
<span class="scdlist_tit">畜禽养殖污染监测站</span>
|
||||
</div>
|
||||
<div class="scdlist3pos">
|
||||
<img src="@/assets/image/xcd3.png" class="xcdimg" alt="">
|
||||
<span class="scdlist_tit">畜禽养殖污染监测站</span>
|
||||
</div>
|
||||
</div>
|
||||
<transition enter-active-class="animate__animated animate__backInUp" leave-active-class="animate__animated animate__backOutDown">
|
||||
<template v-if="isShow">
|
||||
<div class="zlxg_btm">
|
||||
|
|
@ -242,7 +242,7 @@
|
|||
<span class="zywr_titshow">重要污染物治理效果</span>
|
||||
<el-tabs v-model="activeName" type="card" @tab-click="handleClick" >
|
||||
<el-tab-pane v-for="item in stationInfoList" :key="item.id" :label="item.stationName" :name="item.name" lazy >
|
||||
<div id="myChart" style="height:12vw;width:100%;" v-if="activeName == item.name"></div>
|
||||
<div id="myChart2222" style="height:12vw;width:100%;" v-if="activeName == item.name"></div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<!-- <ul class="layui-tab-title" style="width:70%;" >
|
||||
|
|
@ -958,7 +958,7 @@ export default {
|
|||
},
|
||||
// 折线图数据
|
||||
zxong(){
|
||||
var myChartLine = this.$echarts.init(document.getElementById('myChart'));
|
||||
var myChartLine = this.$echarts.init(document.getElementById('myChart2222'));
|
||||
var optionLine = {
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
Loading…
Reference in New Issue