Цитата:
|
Gozar,
ты уже сам убрал косяк -- аргументы перезаписывались в строке 28 |
рони,
Ты видел результат? Почему он такой? Вначале не линия, а сетка. |
Gozar,
точность расчётов
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
</head>
<body>
<canvas id="canvas" width="1000" height="1000" style="border: 1px solid #000"></canvas>
<script>
function setPixel (x, y) {
ctx.beginPath();
ctx.moveTo(x,y);
ctx.arc(x, y, 1, 0, Math.PI*2, true);
ctx.fill();
ctx.closePath();
}
var canvas = document.getElementById('canvas'),
ctx = canvas.getContext('2d');
ctx.fillStyle = 'rgba(0,0,0,1)';
function ronyLine (x1, y1, x2, y2) {
var time = Math.max( Math.abs(x1 - x2), Math.abs(y1 - y2)), //оптимальная точность
a, b, delta, i;
time = 1000// точность для маньяков
for (i=0; i<time; i++) {
delta = i/time;
a = delta*(x2 - x1) + x1;
b = delta*(y2 - y1) + y1;
setPixel(a,b)
//setPixel(Math.round(a),Math.round(b)) //по желанию
}
}
for(var i=0;i<1000;i+=10) {
ronyLine(10, 10, i, 200);
}
</script>
</body>
</html>
|
рони,
Это все прикольно, но в тесте пикселы закрашены не все, а значит ф-ия не подходит, с учетом того, что она еще и немного медленнее других. |
Gozar,
померяй этот вариант )))
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
</head>
<body>
<canvas id="canvas" width="1000" height="520" style="border: 1px solid #000"></canvas>
<script>
function setPixel(x, y) {
ctx.beginPath();
ctx.moveTo(x, y);
ctx.arc(x, y, 1, 0, Math.PI * 2, true);
ctx.fill();
ctx.closePath();
}
var canvas = document.getElementById('canvas'),
ctx = canvas.getContext('2d');
ctx.fillStyle = 'rgba(0,0,0,1)';
function ronyLine(x1, y1, x2, y2) {
var x = Math.abs(x1 - x2),y = Math.abs(y1 - y2) ;
var time = Math.sqrt(x*x + y*y)|0, // больше точек, чем это число на линии нет
a, b, delta, i;
var xx = (x2 - x1) + x1, yy = (y2 - y1) + y1 ; //типа кеш
for (i = 0; i < time; i++) {
delta = i / time;
a = delta * xx;
b = delta * yy;
setPixel(a, b)
}
}
for (var i = 0; i < 1000; i += 10) {
ronyLine(10, 10, i, 500);
}
</script>
</body>
</html>
|
Иногда можно заюзать линейную "кривую" безье.
function bezierLineTo(x1, y1, x2, y2) {
var step = 0.0001; //для большей точности можно находить дистанцию между точками, тогда step = 1 / distance
for (var t = 0; t < 1; t += step) {
var x = (1 - t) * x1 + t * x2;
var y = (1 - t) * y1 + t * y2;
setPixel(x, y);
}
}
|
Цитата:
Кстати кто-нибудь знает какой-нибудь очень быстрый рандом? вот этот: Math.floor(Math.random() * (max - min + 1)) + min; очень медленный. Подойдет от 1 до 360. |
Gozar,
а если один раз сформировать массив рандомный и пользоваться |
Цитата:
1. По точкам строишь вектор. Координаты вектора: x = x2-x1, y = y2-y1 2. Находишь длину (модуль) вектора: sqrt(x^2 + y^2) Если требуется, переводишь декартовы координаты в полярные (или наоборот). |
| Часовой пояс GMT +3, время: 07:47. |