Sunday, January 31, 2010

text() in processing and processing.js


I've started to compare the differences between processing and processing.js about how they implement the text().

How processing draw the text into the canvas?

the main idea is: translate the matrix of the text base on the parameters, then draw the text.

Where the code are?

In processing, we can find the code for text() in section TEXT/FONTS of the file PGraphics.java. Also, the translate() can be found in PMatrix2D.java or PMatrix3D.java.
In processing.js, we can find text() as p.text() inside the processing.js file.

Other resource

HTML 5 canvas - the basics - this is the page from Opera that introduce the basics of canvas 2d. It describes how the Text API work, and it also mentions that, "the Text API is only available in recent WebKit builds, and in Firefox 3.1 nightly builds".

Need to solve

  • To implement the 3D Text in processing.js, I need a 3d translate(). However, it is still missing.
  • How to get their codes or the latest code with the 3d implementation? There are many people working on the processingjs 3d implementation. Some of them have made somethings already. They must have a very good idea about how to deal with the 3d matrix.
  • How the canvas work in 3d? I get basics of 2d, but where is the 3d?


Concluded here Today. Will continue tomorrow.

No comments:

Post a Comment