VASEr: better stroke rendering

VASE renderer

About

VASE renderer version 0.42 (VASEr 0.42) is a tessellating library for rendering high quality vector graphics. It is an attempt to address unconventional features in 2d graphics. It is intended for OpenGL 1.1+, but much of the code is API independent C++.

Unconventional features

Per vertex coloring and weighting

VASEr revolutionarily lets you control the color and thickness at each vertex for a polyline. This feature is unseen on any commonly available graphics library.

Linear gradient along curve

A similar feature is also available to curves. Because there are so many vertices on a curve that it is impractical to specify data on each point, VASEr lets you define a linear gradient of color and thickness along the length of a curve, giving you two more degrees of expressive freedom.

Feathering for brush like effects

VASEr must use an outsetting polygon anyway, so it is free (as in computational cost) to scale it up, and it is called feathering in VASEr.

Premium quality anti aliasing

From left to right: raw polygon without anti aliasing,
anti aliased with outset fade polygon,
exaggerated outsetting polygon with wireframe,
same as left without wireframe.

Outset-fade polygon is the high quality, fast, portable, consistent and hassle free technique for anti aliasing. The difficulties are to calibrate the outsetting distance to achieve believable result and to perform tedious tessellation. Luckily VASEr did this for you.

Below are line rendering comparison between VASEr and Cairo, click flip to compare:

VASEr

between VASEr and AGG:

VASEr

There is small difference, but it is more a matter of taste than correctness. In terms of clarity VASEr is like between Cairo and AGG, and VASEr is the most crisp among the three. VASEr even do pixel alignment to 1px completely horizontal or vertical lines.

The flaw is, because the outsetting distance is resolution dependent, while the triangulation is unaffected under rotational transformation, fidelity will be lost under scale and sheer.

Performant

VASEr is for real time rendering. Tessellation is done on CPU and the triangles are then sent off to GPU for rasterization. VASEr is fast regardless of the rendering resolution.

Can tessellation be accelerated by GPU? Probably, but I have no plan to do so. The performance enhancement strategy of VASEr is adaptation, that means doing expensive joint processing only when necessary and unperceivablely switch to approximation for thin lines and curves. The decision requires some global information and result in lots of branching, which makes it harder to write GPU programs. But after all, correctness is the first priority and performance is the last.

"Next generation" 2d graphics?

Q: Who needs "Per vertex coloring and weighting", "Linear gradient along curve" or "Feathering for brush like effects" in vector graphics? A: Same answer as "who needs typesetting and beautiful fonts on their computers?".

Q: These effects can be achieved by vector graphics package XXX using tool AAA then effect BBB, so who needs VASE renderer? A: Arguably true. But the fundamental change is making vertex a three dimensional entity (position, color, weight), and to supercharge the intrinsic properties of strokes. The idea is, it should be natural to apply colors and thickness to a stroke.

Status

VASEr is production ready for conventional use. The unconventional features are largely usable for normal circumstances, but may have defects at extreme cases. In particular, varying thickness is undesirable at acute angles and when weight difference is large. So it is not bullet proof yet. The tessellation code is tediously written for each point for each triangle for each circumstance, because a general outsetting and tessellating algorithm is doomed to be slow.

Currently VASEr is only a programming library and is not used in any vector graphics tool. I do have a plan (a plan only) to develop associated tools.

VASEr is not (yet) a general purpose graphics library like Cairo, its feature is still very limited. It has been developed slowly over the years. I always wanted to develop VASEr into a general purpose graphics library, but just do not have the time. It takes more effort than you may think to develop a rendering routine. Any comment, bug report or patch is greatly appreciated. In any case, sending me any form of encouragement (e.g. great work, thank you, donation) will help.

Documentation

getting started
API reference
Articles
Drawing polylines by tessellation.
Drawing nearly perfect 2D line segments in OpenGL

Source code

Package with documentation, source code, sample images and sample programs is on github. Comments, discussions, and contributions are greatly appreciated. You can reach me via email or on github.

Briefly about me

Computer graphics, both 2d and 3d, is my passion. When I realised technology in 2d graphics is advancing much slower than 3d graphics, I felt that may be I could research on and contribute to 2d graphics. At this moment, I am a computer engineering undergraduate in The Hong Kong University of Science & Technology. You can check my Personal Portfolio for more programming, graphics and art works.

License

VASE renderer version 0.42 (VASEr 0.42) is licensed under The 3-Clause BSD License.