This commit is contained in:
DasMoorhuhn 2024-06-29 04:12:26 +02:00
parent 5029e46359
commit 4e76c7db1a
3 changed files with 229 additions and 14 deletions

181
Charts/index_2.html Normal file
View File

@ -0,0 +1,181 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Geräte-Diagramme</title>
<style>
body {
background-color: #121212;
color: #ffffff;
font-family: Arial, sans-serif;
}
.chart-container {
width: 80%;
margin: 0 auto;
padding: 20px;
background: #1e1e1e;
padding: 10px;
border-radius: 8px;
margin-bottom: 20px;
}
.chart {
padding: 10px;
}
.device-info {
margin-bottom: 10px;
}
.datepicker-container {
width: 80%;
margin: 20px auto;
display: flex;
justify-content: space-between;
}
.datepicker-container input, .datepicker-container button {
padding: 10px;
font-size: 16px;
background-color: #1e1e1e;
border: 1px solid #444;
border-radius: 5px;
color: #ffffff;
}
.datepicker-container button {
cursor: pointer;
}
</style>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
<h1>Geräte-Diagramme</h1>
<div class="datepicker-container">
<input type="date" id="startDate">
<input type="date" id="endDate">
<button onclick="applyDateRange()">Anwenden</button>
</div>
<div id="charts"></div>
<script>
let allData = [];
fetch('history.json')
.then(response => response.json())
.then(jsonData => {
allData = jsonData;
displayCharts(jsonData);
})
.catch(error => console.error('Error loading data:', error));
function applyDateRange() {
const startDate = new Date(document.getElementById('startDate').value);
const endDate = new Date(document.getElementById('endDate').value);
const filteredData = allData.filter(entry => {
const entryDate = new Date(entry.data.timestamp);
return entryDate >= startDate && entryDate <= endDate;
});
displayCharts(filteredData);
}
function displayCharts(data) {
document.getElementById('charts').innerHTML = '';
const deviceDataMap = new Map();
data.forEach(entry => {
const deviceMac = entry.device.mac;
if (!deviceDataMap.has(deviceMac)) {
deviceDataMap.set(deviceMac, {info: entry.device, data: []});
}
deviceDataMap.get(deviceMac).data.push(entry.data);
});
deviceDataMap.forEach((deviceData, deviceMac) => createChart(deviceData));
}
function createChart(deviceData) {
const labels = deviceData.data.map(entry => new Date(entry.timestamp).toLocaleTimeString());
const temperatures = deviceData.data.map(entry => entry.temperature);
const humidities = deviceData.data.map(entry => entry.humidity);
const container = document.createElement('div');
container.className = 'chart-container';
const deviceInfo = document.createElement('div');
deviceInfo.className = 'device-info';
deviceInfo.innerHTML = `<strong>${deviceData.info.name}</strong> (${deviceData.info.room})`;
container.appendChild(deviceInfo);
const ctx = document.createElement('canvas');
ctx.className = 'chart';
container.appendChild(ctx);
document.getElementById('charts').appendChild(container);
new Chart(ctx, {
type: 'line',
data: {
labels: labels,
datasets: [
{
label: 'Temperatur (°C)',
data: temperatures,
borderColor: 'rgba(75, 192, 192, 1)',
backgroundColor: 'rgba(75, 192, 192, 0.2)',
yAxisID: 'y-axis-temp'
},
{
label: 'Feuchtigkeit (%)',
data: humidities,
borderColor: 'rgba(153, 102, 255, 1)',
backgroundColor: 'rgba(153, 102, 255, 0.2)',
yAxisID: 'y-axis-humidity'
}
]
},
options: {
responsive: true,
scales: {
yAxes: [
{
id: 'y-axis-temp',
type: 'linear',
position: 'left',
ticks: {
beginAtZero: true,
fontColor: 'white'
},
scaleLabel: {
display: true,
labelString: 'Temperatur (°C)',
fontColor: 'white'
}
},
{
id: 'y-axis-humidity',
type: 'linear',
position: 'right',
ticks: {
beginAtZero: true,
fontColor: 'white'
},
scaleLabel: {
display: true,
labelString: 'Feuchtigkeit (%)',
fontColor: 'white'
}
}
],
xAxes: [{ // Hier war der Fehler
ticks: {
fontColor: 'white'
}
}]
},
legend: {
labels: {
fontColor: 'white'
}
}
}
});
}
</script>
</body>
</html>

View File

@ -1,3 +1,13 @@
<!-- TOC -->
* [ATC_MiThermometer_Gateway](#atc_mithermometer_gateway)
* [Getting started](#getting-started)
* [Run Gateway](#run-gateway)
* [Shell Scripts](#shell-scripts)
* [Docker](#docker)
* [MicroPython for MicroController](#micropython-for-microcontroller)
* [Resources](#resources)
<!-- TOC -->
# ATC_MiThermometer_Gateway # ATC_MiThermometer_Gateway
Python gateway for the [custom firmware](https://github.com/atc1441/ATC_MiThermometer) for the [Xiaomi Thermometer LYWSD03MMC](https://www.mi.com/de/product/mi-temperature-and-humidity-monitor-2/). Python gateway for the [custom firmware](https://github.com/atc1441/ATC_MiThermometer) for the [Xiaomi Thermometer LYWSD03MMC](https://www.mi.com/de/product/mi-temperature-and-humidity-monitor-2/).
@ -49,18 +59,43 @@ cd python/src
sudo python3 main.py sudo python3 main.py
``` ```
### Docker ## Shell Scripts
Build docker container (Currently broken) **build_docker.sh**
| Arg | Meaning | Default |
|---------------|----------------------------|---------------------------------------|
| -t \| --tag | Set a tag for build | develop |
| -i \| --image | Set a image name for build | dasmoorhuhn/atc-mithermometer-gateway |
| -h \| --help | Get this help in the CLI | |
**run_docker.sh**
| Arg | Meaning | Default |
|-------------------|----------------------------------------------|---------------|
| -d | Run in Backgrund | |
| -t \| --tag | Set a docker tag | develop |
| -b \| --build | Build the image before running the container | |
| -l \| --loop | Start the gateway in looping mode | |
| -a \| --api | Start with the API | false |
| -tz \| --timezone | Set the timezone | Europe/Berlin |
| -to \| --timeout | Set the timeout for the bluetooth scan | 20 |
| -h \| --help | Get this dialog in CLI | |
## Docker
Build docker container ()
```bash ```bash
docker-compose build sh build_docker.sh
# Or
sh build_docker.sh -i your-image-name -t your-tag
``` ```
Run docker container. Killing the hosts bluetooth service is needed to access it from the docker container. Run docker container. Killing the hosts bluetooth service is needed to access it from the docker container.
```bash ```bash
sudo sh run_docker.sh sudo sh run_docker.sh
``` ```
### MicroPython for MicroController ## MicroPython for MicroController
Coming when I develop it... Coming when I develop it...

View File

@ -1,27 +1,26 @@
ARCH=linux/arm/v6
#ARCH=linux/amd64
TAG=develop TAG=develop
IMAGE=dasmoorhuhn/atc-mithermometer-gateway
HELP="USAGE: sh build_docker.sh \n HELP="USAGE: sh build_docker.sh \n
[ -a | --architecture ] Select a architecture. Default is auto\n [ -t | --tag ] Select a tag for building. Default is develop \n
[ -t | --tag ] Set a docker tag. Default is develop \n [ -i | --image ] Select image tag for building. Default is dasmoorhuhn/atc-mithermometer-gateway \n
[ -h | --help ] Get this dialog" [ -h | --help ] Get this dialog"
docker_build(){ docker_build(){
docker build --build-arg TARGETPLATFORM=$ARCH --platform $ARCH --tag dasmoorhuhn/atc-mithermometer-gateway:$TAG . docker build --tag $IMAGE:$TAG .
} }
while [ "$1" != "" ]; do while [ "$1" != "" ]; do
case $1 in case $1 in
-a | --architecture )
shift
ARCH=$1
shift
;;
-t | --tag ) -t | --tag )
shift shift
TAG=$1 TAG=$1
shift shift
;; ;;
-i | --image )
shift
IMAGE=$1
shift
;;
-h | --help ) -h | --help )
echo $HELP echo $HELP
exit exit