tinyvg/sdk

TinyVG software development kit

THIS REPO IS ARCHIVED.

DEVELOPMENT CONTINUES AT

https://github.com/TinyVG/

.tvg: Tiny Vector Graphics

A new format for simple vector graphics.

Why?

Quoting the german Wikipedia on SVG:

Praktisch alle relevanten Webbrowser können einen Großteil des Sprachumfangs darstellen.

Translated:

Virtually all relevant web browsers can display most of the language specification.

SVG is a horribly complex format, allowing the embedding of JavaScript and other features no sane person ever wants to have in their images. Other relevant vector graphics formats do not exist or don't have a documentation or specification (looking at you, HVIF!).

This project tries to create and specify a new vector format suitable for:

• Small and medium icons (think toolbar, buttons, …)
• Low complexity graphics (think graphs, diagrams, …)
• Embedded platforms (low resource requirements)

Project Goals

Create a vector graphics format that fulfils the following requirements:

• Binary encoded ✅
• Small file size (must be smaller than equivalent bitmaps or SVG graphics) ✅
• Can be rendered without floating point support (suitable for embedded) ✅
• Can be rendered efficiently with modern GPUs (suitable for PC, games) ✅
• Supports the following drawing primitives:
  • points / circles ✅
  • lines ✅
  • triangles / polygons ✅
• Support drawing styles
  • filled ✅
  • outline ✅
  • filled with outline ✅
• Support
  • flat colors ✅
  • bitmap textures ❌ (won't be included)
  • linear gradients ✅
  • line widths ✅
• Can use hinting to allow really small rendering (16²) ❌ (won't be included due to increased complexity)

Use Cases

The use cases here are listed to be considered while working on the specification and give the project a shape and boundary:

• Application Icons (large, fine details)
• Toolbar Icons (small, simple)
• Graphs (large structure, no details, text, think graphviz)
• Diagrams (colored surfaces, text, lines)
• Mangas/Comics (complex shapes, different line thickness)

Project Status

This project is coming close to finishing Version 1 of the format, and the written spec is the last thing missing.

See the following documents:

• Specification
• Textual Representation

See also this image to have a preview of what is already implemented:

Milestones

• Create prototype implementation
• Finalize prototype
  • Add smaller/bigger colors (16 bit, 30 bit)
  • Add color space information (the color space is defined as sRGB)
  • Add extended coordinate space (32 bit coordinates)
  • Encode primary style in command, reduces command to 63 variants, allows bigger encoding
• Improve rendering
  • Add anti-aliasing
  • Add missing line width modifier for path rendering
  • Improve rendering performance
  • Move anti-aliased rendering into core library
• Implement textual representation
  • Convert to .tvg
  • Convert to text
  • Format text
  • Convert to SVG
• Add auxiliary tools
  • C Library frontend
  • Build SDK
    • Zig package
    • Native packages
      • dynamic macOS x86_64, aarch64
      • static macOS x86_64, aarch64
      • dynamic Windows x86_64
      • static Windows x86_64 (TODO: Linker error with COMDAT when using VS)
      • dynamic Linux x86_64, aarch64, arm
      • static Linux x86_64, aarch64, arm
  • Wasm Polyfill
• Improve website
  • Add manual to tools
  • Add tiger.tvg example file
  • Add comic.tvg example file
  • Add charts.tvg example file (pie, line and bar chart)
  • Add app-icon.tvg example file
  • Add graph.tvg example file
  • Add text file spec/examples
  • Fix polyfill (change CI)
• Benchmark Suite
  • File Size (SVG vs. TinyVG)
  • Update final benchmark
• Sort github issues
• Write specification
• Review specification
• Release!
• Lock the specification into Version 1.

Future Tasks

• Convert from SVG (via external tool)
  • SVG <ellipse>
• (Fill|Draw|Fill Outlined) Ellipse/Circle opcode
• Smooth Bezier (via mirror behaviour)
• Inkscape Plugin
• library/sdk feature: convert TinyVG to draw lists/commands

Resources

• CSS Gradients
  • Radial and conic gradients can be used for nice 3D shading
• Previous Work: TurtleFont is a pure line-drawing vector format
• SVG Path Editor, a tool to easily design or inspect SVG paths

sdk's Issues

Possible to build on ESP32?

If so, how ?

Port svg2tvgt to Rust based on resvg

The author of https://github.com/RazrFalcon/resvg said it might be easier to use resvg as a code base for the SVG converter:

https://news.ycombinator.com/item?id=29637778

This is something that would allow tvg-text to also implement the svg => tvg conversion by linking the Rust code as an object file

Fix line cap definition in exported SVG

Currently, no line caps are emitted to SVG. This is wrong as the rendering will differ between TinyVG rendering and SVG rendering.

Covnerter: Handle "currentColor"

Observed this being used in some SVGs saved in Inkscape, might not be something that's actually coming from there specifically but possibly some other conversion (e.g. FontForge). Currently, it's unhandled, which sets the image to use magenta, which can hide some other things like alpha issues when checking against images.

Expose parser in the C API

Currently, the document parser is only accessible from Zig. Add a interface to the C api

Does not work with latest Zig

Could you test the build using latest nightly Zig?

Support for embedded system

Would it be possible to add a partial rendering function to TinyVG?
Typically, on embedded system, we don't have enough memory to store complete picture buffer in memory. So most system simply call the drawing loop multiple time, each time with a different drawing window.

Applied to a vector format, it means adding a "top/bottom/left/right" clipping to the rendering function so the rendering only happen within the same buffer, but a different output area of the image. That buffer is then transferred to the screen, and the rendering is called again with the next window.

Add C# implementation and publish it on NuGet

Will it by availeble on nuget.org for winforms .net framework

Add gpu rendering helper

Currently, only a software renderer is provided. This should be changed in a way that the SDK supports exporting GPU usable data (export set of triangles).

This feature should provide:

• Exporting a set of triangle data
• Export a set of material definitions/draw calls
• Allow configurable precision for triangulation of round shapes
• Agnostic to rendering api (support Vulkan, OpenGL, DirectX, …)