Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Не работает рисовалка canvas (https://javascript.ru/forum/misc/39592-ne-rabotaet-risovalka-canvas.html)

IVAAAAN 04.07.2013 21:54

Не работает рисовалка canvas
 
Что-то тут сам попытался написать рисовалку, не очень работает, а точнее совсем не работает
function startDraw(tool){
		var cnvs = document.getElementById('cnvs');
		var ctx = cnvs.getContext('2d');
		/*Список инструментов*/
		var brush; //кисть
		var purge; //ластик
		/*Список инструментов*/
		ctx.strokeStyle = '#000';
		var startDraw = false;

		cnvs.addEventListener('mousedown',function(tool) { //нажали на лкм
			// body...
			tool = true;
			startDraw = true;
			ctx.beginPath();

		},false);
		cnvs.addEventListener('mouseup',function(tool) { //отпустили лкм
			// body...
			tool = false;
			startDraw = false;

		},false);
		cnvs.addEventListener('mousemove',function(e,tool) { //отпустили лкм
			var x,y;
				x=e.pageX;
				y=e.pageY;
			if(startDraw==true){
				switch(tool){
					//Кисть
					case 'brush': 
						ctx.lineTo(x - cnvs.offsetLeft, y - cnvs.offsetTop);
						ctx.moveTo(x - cnvs.offsetLeft, y - cnvs.offsetTop);
						ctx.stroke();
				}//Кисть

			}

		},false);
}


<body onload="startDraw('brush');">
<canvas id="cnvs" width="800" height="500"></canvas>

Dim@ 04.07.2013 21:58

IVAAAAN,
function startDraw(){
 var startDraw;
}

:D

IVAAAAN 04.07.2013 22:07

Не помогло

IVAAAAN 04.07.2013 22:12

так я и думал, но как поправить? :-?

IVAAAAN 04.07.2013 22:31

:-? ну как же, помогите, срочно :)

IVAAAAN 04.07.2013 22:57

ну мне бы в моем только коде ошибки пофискить, а не чужой копипастить :)

IVAAAAN 04.07.2013 23:25

да вот это то я сделал, просто рисовалку то. но не понимаю как мне лучше сделать выбор инструментов, ластик например. помогите советом, а :)

IVAAAAN 05.07.2013 00:29

Никто ничего не посоветует? :-?

mta88 05.07.2013 06:00

Цитата:

Сообщение от IVAAAAN (Сообщение 260302)
Никто ничего не посоветует? :-?

у вас все обработчики событий кривые
когда они запускаются, они получают событие
а вы объявили их с переменной "tool" и думаете, что они получат тот же "tool" что и функция "startDraw"

сохраните "tool" в замыкании функции "startDraw" и используйте его оттуда
function startDraw(tool) {
  var my_tool = tool; // вот здесь
  ...
  cnvs.addEventListener('mousemove', function(e) {
    ...
    switch(my_tool) {
      ...
    }
    ...
  });
}


но даже переменная "my_tool" необязательна

function startDraw(tool) {
  ...
  cnvs.addEventListener('mousemove', function(e) {
    ...
    switch(tool) {
      ...
    }
    ...
  });
}

IVAAAAN 05.07.2013 10:25

Спасибо. Но теперь когда я выбираю другой инструмент, то их становится как бы два. Например я одновременно рисую и стираю


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