W3C home > Mailing lists > Public > whatwg@whatwg.org > February 2010

[whatwg] Canvas size and double buffering.

From: Tim Hutt <tdhutt@gmail.com>
Date: Wed, 3 Feb 2010 14:05:32 +0000
Message-ID: <c120886e1002030605h4cb7ed7bm3c0a4d7418ef5fa@mail.gmail.com>
Hi, I've been trying to use the HTML5 canvas to implement a slippy
map. It works ( http://concentriclivers.com/ ), but there were a
couple of issues I had for which there seems to be no good solution.

1. You can only set the size exactly in pixels. It is very hard to get
a resizable canvas that fills the page. You *can* set the size in CSS,
but it doesn't work very well (e.g. using left,right-margin: auto; to
centre the canvas doesn't work. Also it scales the canvas rather than
resizes it.

2. There doesn't appear to be any kind of double buffering capability.
This is pretty critical for animations where you might need to clear
the canvas and then draw stuff. You currently get flickering if you
try.

As for solutions I propose:

1. Allow width=20%, 3em, and so on. The pixel size is then decided by
the device, but it's very easy to query it in javascript (all the
examples I've seen do this anyway). CSS sizes should definitely resize
the canvas rather than scale it.

2. Add a .flipBuffers() method, and either make all canvases double
buffered, or add a 'doublebuffered' tag attribute (which would be more
backwards compatible).

Tim
Received on Wednesday, 3 February 2010 06:05:32 UTC

This archive was generated by hypermail 2.3.1 : Monday, 13 April 2015 23:08:55 UTC