Public
Script
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
/** @jsxImportSource https://esm.sh/preact */
import { render } from "npm:preact-render-to-string";
const HEXRE = /^[A-Fa-f0-9]{3,6}$/;
const toHex = (str) => HEXRE.test(str) ? "#" + str : str;
export default function({
text = "Hello",
bg = "000",
color = "fff",
fontSize = 256,
}: {
text: string;
bg: string;
color: string;
fontSize: number;
}): string {
// note: dominantBaseline does not work with resvg_wasm
const svg = render(
<svg
xmlns="http://www.w3.org/2000/svg"
width="1280"
height="720"
viewBox="0 0 1280 720"
fill={toHex(color)}
style={{
fontFamily: "sans-serif",
fontWeight: "bold",
fontSize,
}}
>
<rect
x="0"
y="0"
width="1280"
height="720"
fill={toHex(bg)}
/>
<text
textAnchor="middle"
x="640"
y={360 + fontSize * 0.25}
>
{text}
</text>
</svg>,
);
return svg;
}
April 30, 2024