How can I add a PHP variable to a Konva Drag and Drop Canvas?

Asked

Viewed 38 times

1

I’m making a site where when clicking on a radio button, the value of it (an id of an sql variable) will open next to it in a canvas, so you create an image. My idea is to use Konva’s Drag and Drop Canvas:

<script>
    var width = window.innerWidth;
    var height = window.innerHeight;

    function drawImage(imageObj) {
        var stage = new Konva.Stage({
            container: 'container',
            width: width,
            height: height
        });

        var layer = new Konva.Layer();
        // darth vader
        var darthVaderImg = new Konva.Image({
            image: imageObj,
            x: stage.getWidth() / 2 - 200 / 2,
            y: stage.getHeight() / 2 - 137 / 2,
            width: 200,
            height: 137,
            draggable: true
        });

        // add cursor styling
        darthVaderImg.on('mouseover', function() {
            document.body.style.cursor = 'pointer';
        });
        darthVaderImg.on('mouseout', function() {
            document.body.style.cursor = 'default';
        });

        layer.add(darthVaderImg);
        stage.add(layer);
    }
    var imageObj = new Image();
    imageObj.onload = function() {
        drawImage(this);
    };
    imageObj.src = 'http://konvajs.github.io/assets/darth-vader.jpg';
</script>

I thought about using Ajax, but I don’t know how it will work. What would be the best way?

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.