|
|
@@ -96,6 +96,11 @@ export default {
|
|
|
this.hasDrew = true;
|
|
|
this.lastLoc = this.window2Canvas(e.clientX, e.clientY);
|
|
|
};
|
|
|
+ this.canvas.ontouchstart = (e) => {
|
|
|
+ this.isMouseDown = true;
|
|
|
+ this.hasDrew = true;
|
|
|
+ this.lastLoc = this.window2Canvas(e.touches[0].clientX, e.touches[0].clientY);
|
|
|
+ };
|
|
|
this.canvas.onmouseout = (e) => {
|
|
|
this.isMouseDown = false;
|
|
|
};
|
|
|
@@ -107,12 +112,26 @@ export default {
|
|
|
this.lastLoc = Object.assign({}, curLoc); // U know what I mean.
|
|
|
}
|
|
|
};
|
|
|
+ this.canvas.ontouchmove = (e) => {
|
|
|
+ if (this.isMouseDown) {
|
|
|
+ let curLoc = this.window2Canvas(e.touches[0].clientX, e.touches[0].clientY); // 获得当前坐标
|
|
|
+ this.draw(this.context, this.lastLoc, curLoc);
|
|
|
+ this.history.push([this.lastLoc, curLoc]);
|
|
|
+ this.lastLoc = Object.assign({}, curLoc); // U know what I mean.
|
|
|
+ }
|
|
|
+ };
|
|
|
this.canvas.onmouseup = (e) => {
|
|
|
this.isMouseDown = false;
|
|
|
if (history.length) {
|
|
|
localStorage.setItem("history", JSON.stringify(this.history));
|
|
|
}
|
|
|
};
|
|
|
+ this.canvas.onTouchend = (e) => {
|
|
|
+ this.isMouseDown = false;
|
|
|
+ if (history.length) {
|
|
|
+ localStorage.setItem("history", JSON.stringify(this.history));
|
|
|
+ }
|
|
|
+ };
|
|
|
},
|
|
|
window2Canvas(x, y) {
|
|
|
let bbox = this.canvas.getBoundingClientRect();
|
natasha