Forums > Javascript

MaxCanvas jsui documentation?

Nov 11 2011 | 3:54 pm

I feel like I’m asking a question that’s been answered, but searching the forum, max help, and my emails has proven fruitless. Is there any documentation beyond the canvas-examples.maxpat file? Or a recommended reference?

Nov 11 2011 | 4:38 pm

Just the examples, and any online HTML5 Canvas reference. MaxCanvas is just a JS wrapper for MGraphics to assist in porting Canvas code from HTML.

Nov 11 2011 | 5:10 pm

Ok, good to know. It seems that documentation of the use of mgraphics in jsui is equally terse at the moment? I’m pulling things apart to get to a place I can try to build something, and it’s working. I’ll post some simpler examples when I have something, and hopefully get confirmation that my extrapolations are correct before I proceed on an unwise path.

Nov 11 2011 | 6:14 pm

Darwin is currently working more detailed mgraphics documentation. As he is doing that, he’s putting together a JSUI-mgraphics a day patch, which I highly recommend. Don’t miss it.

FWIW, if you’re not porting from HTML5 Canvas code, using mgraphics directly will be faster, as it eliminates an extra JS layer.

Nov 11 2011 | 7:59 pm

Ah, there we go. I’m going with canvas at the moment, and will sacrifice a bit of speed for portability. So it looks like paint() is a reserved special function that is called by mgraphics.redraw() ?

Nov 11 2011 | 9:00 pm

Yup – paint() is the magic juice on a redraw(). It is called any time a redraw is required, whether activated by code or by the UI drawing system.

Nov 11 2011 | 9:20 pm

Excellent. Here’s some SUPER BASIC examples that should help someone get started with canvas. Like me, for example :)
The functions where stuff actually happens are setup so you can cut an paste from simple canvas examples and see how they work.

I did notice that the font stuff doesn’t really work. I wasn’t able to specify a font name or size. According to
the font syntax follows that of CSS. The examples I tried didn’t work in Max6, I just got errors:
font "18pt Arial" not available, using default
It also seems that
ctx.textAlign = "center";
doesn’t work right – it just paints the text starting from the far left edge of the JSUI window.


Nov 11 2011 | 10:03 pm

Ooo….just found this:
Illustrator to Canvas. This could be VERY handy. Or a total disaster. Worth trying!
Illustrator as canvas.gen :)

Nov 11 2011 | 10:15 pm

There doesn’t seem to be support for getting the pixel size of a loaded image object. According to this
it looks like you should be able to get the value of the image file’s original pixel dimensions with the natrualWidth and naturalHeight properties.

var img = new Image("oscillator.tif");
post("nimg size",img.naturalWidth,img.naturalHeight);

should print
img size 64 64
in the max window. It gives undefined.

Nov 11 2011 | 11:39 pm

don’t mind me while i keep a running diary here :)
regarding font,
` ctx.font = "18px Arial";’
works. I guess "pt" is out of bounds!

Viewing 10 posts - 1 through 10 (of 10 total)

Forums > Javascript