Home/ Questions/Q 8699343
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T01:55:30+00:00

I am attempting to use an html canvas element to draw each character available

  • 0

I am attempting to use an html canvas element to draw each character available in a font file to a canvas. To make this question as simple as possible, pretend only one character is drawn to a canvas. From there, I want to use Javascript to analyze the canvas and create triangle regions of the canvas that make up the entire character. The reason I need it in triangles is so that the data can later be sent to WebGL so text can be rendered and data will not be lost be scaling the text size up or down.

I am looking for some sort of algorithm to accomplish this or at least some knowledge to get me going in the right direction. If you believe I should use a different approach please tell me why, but I figured this would be the best to provide a way to modify text in many ways as well as make it possible to create 3d block text.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Here’s an article on how to draw resolution independent curves with shaders

    http://research.microsoft.com/en-us/um/people/cloop/loopblinn05.pdf

    My understanding is instead of breaking the shapes into triangles you break them into quads with enough info sorted in the vertices to draw a portion of the curve inside each quad. In other words, as the shader draws each quad there’s a formula that for each pixel can compute if that pixel is inside the curve or outside the curve.

    • 0