lundi 8 mai 2017

How to draw multi images of the same object onto a single canvas

I want to draw onto a canvas multi times with the same image, in other words i want to apply code that will when i click on the canvas area produces an image and when i click again somewhere else it produces another image and so on.

<canvas></canvas>

But when trying to draw again it instead replaces the previous image that was drawn and then draws the new image. instead of keeping the previous drawn image on the canvas.

function drawAll(){
    context.drawImage(imageObj, 0, 0, imageObj.width, imageObj.height,0, 0, 700, 618);

    if(coordinates.length > 0){
    coordinates.map((coord, key) =>{
    context.beginPath();

    context.moveTo(coord.startX, coord.startY);

    context.lineTo(coord.toX,coord.toY);

    context.strokeStyle="rgb(226, 104, 36)";
    context.lineWidth=2;
    context.stroke();                   
        });
    }

    if(entry){
        context.drawImage(imageObjBall, entry.posX-8, entry.posY-8, 16, 16);
    }
}

NOTE: This is in laravel 5, there is more code outside of this but i felt this was the necessary snipped needed for you to be able to help me but if you need more please ask me to edit some more code into this post



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire