feat: 💯 新增甲烷数据图表

This commit is contained in:
niushuai233 2024-11-18 16:22:24 +08:00
parent f7304edf60
commit 30caf7d91a
6 changed files with 182 additions and 32 deletions

View File

@ -10,7 +10,7 @@
</parent> </parent>
<groupId>cc.niushuai</groupId> <groupId>cc.niushuai</groupId>
<artifactId>gas-web</artifactId> <artifactId>gas-web</artifactId>
<version>0.0.2-SNAPSHOT</version> <version>0.1.0</version>
<name>gas-web</name> <name>gas-web</name>
<description>gas-web</description> <description>gas-web</description>
<properties> <properties>
@ -94,6 +94,7 @@
</pluginRepositories> </pluginRepositories>
<build> <build>
<finalName>gas-web</finalName>
<plugins> <plugins>
<plugin> <plugin>
<groupId>org.springframework.boot</groupId> <groupId>org.springframework.boot</groupId>

View File

@ -16,8 +16,10 @@
package cc.niushuai.gasweb.controller; package cc.niushuai.gasweb.controller;
import cc.niushuai.gasweb.entity.CH2O;
import cc.niushuai.gasweb.entity.ChartResp; import cc.niushuai.gasweb.entity.ChartResp;
import cc.niushuai.gasweb.entity.Gas; import cc.niushuai.gasweb.entity.Gas;
import cc.niushuai.gasweb.repository.CH2ORepository;
import cc.niushuai.gasweb.repository.GasRepository; import cc.niushuai.gasweb.repository.GasRepository;
import cn.hutool.core.collection.CollUtil; import cn.hutool.core.collection.CollUtil;
import cn.hutool.core.date.DateUtil; import cn.hutool.core.date.DateUtil;
@ -50,6 +52,8 @@ public class ChartController {
@Resource @Resource
private GasRepository gasRepository; private GasRepository gasRepository;
@Resource
private CH2ORepository ch2ORepository;
@Operation(summary = "test") @Operation(summary = "test")
@GetMapping("/test") @GetMapping("/test")
@ -65,37 +69,72 @@ public class ChartController {
public Map<String, ChartResp> fetch(String startDateTime, String endDateTime) { public Map<String, ChartResp> fetch(String startDateTime, String endDateTime) {
Map<String, ChartResp> map = new HashMap<>(); Map<String, ChartResp> map = new HashMap<>();
List<Gas> allList = gasRepository.findAllByTimeBetweenOrderByIdAsc(DateUtil.parseDateTime(startDateTime), DateUtil.parseDateTime(endDateTime)); fetchGas(startDateTime, endDateTime, map);
fetchCH2O(startDateTime, endDateTime, map);
if (CollUtil.isNotEmpty(allList)) {
ChartResp co = new ChartResp("CO浓度");
ChartResp co2 = new ChartResp("CO2浓度");
ChartResp ch4 = new ChartResp("CH4浓度");
ChartResp temperature = new ChartResp("环境温度");
ChartResp rp2024_temperature = new ChartResp("rp2024温度");
for (Gas gas : allList) {
String dateTime = DateUtil.formatDateTime(gas.getTime());
co.getData().add(new ChartResp.Data(dateTime, gas.getCo()));
co2.getData().add(new ChartResp.Data(dateTime, gas.getCo2()));
ch4.getData().add(new ChartResp.Data(dateTime, gas.getCh4()));
temperature.getData().add(new ChartResp.Data(dateTime, gas.getTemperature()));
rp2024_temperature.getData().add(new ChartResp.Data(dateTime, gas.getRp2040Temperature()));
}
map.put("co", co);
map.put("co2", co2);
map.put("ch4", ch4);
map.put("temperature", temperature);
map.put("rp2024_temperature", rp2024_temperature);
}
return map; return map;
} }
private void fetchCH2O(String startDateTime, String endDateTime, Map<String, ChartResp> map) {
try {
List<CH2O> allList = ch2ORepository.findAllByTimeBetweenOrderByIdAsc(DateUtil.parseDateTime(startDateTime), DateUtil.parseDateTime(endDateTime));
if (CollUtil.isNotEmpty(allList)) {
ChartResp ch2o = new ChartResp("CH2O浓度");
for (CH2O ch2O : allList) {
String dateTime = DateUtil.formatDateTime(ch2O.getTime());
ch2o.getData().add(new ChartResp.Data(dateTime, ch2O.getCh2o()));
}
map.put("ch2o", ch2o);
}
} catch (Exception e) {
log.error("fetch ch2o failed", e);
map.put("ch2oError", new ChartResp("fetch error: " + e.getMessage()));
}
}
private void fetchGas(String startDateTime, String endDateTime, Map<String, ChartResp> map) {
try {
List<Gas> allList = gasRepository.findAllByTimeBetweenOrderByIdAsc(DateUtil.parseDateTime(startDateTime), DateUtil.parseDateTime(endDateTime));
if (CollUtil.isNotEmpty(allList)) {
ChartResp co = new ChartResp("CO浓度");
ChartResp co2 = new ChartResp("CO2浓度");
ChartResp ch4 = new ChartResp("CH4浓度");
ChartResp temperature = new ChartResp("环境温度");
ChartResp rp2024_temperature = new ChartResp("rp2024温度");
for (Gas gas : allList) {
String dateTime = DateUtil.formatDateTime(gas.getTime());
co.getData().add(new ChartResp.Data(dateTime, gas.getCo()));
co2.getData().add(new ChartResp.Data(dateTime, gas.getCo2()));
ch4.getData().add(new ChartResp.Data(dateTime, gas.getCh4()));
temperature.getData().add(new ChartResp.Data(dateTime, gas.getTemperature()));
rp2024_temperature.getData().add(new ChartResp.Data(dateTime, gas.getRp2040Temperature()));
}
map.put("co", co);
map.put("co2", co2);
map.put("ch4", ch4);
map.put("temperature", temperature);
map.put("rp2024_temperature", rp2024_temperature);
}
} catch (Exception e) {
log.error("fetch gas failed", e);
map.put("gasError", new ChartResp("fetch error: " + e.getMessage()));
}
}
} }

View File

@ -0,0 +1,59 @@
/*
* Copyright (C) 2023 niushuai233 niushuai.cc
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package cc.niushuai.gasweb.entity;
import io.swagger.v3.oas.annotations.media.Schema;
import lombok.Data;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.Id;
import javax.persistence.Table;
import java.util.Date;
/**
* 甲烷数据
*
* @author niushuai233
* @date 2024/11/18 15:41
* @since 0.0.1
*/
@Data
@Entity
@Table(name = "ch2o")
@Schema(title = "甲烷数据")
public class CH2O {
@Id
@Schema(title = "id")
private Long id;
/**
* 记录时间
*/
@Schema(title = "记录时间")
@Column(name = "time")
private Date time;
/**
* 一氧化碳气体
*/
@Schema(title = "甲烷浓度")
@Column(name = "ch2o")
private String ch2o;
}

View File

@ -29,7 +29,11 @@ public class ChartResp {
private String y; private String y;
public String getY() { public String getY() {
return y.replace("ppm", "").replace("°C", ""); return y
.replace("ppm", "")
.replace("ppb", "")
.replace("°C", "")
;
} }
} }
} }

View File

@ -0,0 +1,38 @@
/*
* Copyright (C) 2023 niushuai233 niushuai.cc
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package cc.niushuai.gasweb.repository;
import cc.niushuai.gasweb.entity.CH2O;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.stereotype.Repository;
import java.util.Date;
import java.util.List;
/**
* ch2o sql repository
*
* @author niushuai233
* @date 2024/11/18 15:47
* @since 0.0.1
*/
@Repository
public interface CH2ORepository extends JpaRepository<CH2O, Long> {
List<CH2O> findAllByTimeBetweenOrderByIdAsc(Date startDateTime, Date endDateTime);
}

View File

@ -59,6 +59,11 @@
<div id="rp2040_tempDiv" class="charts"></div> <div id="rp2040_tempDiv" class="charts"></div>
</div> </div>
</div> </div>
<div class="row">
<div class="col-xs-12 col-md-6">
<div id="ch2oDiv" class="charts"></div>
</div>
</div>
</div> </div>
</body> </body>
<#--jq--> <#--jq-->
@ -77,7 +82,7 @@
<script> <script>
let contextPath = "${request.contextPath}/"; let contextPath = "${request.contextPath}/";
let startDateTime = moment().subtract(3600, 'seconds').format("YYYY-MM-DD HH:mm:ss"); let startDateTime = moment().subtract(1800, 'seconds').format("YYYY-MM-DD HH:mm:ss");
$("#startDateTime").val(startDateTime); $("#startDateTime").val(startDateTime);
let endDateTime = moment().format("YYYY-MM-DD HH:mm:ss"); let endDateTime = moment().format("YYYY-MM-DD HH:mm:ss");
$("#endDateTime").val(endDateTime); $("#endDateTime").val(endDateTime);
@ -89,6 +94,7 @@
var ch4Chart = echarts.init(document.getElementById('ch4Div')); var ch4Chart = echarts.init(document.getElementById('ch4Div'));
var tempChart = echarts.init(document.getElementById('tempDiv')); var tempChart = echarts.init(document.getElementById('tempDiv'));
var rp2040_tempChart = echarts.init(document.getElementById('rp2040_tempDiv')); var rp2040_tempChart = echarts.init(document.getElementById('rp2040_tempDiv'));
var ch2oChart = echarts.init(document.getElementById('ch2oDiv'));
// 使用刚指定的配置项和数据显示图表。 // 使用刚指定的配置项和数据显示图表。
@ -96,7 +102,8 @@
co2Chart.setOption(getOption('CO2浓度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], 'ppm')); co2Chart.setOption(getOption('CO2浓度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], 'ppm'));
ch4Chart.setOption(getOption('CH4浓度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], 'ppm')); ch4Chart.setOption(getOption('CH4浓度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], 'ppm'));
tempChart.setOption(getOption('环境温度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], '°C')); tempChart.setOption(getOption('环境温度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], '°C'));
rp2040_tempChart.setOption(getOption('rp2040温度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], '°C')); rp2040_tempChart.setOption(getOption('rp2040温度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], 'ppm'));
ch2oChart.setOption(getOption('CH2O浓度', ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [820, 932, 901, 934, 1290, 1330, 1320], 'ppb'));
window.addEventListener('resize', function () { window.addEventListener('resize', function () {
coChart.resize(); coChart.resize();
@ -104,6 +111,7 @@
ch4Chart.resize(); ch4Chart.resize();
tempChart.resize(); tempChart.resize();
rp2040_tempChart.resize(); rp2040_tempChart.resize();
ch2oChart.resize();
}); });
@ -119,6 +127,7 @@
rebuildChart(ch4Chart, data.ch4, 'ppm'); rebuildChart(ch4Chart, data.ch4, 'ppm');
rebuildChart(tempChart, data.temperature, '°C'); rebuildChart(tempChart, data.temperature, '°C');
rebuildChart(rp2040_tempChart, data.rp2024_temperature, '°C'); rebuildChart(rp2040_tempChart, data.rp2024_temperature, '°C');
rebuildChart(ch2oChart, data.ch2o, 'ppb');
} }
}); });
} }