Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   canvas перерисовывается (https://javascript.ru/forum/misc/53457-canvas-pererisovyvaetsya.html)

nayldock 04.02.2015 21:39

canvas перерисовывается
 
Здравствуйте! Вот такой вопрос: рисую лини в канвасе, выбираю другой цвет, снова рисую линии и все линии поменяли цвет на последний выбранный. Нужно чтобы такого не происходило, т.е. хочу чтобы линии разноцветные были:
<body>
<canvas width="600" height="600" id="holst"></canvas><br>
x:<input type="text" id="x">
y:<input type="text" id="y">

<input type="button" value="начальная точка" onClick="drow()">
<input type="button" value="линия" onClick="drow2()">
<input type="color" id="col">

function drow()
{
var holst = document.getElementById("holst")
var pen = holst.getContext("2d")
var x = parseInt(document.getElementById("x").value)
var y = parseInt(document.getElementById("y").value)
pen.moveTo(x,y)

}
function drow2()
{
var holst = document.getElementById("holst")
var pen = holst.getContext("2d")
var x = parseInt(document.getElementById("x").value)
var y = parseInt(document.getElementById("y").value)
pen.lineTo(x,y)
var col = document.getElementById("col").value
pen.strokeStyle = col
pen.lineWidth = 3
pen.stroke()
}

Для пояснения дополню: в документе 2 текстовых поля - для координат x и y. И 2 кнопки: 1-я ставит начальную точку, вторая после введения новых координат, рисует к этим координатам линию.

jsnb 05.02.2015 05:20

Юзай beginPath() когда новую линию делаешь. В данном случае вставь pen.beginPath() перед pen.moveTo(x,y).

nayldock 05.02.2015 13:12

Спасибо за помощь!:)


Часовой пояс GMT +3, время: 09:08.