86. Немного о CANVAS
В HTML5 появилась крутая вещь – элемент canvas
. Кратко о сути элемента: создание картинки, то есть canvas
– это холст для рисования средствами JavaScript. Мы, конечно, не будем подробно рассматривать рисование средствами JavaScript. Создадим элемент canvas
и определим размера холста. Смотрим на пример первый.
<canvas id = "my_canvas" width = "200" height = "200">
<p>Ваш браузер не поддерживает canvas, а жаль.</p>
</canvas>
И давайте нарисуем что-нибудь. Смотрим второй пример.
<script>
/* находим наш холст */
var canvas = document.getElementById("my_canvas");
var ctx = canvas.getContext("2d");
/* рисуем */
ctx.fillStyle = "rgb(200,0,0)";
ctx.fillRect (10, 10, 55, 50);
</script>
На холсте появится красный квадрат.
Казалось бы, зачем использовать canvas
, если можно в фотошопе спокойно нарисовать картинку. Благодаря canvas
можно создавать динамические картинки (даже браузерные игры). Ранее использовался flash, для этих целей, теперь canvas
. Например, графики, диаграммы и многое другое делают с использованием canvas
.
Похожие уроки и записи блога
- Практики нет, просто нажмите "Проверить задание".
– Не пропускайте новостей, подпишитесь на нашу страницу ВКонтакте.
– На данный момент на сайте нет возможности оставлять комментарии, но Вы можете спросить на любом популярном форуме в интернете.
Это займет не больше минуты.