资源来源网络，如果需要授权，请大家更换源码，模块仅供学习，下载后请2小时内删除，如需商用请购买正版授权
HTML代码
<canvas id="c" width="1200" height="750"></canvas>
js代码
//uncomment lines 54/55/56 for different results
var b_canvas,
contxt,
dotCount = 400,
lineWidth = .35,
variance=600,
layoutRadius = 400,
w = document.getElementById('c').width, h = document.getElementById('c').height,
clr = "#fff",
dotArray = [];
var angInc = 360/dotCount;
//
start();
//
function start() {
b_canvas = document.getElementById("c");
contxt = b_canvas.getContext("2d");
contxt.lineWidth = lineWidth;
contxt.strokeStyle = clr;
contxt.fillStyle = "#000";
initDots();
}
function initDots() {
var dot;
for (var i = 0; i < dotCount; i++) {
dot = new Dot(
i,
layoutRadius * Math.cos((angInc *i) * (Math.PI/180))+ w/2,
layoutRadius * Math.sin((angInc *i) * (Math.PI/180))+h/2
)
dotArray.push(dot)
}
drawDots();
}
function drawDots(){
for(var i=0; i<dotArray.length; i++){
itm = dotArray[i];
contxt.beginPath();
contxt.arc(itm.x, itm.y, 1, 0, Math.PI*2, true);
contxt.fill();
}
connectDots();
}
function connectDots(){
var lineCount = Math.floor(dotArray.length/2);
//console.log("this is ", lineCount)
for(var i=0; i<lineCount; i++){
var num = lineCount+i;
//var num = Math.floor(Math.random()*lineCount+ lineCount)
// var num = 110;
var ptA = dotArray[i];
var ptB = dotArray[num];
// console.log("ddd ",ptA.x, ptB.x);
contxt.beginPath();
contxt.moveTo(ptA.x, ptA.y);
//contxt.lineTo(ptB.x, ptB.y);
contxt.bezierCurveTo(Math.random()*variance,Math.random()*(Math.random()*variance),w/2,h/2.0,ptB.x,ptB.y);
contxt.stroke();
}
}
function Dot(i, x, y) {
this.i = i;
this.x = x;
this.y = y;
}