HTML5画布：设置背景图片

Question

我有一个canvas并使用百日咳th:style标记将背景图像设置到画布上。

<div class="row-fluid">
    <div class="span6">
        <canvas id="myCanvas" th:style="'background: url('+@{backgroundImageUrl}+') no-repeat center center;'" ></canvas>
    </div>
    <div class="span6"></div>
</div>

上面的代码渲染画布的默认大小，裁剪背景图像。由于backgroundImageUrl动态加载各种大小的图像，我无法设置画布的高度和宽度。

如何设置画布的宽度和高度，以便

1. 当背景图片尺寸非常大时，画布应该适合span6 div，而不会裁剪背景图像
2. 当背景图片尺寸非常小时，画布应该适合span6 div并且背景图像应该对齐中心