ThorVG WebCanvas API & Playground

[tinyjin]

Hi, community!

We’d like to share an experimental Web package named @thorvg/webcanvas, which exposes a high-level, object-oriented Canvas API for ThorVG vector graphics rendering on the web.

This work aims to make it easier to:

• Access ThorVG's native capabilities via JavaScript
• Native TypeScript support with complete type definitions
• Render vector graphics with WASM-backed performance
• Use a familiar, Object-oriented API
• Experiment with WebAssembly-driven vector rendering in modern web environments

📘 API Documentation
https://www.thorvg.org/web-apis

🧪 Playground
https://www.thorvg.org/playground

The API and tooling are currently experimental and under active development.

---

Background & Motivation

ThorVG provides a powerful native vector graphics engine, but using it from web environments has historically required lower-level integration and custom glue.

@thorvg/webcanvas aims to bridge that gap by offering concrete distribution.

To support experimentation, we also provide a web playground environment for prototyping and observing rendering behavior interactively.

---

How to Try It

Simply open the Playground (no setup required).

Note: The @thorvg/webcanvas npm package is not yet distributed and remains under experimental development.

For local setup instructions, please refer to the following PR (However, the workflow may not be stable.)

---

Feedback Wanted (Feel Free!)

Since this is under active experimental, we’d like to gather casual feedback early.
Please feel free to comment with notes, impressions, or questions.

---

Thanks in advance to anyone who tries it out.