VPF::вырезать дырку в изображении - Форум программистов

СЭНСЭЙ

Дата 12.3.2012, 17:21 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 432
Регистрация: 20.3.2006

Репутация: нет
Всего: нет

Добрый день!
Есть ли возможность вывести графическое изображение (jpg,gif)
и при этом вырезать в нем дырку?
Например в рисунке вырезать кружок который будет прозрачным.

Amphiluke

Дата 12.3.2012, 19:49 (ссылка)

(нет голосов)

Загрузка ...

☽

Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 35
Всего: 112

Да.

Код


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Hole</title>
<style type="text/css">
html {
    background: url(http://forum.vingrad.ru/images/forum_icons/10_ON.gif) 0 0 repeat;
}
</style>
<script type="text/javascript">
(function() {
    var img = new Image();
    img.src = "http://forum.vingrad.ru/style_images/2/menu/menu.gif";
    
    function drawImg() {
        var ctx = document.getElementById("cnv").getContext("2d");
        ctx.globalCompositeOperation = "xor";
        ctx.drawImage(img, 0, 0);
        ctx.beginPath();
        ctx.arc(388, 96, 75, 0, 2 * Math.PI);
        ctx.closePath();
        ctx.fill();
    }
    
    window.onload = function() {
        if (img.complete) {
            drawImg();
        } else {
            img.onload = drawImg;
        }
    }
})();
</script>
</head>
<body>
    <canvas id="cnv" width="776" height="192"></canvas>
</body>
</html>

Это сообщение отредактировал(а) Amphiluke - 12.3.2012, 20:20

СЭНСЭЙ

Дата 13.3.2012, 16:08 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 432
Регистрация: 20.3.2006

Репутация: нет
Всего: нет

Супер!

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »