Add sign status for Lagrange.Core

This commit is contained in:
2024-05-11 00:16:38 +08:00
parent 75a4d1fdcb
commit 205b69e5cb
12 changed files with 133 additions and 23 deletions

View File

@ -0,0 +1,3 @@
name: Sign Status
description: for Lagrange
version: 2024.4.26

View File

@ -0,0 +1,4 @@
.sign-chart {
height: 400px;
background-color: rgba(255, 255, 255, 0.7);
}

View File

@ -0,0 +1,41 @@
// 数据类型声明
// import * as echarts from 'echarts';
let data = JSON.parse(document.getElementById("data").innerText) // object
const signChartDivTemplate = document.importNode(document.getElementById("sign-chart-template").content, true)
data.forEach((item) => {
let signChartDiv = signChartDivTemplate.cloneNode(true)
let chartID = item["name"]
// 初始化ECharts实例
// 设置id
signChartDiv.querySelector(".sign-chart").id = chartID
document.body.appendChild(signChartDiv)
let signChart = echarts.init(document.getElementById(chartID))
signChart.setOption(
{
animation: false,
title: {
text: item["name"],
textStyle: {
color: '#000000' // 设置标题文本颜色为红色
}
},
xAxis: {
type: 'category',
data: item["times"],
},
yAxis: {
type: 'value',
min: Math.min(...item["counts"]),
},
series: [
{
data: item["counts"],
type: 'line'
}
]
}
)
})

View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="zh" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title>Liteyuki Status</title>
<link rel="stylesheet" href="./css/card.css">
<link rel="stylesheet" href="./css/fonts.css">
<link rel="stylesheet" href="./css/sign_status.css">
</head>
<body>
<template id="sign-chart-template">
<div class="info-box sign-chart">
</div>
</template>
<div class="data-storage" id="data">{{ data | tojson }}</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.5.0/echarts.min.js"></script>
<script src="./js/sign_status.js"></script>
<script src="./js/card.js"></script>
</body>

View File

@ -62,6 +62,8 @@ let maxHourlyItem = 8
let percentWidth = 1 / (maxHourlyItem * 1.5) * 100
let hourlyStep = 2 // n小时一个数据
let hourlyCount = 0
let hourlyItemDivTemplate = document.importNode(document.getElementById("hourly-item-template").content, true)
weatherHourly['hourly'].forEach(
(item, index) => {
if (index % hourlyStep !== 0) {
@ -71,7 +73,7 @@ weatherHourly['hourly'].forEach(
return
}
let hourlyItemDiv = document.importNode(document.getElementById("hourly-item-template").content, true)
let hourlyItemDiv = document.importNode(hourlyItemDivTemplate, true)
hourlyItemDiv.className = "hourly-item"
hourlyItemDiv.querySelector('.hourly-icon').setAttribute("src", `./img/qw_icon/${item["icon"]}.png`)
hourlyItemDiv.querySelector('.hourly-time').innerText = get_time_hour(item["fxTime"])
@ -90,8 +92,10 @@ let daysStandard = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'fri
let todayDay = new Date().getDay()
let days = [localData['today'], localData['tomorrow']]
for (let i = 0; i < 5; i++) {
days.push(localData[daysStandard[(todayDay+2+i) % 7]])
days.push(localData[daysStandard[(todayDay + 2 + i) % 7]])
}
let dailyItemDivTemplate = document.importNode(document.getElementById("daily-item-template").content, true)
weatherDaily['daily'].forEach(
(item, index) => {
if (index >= maxDailyItem) {
@ -101,7 +105,7 @@ weatherDaily['daily'].forEach(
if (index >= 2) {
today += `(${item["fxDate"].split("-")[1]}.${item["fxDate"].split("-")[2]})`
}
let dailyItemDiv = document.importNode(document.getElementById("daily-item-template").content, true)
let dailyItemDiv = document.importNode(dailyItemDivTemplate, true)
dailyItemDiv.querySelector('.icon-day').setAttribute("src", `./img/qw_icon/${item["iconDay"]}.png`)
dailyItemDiv.querySelector('.icon-night').setAttribute("src", `./img/qw_icon/${item["iconNight"]}.png`)

View File

@ -72,5 +72,5 @@
<div class="info-box" id="days-info"></div>
<script src="./js/card.js"></script>
<script src="js/weather_now.js"></script>
<script src="./js/weather_now.js"></script>
</body>

View File

@ -1,3 +1,11 @@
:root {
--main-text-color: #fff;
--sub-text-color: #ccc;
--tip-text-color: #999;
--device-info-width: 240px;
}
.data-storage {
display: none;
}

View File

@ -42,7 +42,7 @@
<div id="motto-text"></div>
<div id="motto-from"></div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.3.0/echarts.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.5.0/echarts.min.js"></script>
<script src="./js/motto.js"></script>
<script src="./js/card.js"></script>
<script src="./js/status.js"></script>