From 2a3579e447459aaeb7998cf968f73c6ef7ff7a0b Mon Sep 17 00:00:00 2001 From: rookisbusy Date: Fri, 7 Apr 2023 20:43:19 +0800 Subject: feat: add memory chat --- src/misc/chart-memory.ts | 64 ++++++++++++++++++++++++++++++++++++++++++++++++ src/misc/chart.ts | 1 + 2 files changed, 65 insertions(+) create mode 100644 src/misc/chart-memory.ts (limited to 'src/misc') diff --git a/src/misc/chart-memory.ts b/src/misc/chart-memory.ts new file mode 100644 index 0000000..4887b7f --- /dev/null +++ b/src/misc/chart-memory.ts @@ -0,0 +1,64 @@ +import { createAsset } from 'use-asset'; + +import prettyBytes from './pretty-bytes'; +export const chartJSResource = createAsset(() => { + return import('~/misc/chart-lib'); +}); + +export const commonDataSetProps = { borderWidth: 1, pointRadius: 0, tension: 0.2, fill: true }; + +export const memoryChartOptions: import('chart.js').ChartOptions<'line'> = { + responsive: true, + maintainAspectRatio: true, + plugins: { + legend: { labels: { boxWidth: 20 } }, + }, + scales: { + x: { display: false, type: 'category' }, + y: { + type: 'linear', + display: true, + grid: { + display: true, + color: '#555', + drawTicks: false, + }, + border: { + dash: [3, 6], + }, + ticks: { + maxTicksLimit: 3, + callback(value: number) { + return prettyBytes(value); + }, + }, + }, + }, +}; + +export const chartStyles = [ + { + inuse: { + backgroundColor: 'rgba( 116, 162, 249, 0.8)', + borderColor: 'rgb(116, 162, 249)', + }, + }, + { + inuse: { + backgroundColor: 'rgb(98, 190, 100)', + borderColor: 'rgb(78,146,79)', + }, + }, + { + inuse: { + backgroundColor: 'rgba(94, 175, 223, 0.3)', + borderColor: 'rgb(94, 175, 223)', + }, + }, + { + inuse: { + backgroundColor: 'rgba(242, 174, 62, 0.3)', + borderColor: 'rgb(242, 174, 62)', + }, + }, +]; diff --git a/src/misc/chart.ts b/src/misc/chart.ts index 56ffe87..07b1b51 100644 --- a/src/misc/chart.ts +++ b/src/misc/chart.ts @@ -27,6 +27,7 @@ export const commonChartOptions: import('chart.js').ChartOptions<'line'> = { dash: [3, 6], }, ticks: { + maxTicksLimit: 5, callback(value: number) { return prettyBytes(value) + '/s '; }, -- cgit v1.3.1