ui: Reduce virtual canvas redraws and provide more axis control

A bit of background about VirtualCanvas:

The VirtualCanvas class takes a large element contained within a
scrolling container element, and places a canvas on top of this large
element and moves it around so that it stays covering the viewport of
the scrolling container. Thus it makes it seem that the entire large
element is on big canvas, but avoids the canvas size limits imposed by
most systems.

Because the browser can scroll more quickly than onscroll events are
fired, the overlay canvas is oversized a little to provide a bit of
leeway if onscroll events are delayed. However, the canvas is moved
and needs to be redrawn on every onscroll event.

This CL introduces two new options to VirtualCanvas:

1. tolerancePx: Reduce canvas redraws using a tolerance factor.

This setting allows us to be more lazy when it comes to moving and
redrawing the canvas. This setting defines the minimum distance the
edge of the canvas can get to the viewport before being redrawn.

This, combined with the overdrawPx setting, control how frequently the
canvas is redrawn.

2. overdrawAxes: Control which axes are overdrawn

Currently VirtualCanvas overdraws in both x and y axes as it allows for
scrolling in both axes. The reality is that usually only one axis is
scrolled. This setting allows users to control which axes are overdrawn
which means that it can be disabled in the x axis e.g. if the container
is only scrolled vertically.

Change-Id: I7191f190fc557f9cc73ab67b94bca3105a8d16af