Draw on HTML Canvas in Ionic App

@ank5 wrote:

I have an HTML canvas that works in desktop but not on iPad. I added the $ionicGesture to it as well, but that did not help. Looks like I am not using $ionicGesture correctly.

.controller('skCtrl', function ($ionicGesture) {

    var canvas = document.getElementById("myCanvas");
    var ctx = canvas.getContext("2d");

    var isMouseDown = false;

    canvas.onmousedown = function(e){
        isMouseDown = true;
    }

    canvas.onmouseup = function(e){
        isMouseDown = false;
    }

    canvas.onmousemove = function(e){
        if(isMouseDown === false){
            return;
        }
        var canvasPosition = canvas.getBoundingClientRect();
        var x = e.clientX - canvasPosition.left;
        var y = e.clientY - canvasPosition.top;
        ctx.fillRect(x, y, 2, 2);
    };

   $ionicGesture.on('dragstart', onmousedown, canvas);
    $ionicGesture.on('drag', onmousemove, canvas);
    $ionicGesture.on('dragend', onmouseup, canvas);
})


<ion-content overflow-scroll="true" padding="false">
      <canvas id="myCanvas"></canvas>
  </ion-content>

Can someone please help me make this work on a device?

Posts: 1

Participants: 1

Read full topic