From 8c54737e5f2f7c66af22ab0f145eb77d0d25d8df Mon Sep 17 00:00:00 2001 From: satori Date: Sat, 7 Dec 2024 07:35:24 +0800 Subject: [PATCH] =?UTF-8?q?=E5=90=88=E5=B9=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 88 +++++++++++++++++++++++++++++++++++++++++++++++------- main.js | 54 --------------------------------- 2 files changed, 78 insertions(+), 64 deletions(-) delete mode 100644 main.js diff --git a/index.html b/index.html index f276872..e4b9d86 100644 --- a/index.html +++ b/index.html @@ -1,11 +1,79 @@ - - \ No newline at end of file + + + + + + 航班 + + + + + + + + \ No newline at end of file diff --git a/main.js b/main.js deleted file mode 100644 index 0d79472..0000000 --- a/main.js +++ /dev/null @@ -1,54 +0,0 @@ -import Chart from 'chart.js/auto' -import { createElement, div, table, thead, tbody, tr, th, td } from '@laniakeasupercluster/widgets' - -const rest = await fetch('http://localhost:2000/api').then(res => res.json()) -document.body.appendChild(div.childs([ - table.childs([ - thead.childs([ - tr.childs([ - th.text('ID'), - th.text('航班号'), - th.text('航空公司'), - th.text('起飞机场'), - th.text('到达机场'), - th.text('数据') - ]) - ]), - tbody.childs( - rest.map(row => tr.childs([ - td.text(row.flight_id), - td.text(row.flight_number), - td.text(row.airline), - td.text(row.origin), - td.text(row.destination), - td.text(row.shuju) - ])) - ) - ]) -])) - -const metrics = await fetch('http://localhost:2000/api/metrics').then(res => res.json()) -const context = createElement({ width: 800, height: 200 }, 'canvas') - -new Chart(context, { - type: 'line', - data: { - labels: metrics.map(row => new Date(row.date).toLocaleDateString()), // 显示日期 - datasets: [{ - label: '航班数量', - data: metrics.map(row => row.count), // 使用 count 作为数据 - backgroundColor: 'rgba(255, 99, 132, 0.2)', // 曲线下方填充颜色（透明度0.2） - borderColor: 'rgba(255, 99, 132, 1)', // 曲线颜色 - borderWidth: 2, // 曲线宽度 - lineTension: 0.3, // 平滑曲线 - fill: true // 填充曲线下方区域 - }] - }, - options: { - scales: { - y: { beginAtZero: true } - } - } -}) - -document.body.appendChild(context)