+1 szavazat
(3,2e pont) által 
által szerkesztett

Az alapok gyakorlása > lineToCenter() codeberry feladatnál járok. És amikor rajzolok, mindig vastagnak néznek ki a vonalak, de nem tudom, hogy azért, mert a képernyőmmel van valami gond, vagy azért, mert nem jó a kód.

var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

function random(max, min) {
    return Math.floor(Math.random()*(max-min+1)+min);
}

context.beginPath();

function lineToCenter (x, y, color) {
    context.strokeStyle = color;
    var xCenter = 225;
    var yCenter = 150;
    context.moveTo(x, y);
    context.lineTo(xCenter, yCenter);
    context.stroke();
}

for (var i = 0; i < 100; i++) {
    random(1, 450);
    var x = random(1,450);
    var y = random(1,300);
    var color = 'rgb(0, 153, 255)';
    lineToCenter(x, y, color);
}

1 válasz

+1 szavazat
(15,8e pont) által 
által kiválasztott
 
Legjobb válasz

A vonalak azért vastagok (és cakkosak), mert sokszor újrarajzolod őket. Nézd meg, hogy hol van a beginPath! A cikluson kívül, egyszer hívod meg. A beginPath nem csak egy új vonalat kezd, hanem az előzőt "le is zárja". No nem úgy, mint a closePath, ami az alakzatot zárja be. A ciklus első futásakor berajzolja az első vonalat. A második lefutásakor az elsőt és a másodikat. A harmadik lefutásakor az elsőt, a másodikat és a harmadikat. Stb. A beginPath-szal mondod meg a javascriptnek, hogy "eddig bármit is rajzoltál a canvasra, felejtsd el! Újat rajzolunk. Ami a canvason most van, az marad, köszönöm."

(3,2e pont) által 
Köszönöm a visszajelzést a feladathoz, javítottam a `beginPath`helyzetét a kódokban
...