import React from "https://esm.sh/react";
globalThis.React = React;
import { Chart, renderChart } from "https://deno.land/x/fresh_charts/mod.ts";
import { ChartColors, transparentize } from "https://deno.land/x/fresh_charts/utils.ts";
import { renderToString } from "npm:react-dom/server";
const chart = () => ({
type: "bar",
options: { devicePixelRatio: 1 },
data: {
labels: months(barCfg),
datasets: [
{
label: "Dataset 1",
data: numbers(barCfg),
backgroundColor: ChartColors.Red,
},
{
label: "Dataset 2",
data: numbers(barCfg),
backgroundColor: ChartColors.Blue,
},
{
label: "Dataset 3",
data: numbers(barCfg),
backgroundColor: ChartColors.Green,
},
],
},
svgClass: "w-full",
});
export default async function(req: Request): Promise<Response> {
if (req.url.endsWith("/img-chart")) {
return renderChart(chart());
}
return new Response(
renderToString(
<>
<Chart {...chart()} />
</>,
),
{ headers: { "content-type": "text/html" } },
);
}
let _seed = Date.now();
const MONTHS = [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December",
];
export function months({ count = 12, section }: Config = {}) {
const values = [];
for (let i = 0; i < count; ++i) {
const value = MONTHS[Math.ceil(i) % 12];
values.push(value.substring(0, section));
}
return values;
}
export function rand(min = 0, max = 0): number {
_seed = (_seed * 9301 + 49297) % 233280;
return min + (_seed / 233280) * (max - min);
}
interface Config {
min?: number;
max?: number;
from?: number[];
count?: number;
decimals?: number;
continuity?: number;
rmin?: number;
rmax?: number;
prefix?: string;
section?: number;
}
export function numbers({
min = 0,
max = 100,