Question

在我的绘画应用程序中，您可以打开几个“绘图框”并在每个上面绘画。每个绘画框都有一个工具箱，您可以在其中更改画笔的颜色和大小。

该应用程序可以正常接受以下几项： 1.当你打开一个绘画盒并在其上绘画然后打开一个新的并在那个上画画时，你在第一个上画的东西就消失了。打开两个盒子时再次这样做很好（你画的东西都放在两个盒子上），但是只能在一个盒子上改变颜色和大小（改变一个盒子上的颜色会改变另一个盒子的颜色，而不是可以改变那个盒子里的颜色）。你画的东西变得锯齿状

有什么不对？

var color = "red";
var size = 10;

var theWindow = $('.window').last();
var bottomWindow = $('.windowBottom').last();

// code here that creates the toolbar with icons (if clicked on a red icon, color = red;)

var letsdraw = false;
var theCanvas = $('.paint').last();

$('.paint').each(function () {
    this.width = 430;
    this.height = 317;
});

$('.paint').mousemove(function(e) {
    if ($(this).data('letsdraw') === true) {
        var ctx = this.getContext('2d');
        var canvasOffset = $(this).offset();
        ctx.lineTo(e.pageX - canvasOffset.left, e.pageY - canvasOffset.top);
        ctx.stroke();
    }
});

$('.paint').mousedown(function(e) {
    var ctx = this.getContext('2d');
    var canvasOffset = $(this).offset()
    $(this).data('letsdraw', true);
    ctx.strokeStyle = color;
    ctx.lineWidth = size;
    ctx.lineCap = 'round';
    ctx.beginPath();
    ctx.moveTo(e.pageX - canvasOffset.left, e.pageY - canvasOffset.top);
});

$(window).mouseup(function() {
    $('.paint').each(function () {
       $(this).data('letsdraw', false); 
    });
});

我的绘画应用程序的问题

0 个答案: