Problem with draggable

[vpascoal]

Hi!

In this example why jcanvas adds three images?

If I set draggable to false it doesn't add.
And something weird happens too when I mouseover canvas. (one of the images changes its position in the stack)

Am I missing something?

What I want is to zoom in/out an image in canvas by having two buttons. But when I click in one of the buttons, the image gets repeated inside the canvas

Thank you

[caleb531]

Set layer: true in addition to draggable: true/false and you should be good to go. Draggable drawings are implicitly layers but non-draggable drawings must be made layers via layer: true. I recommend always setting layer: true for drawings in jCanvas.

Caleb

[vpascoal]

Hi!

Thank you but even setting layer: true doesn't work.

[caleb531]

The images will be repeated upon clicking the button because because calling drawImage() with layer: true will create a new image layer on the canvas. The only exception is if you've specified a unique name for that image, and a layer with that name already exists.

As for the position change, images in jCanvas are drawn asynchronously, and so the point at which your image is drawn depends on when the image loads (and that in itself depends on many other factors). Fortunately, calling drawLayers() after adding your image layers should do the trick. In fact, I also recommend calling addLayer() with type: 'image' instead of calling drawImage() to reduce ambiguity.

[vpascoal]

Your advices guided me to this:

http://jsfiddle.net/vpascoal/j9kja28L/

Thank you