[webkit-dev] Canvas backing resolution

Oliver Hunt oliver at apple.com
Fri Mar 4 08:51:04 PST 2011


For reference desktop webkit implementations will automatically increase the canvas backing store resolution as the device:css pixel ratio increases.

--Oliver

On Mar 4, 2011, at 1:44 AM, Charles Pritchard wrote:

> On 3/4/2011 1:35 AM, Kenneth Rohde Christiansen wrote:
>> Hi again,
>> 
>>> I'm trying to keep the canvas bitmap at the same pixel resolution as the
>>> device,
>>> otherwise it is blurry.
>> OK, I see.
>> 
>>> This, for example, works if the pixel ratio is 2.
>>> <canvas style="width: 100px; height: 100px;" width="200"
>>> height="200"></canvas>
>>> 
>>> Yes, when the user has a zoom level set, I'd like to paint to match the
>>> pixel ratio,
>>> so that, a zoomed in user still receives crisp output, instead of blurry
>>> output.
>> -webkit-device-pixel-ratio does not change when the user scaled the
>> content; it is a device value.
>> 
>> On old iPhone it is 1.0, on Android it can be 0.5, 1.0 and 1.5
>> depending on it being a low, medium (160) or high dpi (240) device. On
>> the iPhone 4 and the new iPod Touch it is 2.0.
>> 
>> On Android devices, with for instance, a device-pixel-ratio of 1.5,
>> you can disable the upscaling by adding target-densitydpi=device-dpi
>> to the viewport meta tag.
>> 
>> What you can do is to disable user scaling (add user-scaling=no to the
>> viewport meta tag) and then handle zooming in your app using the touch
>> events. This only works on mobile devices though.
> 
> I haven't debugged with enough tablet devices, such as the color kindle, to know how many webkit distros it works with.
> What should I do about user zoom on the desktop (and possibly, the kindle) ?
> 
> Drawing in high res, just-in-case, makes for a poorer experience for users at a 1.0 ratio,
> and asking users to slide a "sharpen" slider is a little awkward.
> 
> Mozilla, in their implementation, has setup device-pixel-ratio to scale when the user scales content;
> they directly expose window css pixel ratio value to trusted scripts, but not to web content; requiring
> web content to use css device-pixel-ratio.
> 
> Microsoft has exposed the values through window.screen.
> 
> 
> 
> -Charles
> _______________________________________________
> webkit-dev mailing list
> webkit-dev at lists.webkit.org
> http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev



More information about the webkit-dev mailing list