Метод drawImage

⇐ Предыдущая 1 234 5 6 7 Следующая ⇒

Подготовил: Евгений Рыжков Дата публикации: 14.10.2011

Выводит изображение на хосте. Имеет несколько вариантов синтаксиса с разными назначениями.

Базовый

Просто отображаем загруженную картинку.

drawImage(image, x, y)

Параметры

·image — объект Image();

·x,y — координаты верхнего левого угла изображения.

Масштабирование

drawImage(image, x, y, width, height)

Параметры

·image — объект Image();

·x,y — координаты верхнего левого угла изображения;

·width, height — размеры изображения на холсте.

Изображение будет отмасштабированно согласно указанных размеров. При увеличении масштаба относительно реального изображения, картинка может становиться размытой или зернистой.

Обрезание

drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight)

Параметры

·image — объект Image() или элемент canvas;

·sx, sy — координаты верхнего левого угла слайса относительно изображения;

·sWidth, sHeight — размеры слайса;

·dx,dy — координаты верхнего левого угла обрезанного изображения;

·dWidth, dHeight — размеры обрезанного изображения на холсте.

вырезаем слайс из текущего изображения

результирующую картинку позиционируем и масштабируем на холсте

Пример

Javascript

	var canvas = document.getElementById("picture");
	var ctx = canvas.getContext('2d');

	var img = new Image();
	img.src = "path-to/ff.png";
	img.onload = function(){
	ctx.drawImage(img, 300, 100);
	ctx.drawImage(img, 20, 39, 170, 140, 13, 15, 171, 142);
	}

Метод fill

Делает заливку фигуры.

⇐ Предыдущая 1 234 5 6 7 Следующая ⇒

Дата добавления: 2015-10-19; просмотров: 366. Нарушение авторских прав; Мы поможем в написании вашей работы!

Композиция из абстрактных геометрических фигур Данная композиция состоит из линий, штриховки, абстрактных геометрических форм...

Важнейшие способы обработки и анализа рядов динамики Не во всех случаях эмпирические данные рядов динамики позволяют определить тенденцию изменения явления во времени...

ТЕОРЕТИЧЕСКАЯ МЕХАНИКА Статика является частью теоретической механики, изучающей условия, при которых тело находится под действием заданной системы сил...

Теория усилителей. Схема Основная масса современных аналоговых и аналого-цифровых электронных устройств выполняется на специализированных микросхемах...

Шов первичный, первично отсроченный, вторичный (показания) В зависимости от времени и условий наложения выделяют швы: 1) первичные...

Предпосылки, условия и движущие силы психического развития Предпосылки –это факторы. Факторы психического развития –это ведущие детерминанты развития чел. К ним относят: среду...

Анализ микросреды предприятия Анализ микросреды направлен на анализ состояния тех составляющих внешней среды, с которыми предприятие находится в непосредственном взаимодействии...

Толкование Конституции Российской Федерации: виды, способы, юридическое значение Толкование права – это специальный вид юридической деятельности по раскрытию смыслового содержания правовых норм, необходимый в процессе как законотворчества, так и реализации права...

Значення творчості Г.Сковороди для розвитку української культури Важливий внесок в історію всієї духовної культури українського народу та її барокової літературно-філософської традиції зробив, зокрема, Григорій Савич Сковорода (1722—1794 pp...

Постинъекционные осложнения, оказать необходимую помощь пациенту I.ОСЛОЖНЕНИЕ: Инфильтрат (уплотнение). II.ПРИЗНАКИ ОСЛОЖНЕНИЯ: Уплотнение...

Studopedia.info - Студопедия - 2014-2026 год . (0.011 сек.) русская версия | украинская версия