Публикации по теме 'html5-canvas'
Приложение для совместного рисования: рисование и очистка с других вкладок
В этом разделе мы увидим, как нарисовать фигуру на одной вкладке и отобразить ее на других. Мы также видим, как очистить рисунок на всех открытых вкладках.
Проверка применимости сообщения
Вспомните, когда сервер получает событие отрисовки, он просто транслирует его всем клиентам. Таким образом, клиент должен убедиться, что 1) сообщение относится к комнате, в которой оно находится, и 2) оно не было отправлено этим клиентом. Для этого мы рефакторим Socket.handleMessage для..
Учебник по HTML Canvas — Создание 2D-частиц и управление ими
Мы прошли долгий путь от основ браузера. Такие инструменты, как Three.js и WebGL Studio , библиотеки анимации, такие как Raphael.js или GSAP , растущая популярность SVG и все более благоприятные изменения Javascript за последнее десятилетие изменили анимацию. в браузере из случайной новинки во что-то реальное и интересное для игры. HTML-холст — это отличный способ начать создавать интерактивные визуальные эффекты прямо в браузере. Но анимации много, и лучше всего начать с..
День 8 — Рисование холста с помощью JS
Чему я научился на JavaScript 30 (веб-курс — https://javascript30.com/ )
Кодинг на Github
Сегодня поговорим о рисовании на холсте. Мы изучили d3, но научиться рисовать только на JS тоже интересно. Но я не хочу делать слишком много заметок по этой статье, потому что здесь не так много сложных вещей, и я считаю, что лучший способ использовать или изучить эти функции рисования — это попробовать. Итак, здесь я составил список руководств, которые могут помочь при попытке.
3 шага к..
Вопросы по теме 'html5-canvas'
Запуск наложения jquery из холста html5
Я полный новичок в jQuery, поэтому прошу прощения за любые вопиющие упущения. Прямо сейчас у меня есть веб-сайт, на котором я использую jQuery Tools Overlay для загрузки внешнего html при нажатии на определенные ссылки...
1049 просмотров
schedule
05.05.2024
Подходящая модель для настольной игры «Шашки», реализованная в Canvas с учетом анимации.
Сейчас у меня есть объект Board, который содержит двумерный массив 8x8 (сетка, как я его называю), а фигуры представлены целыми числами 1/2, и я использую побитовую операцию, чтобы пометить фигуру как короля.
У меня также есть объект Checkers,...
1473 просмотров
schedule
01.02.2024
Как создать PDF с помощью HTML5 и JavaScript
У меня есть проект на HTML5, я использовал в нем холст. Я хочу экспортировать содержимое холста в файл PDF.
Может ли кто-нибудь подсказать, как я могу это сделать, используя JavaScript, jQuery или любую другую библиотеку JavaScript?
24863 просмотров
schedule
23.01.2024
Привязать к сетке с помощью изображений, kinetic.js, javascript?
Могу ли я реализовать операцию привязки к сетке с изображениями в KineticJS с помощью jquery? ( http://jqueryui.com/demos/draggable/snap-to.html ) Например, у меня есть несколько перетаскиваемых изображений внутри холста, и я хочу, чтобы они...
4481 просмотров
schedule
21.05.2024
Создание входного текстового поля в точном положении на холсте?
Canvas может рисовать текст, но не может создавать текстовое поле ввода. Это означало бы, что нужно сделать это в html, но тогда как вы можете быть уверены, что это текстовое поле расположено именно там, где вы хотите?
Я хочу иметь возможность...
4880 просмотров
schedule
16.08.2022
canvas.toDataURL для наложений на карту Google.
Ни один из API карт Google не поддерживает возможность поворота наложения карты. Для приложения, которое я пишу, мне нужно повернуть наложение карты на произвольный угол.
Поэтому я подумал, что могу отобразить свой ресурс изображения на холсте,...
2487 просмотров
schedule
11.10.2022
настройка памяти браузера на стороне клиента
У меня есть приложение, в котором пользователь загружает изображения с компьютера, а затем рисует изображения на холсте.
В хроме и фаерфоксе я использую файлридер. Но если пользователь загружает очень большое изображение, оно загружается...
284 просмотров
schedule
12.11.2023
Как реализовать бумажную куклу с анимацией?
Для 2D-игры с видом сверху (например, Zelda + RPG), использующей Canvas и Javascript, как лучше всего реализовать бумажную куклу, допуская при этом анимацию?
Создание анимации с помощью листа спрайтов достаточно просто, но добавление бумажной куклы...
538 просмотров
schedule
08.11.2022
clearRect не стирает последнюю строку
Я рисую два изображения. На одном написано "1х10", на другом "10х10". По сути, я просто рисую квадрат, разделенный 9 вертикальными линиями, или тот же квадрат, разделенный 9 горизонтальными и 9 вертикальными линиями, когда пользователь нажимает на...
444 просмотров
schedule
07.10.2022
3D-звук с javascript на холсте
Я хотел бы знать, возможно ли создать 3D-звуковой эффект с помощью JS?
Идея состоит в том, чтобы повесить звуки на объекты, которые можно перетаскивать по холсту. Если вы перетащите объект вправо от холста, справа от вас появится поле, и наоборот....
2436 просмотров
schedule
14.05.2024
Разрешить теги ‹canvas› в TinyMCE
У меня есть существующий сайт (я его не создавал), который использует tinyMCE. Я пытаюсь избежать необходимости вырывать его и использовать что-то еще, поэтому я решил попробовать и посмотреть, делал ли кто-нибудь это раньше.
Обзор:
Страница в...
1261 просмотров
schedule
23.09.2022
Как сделать плагин для Kinetic.js? (Отредактировано)
Повторно публикую вопрос. Я не объяснил вопрос должным образом раньше, так что извините за это.
Надеюсь, это компенсирует это. Я планирую сделать плагин для Kineticjs. Теперь я не эксперт в этом, поэтому нужна помощь.
Я видел несколько...
401 просмотров
schedule
11.07.2022
Как я могу изменить изображение с помощью CamanJS?
У меня есть несколько изображений, и я хочу загрузить их каждое в один элемент <canvas> в разные моменты времени, а затем манипулировать ими с помощью CamanJS . Я могу заставить первое изображение выглядеть так:
Caman('#canvas-element',...
4939 просмотров
schedule
15.06.2024
используя globalCompositeOperation со строками?
Я пытаюсь сделать часы с элементом холста HTML 5.
То, что я пытаюсь сделать, это сделать строку для каждой секунды, а затем стереть предыдущую строку.
Я хочу стереть предыдущую строку, нарисовав другую с помощью globalCompositeOperation='xor';...
1233 просмотров
schedule
03.11.2023
При рисовании на холсте должны ли расчеты производиться относительно декартовых координат плоскости?
В последнее время я видел много javascript-проектов и библиотек, связанных с холст-графикой, и мне было интересно, как они обрабатывают систему координат. При рисовании фигур и векторов на холсте точки рассчитываются на основе декартовой плоскости и...
1276 просмотров
schedule
03.04.2024
наслоение Canvas для создания фона
С некоторой помощью других участников Stack Overflow. Я создал раздел анимированного холста на веб-сайте, который я создаю.
Я новичок в Canvas, я хочу создать анимированную дугу/окружность.
function animate(elementId, endPercent) {
var...
385 просмотров
schedule
03.12.2023
Ошибка валидатора HTML5
Я пытаюсь проверить страницу HTML5 с помощью валидатора W3C и получаю сообщение об ошибке, информацию о котором не могу найти. Есть ли у кого-нибудь опыт этой ошибки и как ее побороть?
Это HTML-элемент:
<canvas id="eventCanvas"...
312 просмотров
schedule
07.12.2023
Сохранить dataurl холста в файловой системе пользователя
Итак, у меня есть приложение MVC, в котором я создаю изображение холста и получаю URL-адрес данных, просто выполняя canvas.toDataURL("image/png"). Что я хотел бы сделать, так это сохранить это в файловой системе пользователя.
Я попытался сделать...
1117 просмотров
schedule
05.11.2023
Переопределить предупреждения Firefox о небезопасности с помощью about:config
Я пытаюсь написать простой пакетный скрипт, чтобы сделать несколько скриншотов внутренних веб-страниц с моей стороны, и наткнулся на тот факт, что Firefox имеет эту возможность отображать окно на холсте:
var canvas =...
609 просмотров
schedule
28.01.2024
как изменить один и тот же цвет фона каждой фигуры в групповой форме
Я делаю проект в веб-приложении asp.net mvc3, используя canvas и fabric.js. У меня возникла проблема: у меня есть групповая форма, в которой более 3 прямоугольников соединены вместе, чтобы сделать ее одной фигурой. Теперь проблема заключается в том,...
360 просмотров
schedule
04.09.2022