diff --git a/04.系统编码/Frontend/package-lock.json b/04.系统编码/Frontend/package-lock.json index 412ca60..ed66113 100644 --- a/04.系统编码/Frontend/package-lock.json +++ b/04.系统编码/Frontend/package-lock.json @@ -4404,6 +4404,11 @@ "duplexer": "0.1.1" } }, + "browser-tiff.js": { + "version": "1.0.1", + "resolved": "https://registry.npmmirror.com/browser-tiff.js/download/browser-tiff.js-1.0.1.tgz", + "integrity": "sha1-XbeQO58jBJL4Tl9bZqwL55H70KI=" + }, "buffer": { "version": "5.7.1", "resolved": "https://registry.npm.taobao.org/buffer/download/buffer-5.7.1.tgz?cache=0&sync_timestamp=1606098189689&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fbuffer%2Fdownload%2Fbuffer-5.7.1.tgz", diff --git a/04.系统编码/Frontend/package.json b/04.系统编码/Frontend/package.json index 7f02dec..7cecb78 100644 --- a/04.系统编码/Frontend/package.json +++ b/04.系统编码/Frontend/package.json @@ -7,6 +7,7 @@ }, "dependencies": { "axios": "^0.21.4", + "browser-tiff.js": "^1.0.1", "element-plus": "^1.2.0-beta.4", "moment": "^2.29.1", "qs": "^6.10.1", diff --git a/04.系统编码/Frontend/public/images/ecological-environment/111.tif b/04.系统编码/Frontend/public/images/ecological-environment/111.tif new file mode 100644 index 0000000..314bc01 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/111.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/albedo.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/albedo.tif new file mode 100644 index 0000000..4e6f148 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/albedo.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/evaporation.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/evaporation.tif new file mode 100644 index 0000000..abba1cd Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/evaporation.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature0130.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature0130.tif new file mode 100644 index 0000000..c547d43 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature0130.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature1030.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature1030.tif new file mode 100644 index 0000000..41ff39b Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature1030.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature1330.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature1330.tif new file mode 100644 index 0000000..fed6550 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature1330.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature2230.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature2230.tif new file mode 100644 index 0000000..3ad93c7 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/EVI/temperature2230.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/albedo.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/albedo.tif new file mode 100644 index 0000000..54eb05f Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/albedo.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/evaporation.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/evaporation.tif new file mode 100644 index 0000000..635139d Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/evaporation.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature0130.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature0130.tif new file mode 100644 index 0000000..845d6d8 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature0130.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature1030.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature1030.tif new file mode 100644 index 0000000..a06bbbe Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature1030.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature1330.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature1330.tif new file mode 100644 index 0000000..c1f82da Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature1330.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature2230.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature2230.tif new file mode 100644 index 0000000..156df3d Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/LAI/temperature2230.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/albedo.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/albedo.tif new file mode 100644 index 0000000..833069e Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/albedo.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/evaporation.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/evaporation.tif new file mode 100644 index 0000000..53cc17a Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/evaporation.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature0130.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature0130.tif new file mode 100644 index 0000000..314bc01 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature0130.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature1030.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature1030.tif new file mode 100644 index 0000000..d8a8c05 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature1030.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature1330.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature1330.tif new file mode 100644 index 0000000..737a197 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature1330.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature2230.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature2230.tif new file mode 100644 index 0000000..1dbdd3a Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-change/NDVI/temperature2230.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/albedo.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/albedo.tif new file mode 100644 index 0000000..0bebb03 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/albedo.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/evaporation.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/evaporation.tif new file mode 100644 index 0000000..5e1f03f Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/evaporation.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature0130.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature0130.tif new file mode 100644 index 0000000..db55c14 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature0130.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature1030.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature1030.tif new file mode 100644 index 0000000..37eb92a Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature1030.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature1330.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature1330.tif new file mode 100644 index 0000000..8a79e8d Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature1330.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature2230.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature2230.tif new file mode 100644 index 0000000..79b47d1 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/EVI/temperature2230.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/albedo.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/albedo.tif new file mode 100644 index 0000000..24ad44f Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/albedo.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/evaporation.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/evaporation.tif new file mode 100644 index 0000000..dc78ad6 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/evaporation.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature0130.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature0130.tif new file mode 100644 index 0000000..062e1df Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature0130.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature1030.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature1030.tif new file mode 100644 index 0000000..b372661 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature1030.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature1330.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature1330.tif new file mode 100644 index 0000000..0167eb2 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature1330.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature2230.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature2230.tif new file mode 100644 index 0000000..bd0408b Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/LAI/temperature2230.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/albedo.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/albedo.tif new file mode 100644 index 0000000..a9d7655 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/albedo.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/evaporation.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/evaporation.tif new file mode 100644 index 0000000..72ec2e0 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/evaporation.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature0130.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature0130.tif new file mode 100644 index 0000000..c5b4f4a Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature0130.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature1030.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature1030.tif new file mode 100644 index 0000000..228fe88 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature1030.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature1330.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature1330.tif new file mode 100644 index 0000000..d5be6b9 Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature1330.tif differ diff --git a/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature2230.tif b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature2230.tif new file mode 100644 index 0000000..e6568bb Binary files /dev/null and b/04.系统编码/Frontend/public/images/ecological-environment/plant-distribute/NDVI/temperature2230.tif differ diff --git a/04.系统编码/Frontend/public/images/null-picture.png b/04.系统编码/Frontend/public/images/null-picture.png new file mode 100644 index 0000000..41adcdc Binary files /dev/null and b/04.系统编码/Frontend/public/images/null-picture.png differ diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue index b30f465..1a05f03 100644 --- a/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue +++ b/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue @@ -4,17 +4,17 @@ 垂直廓线 -
+
对流指数 - +
-
+
T-logP图 - +
-
+
BP反演产品 - +
@@ -29,18 +29,13 @@ 溧水
- @@ -49,16 +44,16 @@
{{time.hour}} - {{time.minute}} + {{time.minute}}
- +
- +

-
+
- 播放动画 + {{isPlay ? '暂停动画' : '播放动画'}} 下载动画
@@ -80,15 +75,23 @@ -

{{title}}

-
- - +
+

{{title}}

+
+ + + +
@@ -103,40 +106,70 @@ export default { name: 'MicrowaveRadiation', setup() { + let timer = null; let options = reactive({ currentTab: 'kuoxian', currentRegion: 'jiangning', - currentElement: 'TEMP', + currentType: 'TEMP', + currentElement: 'TEMPERATURE', currentCategory: 'CAPE', - date: moment().format('YYYY-MM-DD'), + date: moment('2020-07-01').format('YYYY-MM-DD'), currentHour: '10', hours: [], times: [], currentTime: null, imgUrl: null, - srcList: ['/images/picture.png'], + srcList: [], isPlay: false, title: null, - test: [] + index: 0 }) onMounted(() => { initHours(); initTimeLine(); - activeImage(); - setTitle(moment(options.date, 'YYYY-MM-DD').hour(parseInt(options.currentHour))) + setTitle(moment(options.date, 'YYYY-MM-DD').hour(parseInt(options.currentHour))); + setTimeout(() => { + activeImage(moment(options.times[options.times.length - 1].date).hour(), moment(options.times[options.times.length - 1].date).minute()); + }, 50); }) const onTabClick = (name) => { options.currentTab = name; + if (options.currentTab === 'kuoxian') { + options.currentType = 'TEMP'; + options.currentElement = 'TEMPERATURE'; + } else if (options.currentTab === 'shixu') { + options.currentType = 'CAPE'; + options.currentElement = 'CAPE时序图'; + } else if (options.currentTab === 'T-logP') { + options.currentType = 'T-logP'; + options.currentElement = 'T-logP'; + } else { + options.currentType = 'BPFY'; + options.currentElement = 'BPFY'; + } + + cancelActive(); + setTitle(moment(options.date).hour(parseInt(options.currentHour))); + activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); } const onRegionClick = (region) => { options.currentRegion = region; + + cancelActive(); + setTitle(moment(options.date).hour(parseInt(options.currentHour))); + activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); } - const onElementClick = (element) => { + const onElementClick = (element, type) => { options.currentElement = element; + options.currentType = type; + + cancelActive(); + setTitle(moment(options.date).hour(parseInt(options.currentHour))); + activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); } const onCategoryClick = (category) => { @@ -144,14 +177,14 @@ } const setTitle = (date) => { - console.log(date) options.title = date.format('YYYY.MM.DD HH:mm') + ' ' + options.currentElement; } - const activeImage = () => { - console.log(MicrowaveRadiationConfig.getUrl("jingning", "kuoxian_TEMP", moment())); - options.imgUrl = MicrowaveRadiationConfig.getUrl(options.currentRegion, options.currentTab + '_' + options.currentElement, moment(options.date).hour(parseInt(options.currentHour)).minute(0)); - console.log(options.imgUrl) + const activeImage = (hour, minute) => { + let time = moment(options.date).hour(hour).minute(minute); + let type = (options.currentTab === 'T-logP' || options.currentTab === 'BPFY') ? options.currentTab : (options.currentTab + '_' + options.currentType); + options.imgUrl = MicrowaveRadiationConfig.getUrl(options.currentRegion, type, time); + options.srcList = [options.imgUrl]; } const initTimeLine = () => { @@ -176,6 +209,7 @@ name: 'hour' + now.format('HH') }); } + options.index = options.times.length - 1; } const initHours = () => { @@ -187,10 +221,17 @@ } } - const onTimeClick = (time) => { + const onTimeClick = (time, index) => { options.currentTime = time.date; + options.index = index; + cancelActive(); setTitle(moment(time.date, 'YYYY-MM-DD HH:mm')); - activeImage(); + activeImage(moment(time.date).hour(), moment(time.date).minute()); + } + + const cancelActive = () => { + clearTimer(); + options.isPlay = false; } const onPrevDayClick = () => { @@ -202,21 +243,78 @@ } const onPrevImgClick = () => { + console.log(options.index); + let element = getCurrentElement(); + + options.index--; + if (options.index < 0) + options.index = element.childElementCount - 1; + setCurrentPlayElement(element); } const onNextImgClick = () => { + let element = getCurrentElement(); + + options.index++; + if (options.index > element.childElementCount - 1) + options.index = 0; + setCurrentPlayElement(element); } - const onHourChange = () => { - initTimeLine(); - setTitle(moment(options.date).hour(parseInt(options.currentHour))); + const onRefreshClick = () => { + cancelActive(); + options.date = moment('2020-07-01').format('YYYY-MM-DD'); + options.currentHour = '10'; + } + + const onPlayClick = () => { + options.isPlay = !options.isPlay; + if (options.isPlay) { + timeExcute(); + } else { + clearTimer(); + } + } + + const timeExcute = () => { + clearTimer(); + + let element = getCurrentElement();; + + timer = setInterval( () => { + options.index++; + if (options.index > element.childElementCount - 1) + options.index = 0; + + setCurrentPlayElement(element); + }, 2000) } - const onDateChange = () => { + const clearTimer = () => { + if (timer) + clearInterval(timer); + } + + const getCurrentElement = () => { + return document.querySelector('.times'); + } + + const setCurrentPlayElement = (element) => { + for(let i = 0; i < element.childElementCount; i++) + element.children[i].classList.remove('active'); + + element.children[options.index].classList.add('active'); + options.currentTime = options.times[options.index].date; + setTitle(moment(options.times[options.index].date, 'YYYY-MM-DD HH:mm')); + activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); + } + + const onChange = () => { initTimeLine(); setTitle(moment(options.date).hour(parseInt(options.currentHour))); + activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); } return { @@ -230,8 +328,9 @@ onNextDayClick, onPrevImgClick, onNextImgClick, - onHourChange, - onDateChange + onRefreshClick, + onPlayClick, + onChange } } } @@ -239,4 +338,3 @@ - diff --git a/04.系统编码/Frontend/src/components/RamanLidar.vue b/04.系统编码/Frontend/src/components/RamanLidar.vue index 15fbe96..070d7aa 100644 --- a/04.系统编码/Frontend/src/components/RamanLidar.vue +++ b/04.系统编码/Frontend/src/components/RamanLidar.vue @@ -5,18 +5,18 @@
@@ -25,16 +25,16 @@
{{time.hour}} - {{time.minute}} + {{time.minute}}
- +
- - + +
- +

-
+
- 播放动画 + {{isPlay ? '暂停动画' : '播放动画'}} 下载动画
- - + + -

2021.11.21 10:42 Temperature

-
- - +
+

{{title}}

+
+ + +
@@ -74,51 +76,79 @@