1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>circle</title> 6 </head> 7 <script type="text/javascript"> 8 // javapig draw circle 9 10 function pig(id) { 11 var canvas = document.getElementById(id); 12 if(canvas.getContext){ 13 var ctx = canvas.getContext("2d"); 14 ctx.strokeStyle = "#000"; 15 var circle = { 16 x : 200, 17 y : 200, 18 r : 1 19 //最小圆的半径 20 }; 21 // 画5个圆圈 22 ctx.beginPath(); 23 ctx.arc(circle.x, circle.y, circle.r, 0, Math.PI * 2, true); 24 ctx.stroke(); 25 26 ctx.beginPath(); 27 ctx.arc(circle.x, circle.y, circle.r+30, 0, Math.PI * 2, true); 28 ctx.stroke(); 29 30 ctx.beginPath(); 31 ctx.arc(circle.x, circle.y, circle.r+60, 0, Math.PI * 2, true); 32 ctx.stroke(); 33 34 ctx.beginPath(); 35 ctx.arc(circle.x, circle.y, circle.r+100, 0, Math.PI * 2, true); 36 ctx.stroke(); 37 38 ctx.beginPath(); 39 ctx.arc(circle.x, circle.y, circle.r+140, 0, Math.PI * 2, true); 40 ctx.stroke(); 41 42 43 ctx.lineTo(bp,ep); 44 45 ctx.closePath(); 46 47 ctx.stroke(); 48 49 } 50 51 } 52 53 54 </script> 55 <body bgcolor="" onLoad="pig('y')"> 56 <canvas style="background:#FFF" height="400" width="400" id="y"></canvas> 57 58 </body> 59 </html>
想在这样一个圆环里随机出现一些点,如QQ群里扫描附近的人一样,那个函数怎么用的求赐教
x = rcosθ
y = rsinθ
随机一个θ
新手一个整点具体点代码
@亚麻得:
//ox:原点坐标x, //oy: 原点坐标y, //rMin:半径最小值, //rMax:半径最大值 function randomPoint(ox, oy, rMin, rMax) { var angle = Math.random() * Math.PI * 2; var radius = Math.random() * (rMax - rMin) + rMin; var x = ox + radius * Math.cos(angle); var y = oy + radius * Math.sin(angle); var p = {}; p.x = x; p.y = y; console.log(x + ',' + y); return p; }
比如,你想随机你那个最外环的点,可以这样调用:
randomPoint(200,200,101,141)
啥意思?随机数?
就是随机在圆环里显示点就像QQ群扫描附近的人一样
@亚麻得: 那你就随机出来一个数,放进到里面就行了呀
@Rich.T: 就是不晓得怎么弄才问的js这块才接触
想那么多干嘛.直接随机生成一个横坐标一个纵坐标.直接加上去就得了.
判断是否在园里直接用直角三角函数算就就可以了.要是实在懒得算,就加个蒙层.图片上面再放张中间透明,圆圈外不透明的图片
整点代码参考哈js才接触不熟
Math.random()
整点代码参考哈js才接触不熟