更新一行而不是画一个新的？

Question

注意：我正在运行p5.js

我试图从用户开始拖动到当前拖动的位置绘制一条线。我该怎么做呢？

mOriginX = 0;
mOriginY = 0;


function mousePressed(){
   mOriginX = mouseX;
   mOriginY = mouseY;
}

function mouseDragged(){
   line(mOriginX,mOriginY,mouseX,mouseY);
}

只需从我最初点击的位置开始大量的线条，我怎样才能使它只绘制一条不断更新其位置的线？

Answer 1

要清除画布，请使用clear()功能。

基本上，应该这样做：

mOriginX = 0;
mOriginY = 0;

function mousePressed(){
   mOriginX = mouseX;
   mOriginY = mouseY;
}

function mouseDragged(){
   clear();
   line(mOriginX,mOriginY,mouseX,mouseY);
}

您还可以绘制一条线，然后每次点击重写一次：

mOriginX = 0;
mOriginY = 0;

function draw() {
   line(mOriginX,mOriginY,mouseX,mouseY);
 }
function mousePressed() {
   mOriginX = mouseX;
   mOriginY = mouseY;
   redraw();
 }

可以使用重绘功能参考here。