jCanvas - 在缩放时拖放n拖放

Question

我画了不同图层的画布。如果我放大画布，则不再修正位置。但我希望能够放大，没有任何延期。画布本身被放大。

这是我的函数：

function zoomCanvas(diff){ 
    $("#myCanvas").scaleCanvas({ 
    x: 0, y: 0, 
    scaleX: diff, scaleY: diff 
    }) 
    .drawLayers(); 
} 

Answer 1

因为你与jCanvas层画布上工作，画布需要进行缩放，每当层重绘。

因此，通过将layer属性设置为true，您必须使您的scaleCanvas()呼叫进入jCanvas图层（是的，您实际上可以这样做）。

$("#myCanvas").scaleCanvas({ 
    layer: true, 
    name: "zoom", // give layer a name so we can easily retrieve it later 
    x: 0, y: 0, 
    scale: 1 // set its scale factor to 1 
}); 

然而，为了使其正常工作，你应该所有其他层之前创建此scaleCanvas层，然后你可以改变它的scale属性层。

// Function for setting zoom level of canvas 
function zoomCanvas(diff) { 
    // Update zoom level 
    $("#myCanvas").setLayer('zoom', { 
     scale: diff 
    }) 
    // Redraw canvas 
    .drawLayers(); 
} 

顺便说一句，在scale属性，我用我的例子同时改变你使用在你的scaleX和scaleY性能; scale属性只是为了方便而存在。

最后，这里是a working JSFiddle demo，它实现了所有这些。