SOURCE

console 命令行工具 X clear

                    
>
console
function Polygon(n,dx,dy,size,color){
    this.n = n||5;
    this.x = dx||50;
    this.y = dy||50;
    this.size = size||20;
    this.color = color||'HotPink';
}
Polygon.prototype = {
    stroke:function(cxt){
        cxt.save()
        cxt.beginPath();
        cxt.strokeStyle=this.color
        var degree = (2*Math.PI)/this.n;
        for (var i=0;i<this.n;i++){
            var x = Math.cos(i*degree)
            var y = Math.sin(i*degree)
            cxt.lineTo(x*this.size+this.x,y*this.size+this.y);
        }
        cxt.closePath();
        cxt.stroke()
        cxt.restore()
    },
    fill:function(cxt){
        cxt.save()
        cxt.beginPath();
        cxt.fillStyle=this.color
        var degree = (2*Math.PI)/this.n;
        for (var i=0;i<this.n;i++){
            var x = Math.cos(i*degree)
            var y = Math.sin(i*degree)
            cxt.lineTo(x*this.size+this.x,y*this.size+this.y);
        }
        cxt.closePath();
        cxt.fill()
        cxt.restore()
    },
    checkMouse:function(cxt,mouse){
        return cxt.isPointInPath(mouse.x,mouse.y)
    }
}

var c=document.getElementById("mycanvas");
var ctx=c.getContext("2d");
var mouse = {x:0,y:0}
c.onmousemove = function(ev){
    var e = ev||event;
    mouse.x = e.layerX;
    mouse.y = e.layerY;     
};
var arr =[];
var n = 6;
var x = 70;
var y = 75;
// for(var i =0;i<n;i++){
//     var test = new Polygon(6,x,y,50);
//     if(i%2){
//         y -=90
//     }
//     x +=80;
//     y +=45
//     arr.push(test)   
// }
var test = new Polygon(6,70,75,50);
//arr.forEach(function(test){ 
    test.fill(ctx)
    c.addEventListener("mousedown",function(){
        if(test.checkMouse(ctx,mouse)){
            document.addEventListener("mousemove",onMouseMove,false)
            document.addEventListener("mouseup",onMouseUp,false)
        }
    },false);
//})

function onMouseMove(){
   // console.log(JSON.stringify(i))
    ctx.clearRect(0,0,c.width,c.height);
    var newTest = new Polygon(6,mouse.x,mouse.y,50)
    newTest.fill(ctx)
}
function onMouseUp(){
    document.removeEventListener("mouseup",onMouseUp,false)
    document.removeEventListener("mousemove",onMouseMove,false)
}
<canvas id="mycanvas" width="1000" height="1000">