Clever Geek Handbook

Individual control of image gestures in winjs canvas

I tried to use the following code to implement a gesture to control individual images placed inside the canvas. But this only works for the whole canvas, not for individual elements

        var can = document.getElementById("canvas");

        for (var i = 0; i < 10; i++) {
            onjarray[i] = document.getElementById("Img" + i);
            can.appendChild(onjarray[i]);
        }


            can.originalTransform = can.style.transform;
            gObj1 = new MSGesture();
            // Defining gesture object for Pen, mouse and touch
            gObj1.target = can;
            can.gesture = gObj1;
            can.gesture.pointerType = null;

            can.addEventListener("MSPointerDown", onPointerDown, false);
            can.addEventListener("MSGestureTap", onTap, false);
            can.addEventListener("MSGestureHold", onHold, false);
            can.addEventListener("MSGestureChange", onGestureChange, false);
            can.addEventListener("wheel", onMouseWheel, false);
            // Mouse Wheel does not generate onPointerUp
            can.addEventListener("MSGestureEnd", onGestureEnd, false);

can anyone point me to the right to control the gesture of individual elements on the canvas.

+3


source to share


1 answer


Impossible. Once you "spray" an element onto the canvas, your control over it is lost forever. You cannot change it, delete it or capture events on it. In essence, it is no longer an element - t just pixels on the canvas. You can overlay SVG shapes on top of your canvas and capture custom events that apply to the SVG object. Will this work for you?



+1


source






More articles:


All Articles