(function(ph,win){
var info = {
config:{
colors:[
"#FFFFFF","#FF0000","#00FF00","#0000FF","#FF00FF",
"#00FFFF","#FFFF00","#000000","#70DB93","#5C3317",
"#9F5F9F","#B5A642","#D9D919","#A67D3D","#8C7853",
"#A67D3D","#B87333","#FF7F00","#42426F","#5C4033",
"#2F4F2F","#4A766E","#4F4F2F","#9932CD","#871F78",
"#6B238E","#2F4F4F","#97694F"
],
canvasWidth:500,
canvasHeight:309,
lineSum:100, // lines num
lineLen:200, // line default length
lineLenMin:30, // line min length default 0
lineLenMax:150// line max length default equals lineLen
},
//draw line
line:{
sum:0,
success:0,
failure:0
}
}
// delete old myCanvas
let old_myCanvas = document.getElementById("myCanvas");
old_myCanvas&&old_myCanvas.remove();
//canvas_container
let cc = document.querySelector(".col-lg-12");
let canvas = document.createElement("canvas");
canvas.id="myCanvas";
canvas.style="background:#1A414B;border:1px solid #0a656c;border-radius:5px;opacity:0.9"//
cc.insertBefore(canvas,cc.firstChild);
//设置宽高一定要在canvas节点添加之后
canvas.width=info.config.canvasWidth||500;
canvas.height=info.config.canvasHeight||300;
var ctx = canvas.getContext("2d");
//随机线默认数量,默认长度
for(let i=0;i<info.config.lineSum||0;i++){
ctx.beginPath();
drawRandomLine();
ctx.closePath();
}
console.log("sum:"+info.line.sum+" success:"+info.line.success+" failure:"+info.line.failure)
//随机划线
function drawRandomLine(){
if(info.config.lineLen){
if(info.config.lineLenMax>info.config.lineLen
||info.config.lineLenMax<info.config.lineLenMin){
info.config.lineLenMax = info.config.lineLen;
}
if(info.config.lineLenMin>info.config.lineLen
||info.config.lineLenMax<info.config.lineLenMin
||info.config.lineMin<0){
info.config.lineLenMin = 0;
}
}
var radd3 = Math.ceil(Math.random()*(info.config.lineLenMax-info.config.lineLenMin)
+info.config.lineLenMin)||info.config.lineLen;
var rx = Math.ceil(Math.random()*info.config.canvasWidth);
var ry = Math.ceil(Math.random()*info.config.canvasHeight);
var raddx = Math.ceil(Math.random()*radd3);
var raddy = Math.ceil(Math.sqrt(radd3*radd3-raddx*raddx));
ctx.moveTo(rx,ry);
var rx2 = rx+randomDirection(raddx);
var ry2 = ry+randomDirection(raddy);
if(rx2>=0&&rx2<=info.config.canvasWidth&&ry2>=0&&ry2<=info.config.canvasHeight){
ctx.lineTo(rx2,ry2);
info.line.success++;
// console.log("success: "+rx+","+ry+" ===> "+rx2+","+ry2);
}else{
info.line.failure++;
// console.log("failure: "+rx+","+ry+" ===> "+rx2+","+ry2);
}
info.line.sum++;
ctx.closePath();
ctx.strokeStyle= randomColor();
ctx.stroke();
}
//随机取反
function randomDirection(v){
return [0,1,0,1,0,1,0,1,0,1,0,1,0,1,0,1,0,1,0,1][Math.ceil(Math.random()*20)]?v:-v;
}
//随机颜色
function randomColor(){
return info.config.colors[Math.ceil(Math.random()*info.config.colors.length)];
}
})(pheker={},window);
