Показать сообщение отдельно
  #1 (permalink)  
Старый 14.04.2016, 11:16
Интересующийся
Отправить личное сообщение для Сергей16 Посмотреть профиль Найти все сообщения от Сергей16
 
Регистрация: 29.03.2016
Сообщений: 15

Как подключить окно к нопке canvas
Здравствуйте.
Не могу подключить вторую пару значений(digit) вводимых через импуты к кнопке. Первая пара отрабатывает, а при добавлении второй пары значений, отрабатывается только последние, что написано в скрипте.
В скрипте указано, где не работает.
var example = document.getElementById("example"),
			    ctx     = example.getContext('2d');
             example.width  = 600;
            example.height = 600;
			
(function (undefined) {
	var $ = function (id) {
		return document.getElementById(id);
	};
	var drawCells = function (ctx, size) {
		size = size || 100 ;
		var canv = ctx.canvas;
		var w = ctx.canvas.width, h = ctx.canvas.height;
		var count = Math.ceil(Math.max(w , h) / size);
		ctx.save();
		ctx.beginPath();
		
	};
	
	var scale = function (ctx) {
		ctx.scale(
			$('digit01').value /100  ,
			$('digit02').value /100  
			
		);
	};
	
	
	var draw = function () {
		var ctx = $('example').getContext('2d');
		ctx.clearRect(0,0,ctx.canvas.width, ctx.canvas.height);//
		drawCells(ctx, 80);
		ctx.save();
		ctx.translate(0, 0);
		scale(ctx);
		ctx.fillStyle="#510707";
    ctx.fillRect(0,0,10,10)
		ctx.restore();
		
	};
	var img = new Image;
	ctx.fillStyle="#510707";
    ctx.fillRect(0,0,100,60)
		ctx.restore();
	img.onload = draw;
	$('redraw').onclick = draw;//конец первой пары. Без дальнейшего отрабатывает как надо. Как подключить обе пары?
	
	var scale1 = function (ctx) {
		ctx.scale(
			
			$('digit04').value /100  ,
			$('digit03').value /100 
		);
	};
	var draw1 = function () {
		var ctx = $('example').getContext('2d');
		ctx.clearRect(0,0,ctx.canvas.width, ctx.canvas.height);//
		drawCells(ctx, 80);
		ctx.save();
		ctx.translate(0, 0);
		scale1(ctx);
		ctx.fillStyle="#510707";
    ctx.fillRect(0,0,10,10)
		ctx.restore();
		
	};
	var img = new Image;
	ctx.fillStyle="#510707";
    ctx.fillRect(0,0,100,60)
		ctx.restore();
	img.onload = draw1;
	$('redraw').onclick = draw1;
})();
Ответить с цитированием