Показать сообщение отдельно
  #1 (permalink)  
Старый 09.04.2010, 14:07
Кандидат Javascript-наук
Отправить личное сообщение для Jurasmi Посмотреть профиль Найти все сообщения от Jurasmi
 
Регистрация: 25.11.2008
Сообщений: 115

Canvas. Искажение пропорций.
Есть код:

function bubbleClass(el){
		var textEl = el.innerHTML,
			elWidth = el.offsetWidth,
			elHeight = el.offsetHeight;
		
		
		el.innerHTML = 
			"<div>"+ textEl +"</div>"+
			"<canvas></canvas>";
		
		var canvasEl = el.getElementsByTagName('canvas')[0],
			canvText = el.getElementsByTagName('div')[0];
		
		canvasEl.style.height = elHeight+"px";
		canvasEl.style.width = elWidth+"px";
		
		var	canvasElDraw = canvasEl.getContext("2d");
		
		canvasElDraw.fillStyle = "rgb(200,0,0)";
		canvasElDraw.fillRect (0, 0, 50, 50);
	}


Функция получает элемент DOM, в этом элементе рисует квадрат.
Проблема: рисуется не квадрат, а прямоугольник. Видимо сначала отрисовывается всё-таки квадрат, а потом при изменяются размеры холста и он искажается.

Вопрос: как нарисовать квадрат на холсте с размерами "elWidth X elHeight"
Ответить с цитированием