Category: canvas

23
Сен
2022

Анимация show/hide содержимого canvas

Пожелание очень простое, но никак не могу найти такое же простое решение.
Есть содержимое canvas. Нужно (начиная с темного экрана) плавно показать его радиальным переходом от центра, а потом также скрыть, от краев к центру.
Мне удалось это…

21
Сен
2022

Нужно определить место клика мышки в java

Я изучаю java но не могу понять как определить место клика все перерыл но внятного ответа не нашел. в месте где можно также рисовать.
вот код(Там немного лишнего но я все по этой теме изучал что смог найти)
import java.awt.*;
import java.a…

21
Сен
2022

Нужно определить место клика мышки в java

Я изучаю java но не могу понять как определить место клика все перерыл но внятного ответа не нашел. в месте где можно также рисовать.
вот код(Там немного лишнего но я все по этой теме изучал что смог найти)
import java.awt.*;
import java.a…

16
Сен
2022

Javascript + Canvas: анимация в цикле

Делаю некий проект с анимацией. Возник вопрос, упростил его до самой сути.
Нужно анимировать рисование нескольких окружностей последовательно:
сначала внутренняя, потом следующая и т.д.
Данный код успешно анимирует, но рисование идет однов…

18
Авг
2022

Текстуры и картинки в HTML canvas

Я пишу браузерную игру, где для отрисовки игроков (танчиков) использую графические примитивын: полигоны, круги, и.т.п. Я хочу делать танки не монотонно-зелёными или серыми, а также добавить камуфляж. Вопрос: Как наложить/нарисовать текстур…

17
Авг
2022

Улучшение производительности интерактивного SVG на html странице

Всем привет! Имеется проблема с большим SVG. На странице необходимо отобразить SVG, но в нем порядка 20к элементов, весит под 20 мб. Сам SVG – это схема трубопроводов: 10 труб по 1500 метров каждая. Одна линия (path) – 1 метр трубы. Получа…

09
Авг
2022

Разрывы в заливке графика chart js в chrome mac os

Появляются разрывы при рендере графика в браузере chrome на mac os, в других браузерах все хорошо.
Разрывы появляются из-за добавления плавных линий c помощью tension в datasets и не зависит от того какое значение задано.
С отключенной ан…

21
Июл
2022

Какие инструменты использовать для создания фоторедактора js?

Необходимо сделать на сайте редактор изображений (типа photoshop) с основными функциями (ластик, откат, рисование, добавление изображений и пр.) Попытался реализовать на canvas в 2д контексте, но по всем туториалам дальше рисования кругов…

23
Июн
2022

Какие технологии нужны для создания конструктора футболок?

Подскажите, на чём можно повторить подобный конструктор? Речь идёт не просто о копировании чужого кода, а о прокачке новых скиллов. Что изучить, чтобы сделать так же? Пример того, что хочу сделать,
здесь.
Если можно избежать использования …

20
Июн
2022

Как в ChartJS вставить картинку вместо точек и отредактировать ее?

Всем доброго времени суток! Изучаю ChartJS, появилась необходимость вставить картинки вместо точек на графике, и отредактировать их: фигурная обрезка картинки(картинка в круге, ромбе, квадрате) и добавить цветную рамку вокруг картинки.
Вст…

16
Май
2022

Рисовалка JavaScript, функция штампа

подскажите пожалуйста. В рисовалке есть кнопка с выбором режима Штамп/Рисовать. Когда нажимаешь "Штамп" на кнопке отображается "Рисовать" и наоборот. И вот вопрос… Как задать кнопке "Штамп" функцию штампа, ч…

10
Май
2022

Как вывести текст поверх передвигаемого изображения в канвасе JS?

В ответе на этот вопрос есть пример с передвижением объектов в канвасе.
Как можно отображать текст в канвасе по центру, чтобы при этом можно было передвигать содержимое канваса как раньше, но текст оставался статичным?
Я поместил ctx.font …

10
Май
2022

вращения 3д куба относительно центра декартовой системы

С помощью проецирование квадрата на плоскость я получил 3д куб. Моя задача крутить его относительно центра и относительно оси z. С помощью функции rotatePoint(x,y,z,fi) я изменяю координать заданой точки. Где fi это тот кут, на сколько гра…

10
Май
2022

вращения 3д куба относительно центра декартовой системы

С помощью проецирование квадрата на плоскость я получил 3д куб. Моя задача крутить его относительно центра и относительно оси z. С помощью функции rotatePoint(x,y,z,fi) я изменяю координать заданой точки. Где fi это тот кут, на сколько гра…

30
Апр
2022

Как отрендерить canvas не загружая страничку?

На страничке есть canvas в js есть файлик принимающий пару значение (блю,текст,поворот и тд).Нужно сделать что бы при пост запросе с параметрами выдавался canvas от этих значений.
Не знаю как реализовать сервак , canvas уже сделал !

24
Апр
2022

Как реализовать частое обновление экрана android приложения на Python, Kivy

Пишу android приложение на Python с помощью Kivy. Нужно запрограммировать графику: линии, окружности и остальное, которые проворачиваются на определенные углы в зависимости от получаемых данных через ssh протокол. Как реализовать обновлени…

13
Апр
2022

Определение ближайших координатных точек

Как определить ближайшие координатные точки при вводе курсора мышки в области (зеленую или желтую), для того что бы отрисовать второй контур и залить его другим цветом.
Координаты лежат в массиве.
Points = [{x:0,y:0},….];

01
Апр
2022

Как программно нарисовать треугольник на canvas в Javascript?

Я пытаюсь создать треугольник на canvas. Но я не уверен, какая сторона равна x1, y1, x2, y2… и т. д. Я сопоставляю свой треугольник с тем, который указан на этом сайте. Но я вижу разные результаты.
Ниже мой код:

var canvasElement = …

18
Мар
2022

Странное поведение при повторной отрисовке прямоугольника в классе JS

Первый раз пытаюсь работать с ООП, пытаюсь создать класс который будет рисовать на canvas. Почему при повторном выполнении метода drawRect() прямоугольник рисуется на половину canvas? Объясните это странное поведение.
Ссылка на codepen: ht…

18
Мар
2022

Проблема с обновлением canvas

Я реализовал генетический алгоритм для решения задачи коммивояжера и хочу, чтобы при нахождении лучшего решения тут же обновлялся canvas, но он почему-то обновляется лишь в конце.
function genetic()
{
for (var i=0; i<2000; ++i)