Jquery canvas 是一種基于 Javascript 的圖像處理工具，通過使用它，我們可以實現一些很酷的圖形效果。其中，縮放是其中一個非常重要且常用的功能。我們可以通過調整畫布尺寸來實現放大縮小的效果。

// 獲取畫布元素
var canvas = document.getElementById('canvas');
// 獲取上下文
var ctx = canvas.getContext('2d');
// 設置縮放大小
var scale = 1;
// 設置縮放中心點
var x = canvas.width / 2;
var y = canvas.height / 2;
// 縮小按鈕事件
$("#btnZoomOut").on('click', function() {
scale -= 0.2;
// 設置畫布縮放變換
ctx.translate(x, y);
ctx.scale(scale, scale);
ctx.translate(-x, -y);
// 重新繪制圖形
draw();
});
// 放大按鈕事件
$("#btnZoomIn").on('click', function() {
scale += 0.2;
// 設置畫布縮放變換
ctx.translate(x, y);
ctx.scale(scale, scale);
ctx.translate(-x, -y);
// 重新繪制圖形
draw();
});
// 繪制圖形函數
function draw() {
// 清空畫布
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 繪制圖形
ctx.beginPath();
ctx.rect(100, 100, 200, 200);
ctx.stroke();
}

在上述代碼中，我們首先獲取了畫布元素和上下文，然后設置了縮放大小和縮放中心點。在縮小按鈕和放大按鈕的點擊事件中，我們通過 scale 變量控制縮放比例，并通過 translate 和 scale 方法設置 Canvas 的縮放變換，最后重新繪制圖形。需要注意的是，我們在每次變換前都通過 translate 方法將中心點移動到畫布的正中央。

通過使用 Jquery canvas，我們可以很方便地實現 Canvas 的縮放操作，輕松創建出非常酷的圖形效果。