Login | Iscriviti | FAQ
Anonymous

עיגול עם נקודות רנדומליות

+ Rispondi al messaggio

2 messaggi Pagina 1 di 1


עיגול עם נקודות רנדומליות

da nush2786 » gio mag 15, 2014 2:48 pm

שלום
אני צריכה ליצור מעגל בתוך html canvas 1200x1200 ולמלא אותו בנקודות רנדומליות.
ובעזרת אלגוריתם למצוא את הדרך הכי קצרה יחסית לחבר את כל הנקודות.
את המעגל בניתי מפה אני לא מצליחה להתקדם אם תוכלו בבקשה לכוון אותי להמשך התרגיל.

<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var centerX = canvas.width / 2;
var centerY = canvas.height / 2;
var radius = 70;

context.beginPath();
context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
context.fillStyle = 'white';
context.fill();
context.lineWidth = 5;
context.strokeStyle = '#003300';
context.stroke();
</script>
</body>
</html>
Avatar utente

nush2786

  • Messaggi: 1
  • Iscritto il: gio mag 15, 2014 2:44 pm

Re: עיגול עם נקודות רנדומליות

da XainPro » sab mag 17, 2014 9:55 am

<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

// begin custom shape
context.beginPath();
context.moveTo(170, 80);
context.bezierCurveTo(130, 100, 130, 150, 230, 150);
context.bezierCurveTo(250, 180, 320, 180, 340, 150);
context.bezierCurveTo(420, 150, 420, 120, 390, 100);
context.bezierCurveTo(430, 40, 370, 30, 340, 50);
context.bezierCurveTo(320, 5, 250, 20, 250, 50);
context.bezierCurveTo(200, 5, 150, 20, 170, 80);

// complete custom shape
context.closePath();
context.lineWidth = 5;
context.fillStyle = '#8ED6FF';
context.fill();
context.strokeStyle = 'blue';
context.stroke();
</script>
</body>
</html>
Avatar utente

XainPro

  • Messaggi: 3933
  • Iscritto il: ven feb 17, 2012 8:10 pm


+ Rispondi al messaggio

Pagina 1 di 1