使用 javascript 画布绘制带圆圈的多边形

Question

大家好，有没有一种方法可以使用 java 脚本画布绘制一个带有圆圈的多边形，这样我就可以将每个圆圈称为一个包含其坐标和索引的对象。我想直观地绘制完整的 k 部图。 谢谢

Answer 1

画布的工作方式与 ms paint 非常相似。一旦你在上面画了一个圆圈，计算机就会忘记这个圆圈，只记住像素。您需要自己跟踪它：

我没有测试下面的代码，但希望你能明白。

希望这可以帮助您入门： http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html

var canvas = document.getElementById("mainCanvas");
var ctx = canvas.getContext("2d");
var circles =[];
function addCircle(arg_x,arg_y,arg_rad){
    var newCirc = {};
    newCirc.x = arg_x
    newCirc.y = arg_y
    newCirc.rad = arg_rad
    circles.push(newCirc)
}

function redrawCirc(){
    // loop through circles array and redraw entire graph
    // whenever something changes
    for(var i =0;i<circles.length;i++){
        ctx.arc(circles[i].x,circles[i].y,circles[i].rad,0,Math.PI*2);
    }
}