Форум программистов, компьютерный форум, киберфорум
C# для начинающих
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.71/21: Рейтинг темы: голосов - 21, средняя оценка - 4.71
178 / 33 / 17
Регистрация: 02.02.2014
Сообщений: 373

Двумерный градиент

26.09.2019, 19:41. Показов 4194. Ответов 9

Студворк — интернет-сервис помощи студентам
Привет всем! Столкнулся с такой задачей: на поле размером W x H размещено N точек, с координатами (Xn, Yn), каждой из которых задан цвет. Нужно рассчитать двумерный градиент, плавный переход цветов на поле. При этом в исходных точках цвет должен получиться исходным, без примесей. При этом (!) варианты с линейной и кубической интерполяцией не подходят (которые, по сути, являются проведением аналогии с одномерными градиентами). Есть ли какое-либо известное решение у этой задачи, или всё что не линейная/кубическая интерполяция это нетривиальщина?
0
Лучшие ответы (1)
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
26.09.2019, 19:41
Ответы с готовыми решениями:

Градиент
Залить главную форму градиентом.

Двумерный массив преобразовать в двумерный List<T>
имеется матрица Single matr; Не важно как и откуда я ее заполняю, но на выходе выходит матрица из 4-х столбцов. После мне удобней...

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

9
1152 / 860 / 263
Регистрация: 30.04.2009
Сообщений: 3,603
27.09.2019, 10:27
Хоть двумерный хоть пятимерный.
Считаем расстояние до точек где цвет 100% и смешиваем цвета пропорционально расстоянию.
0
178 / 33 / 17
Регистрация: 02.02.2014
Сообщений: 373
27.09.2019, 10:43  [ТС]
смешиваем цвета пропорционально расстоянию.
вот именно на этом моменте я дико туплю, и не могу разобрать, то ли я тупой, то ли задача действительно сложная

У меня не получается задать такую формулу, которая, если применить её к опорной точке - выдаст цвет этой опорной точки без примесей, если применить к любым другим - выдаст цвет плавного перехода. Т.е. если мы делаем что-то вроде
C
1
baseColors[i] / (distance(basePoints[i], curPoint) + 1);
то да, у нас получится, что цвет опорной точки окажется идентичным, но для других точек эта формула выдаст ненулевое значение и, в итоге, когда будем считать результат, получатся примеси. Тут же её влияние расстояния зависит от расстояния между опорными точками: то есть две опорные точки, находящиеся далеко, должны давать медленный переход на всё расстояние между ними, а между ближайшими точками должен быть довольно резкий переход.

Я попытался реализовать через поиск трёх ближайших точек, но всё равно получилось неправильно.
0
1152 / 860 / 263
Регистрация: 30.04.2009
Сообщений: 3,603
28.09.2019, 02:12
Цитата Сообщение от VBDUnit Посмотреть сообщение
то ли задача действительно сложная
Похоже на то
За десять минут гугления самое близкое и хоть примерно куда копать понятное что я нашел это
a color image can be considered as a vector function that associates to each point in R^2 (x1,x2) - pixel - a point in R^3 - color, i.e. (x_1, x_2) -> (f_1(x_1,x_2), f_2(x_1,x_2), f_3(x_1,x_2)) . The gradient is therefore the Jacobian matrix, i.e. the3x2 matrix with enties the partial derivative (df_i / dx_j), i=1,2,3, j=1,2.
https://www.researchgate.net/p... e_gradient

В общем похоже тут без сто грамм высшей математики не разобраться.
0
Модератор
Эксперт .NET
 Аватар для Элд Хасп
16140 / 11264 / 2888
Регистрация: 21.04.2018
Сообщений: 33,110
Записей в блоге: 2
02.10.2019, 08:12
Цитата Сообщение от VBDUnit
это нетривиальщина?
Так и есть.

Если правильно понял задачу, то треба разбить всю плоскость на треугольники с вершинами в заданных точках. По сторонам треугольников цвета задать через линейную интерполяцию. В центре треугольника поставить точку со средним цветом. Все остальные точки считать как линейную интерполяцию между центральной и точкой ребра в этом направлении.
0
178 / 33 / 17
Регистрация: 02.02.2014
Сообщений: 373
02.10.2019, 21:21  [ТС]
Так и есть.

Если правильно понял задачу, то треба разбить всю плоскость на треугольники с вершинами в заданных точках. По сторонам треугольников цвета задать через линейную интерполяцию. В центре треугольника поставить точку со средним цветом. Все остальные точки считать как линейную интерполяцию между центральной и точкой ребра в этом направлении.
Сделал триангуляцию Делоне, после чего интерполяцию цветов вершин треугольников через барицентрические координаты. Получилось, но качество довольно печальное, четко видно грани + если плавно перемещать одну из точек, то триангуляция в какой-то момент резко перестраивает треугольники (что логично) и картинка резко меняется (а вот тут, по идее, не логично ). Барицентр треугольника итак имеет цвет среднего арифметического трёх цветов, поэтому если каждый треугольник разбить на 3 с вершиной в барицентре исходного треугольника, то картина не меняется.

Вот пример такого перескока:
Вариант А
Вариант Б

По идее оно должно работать независимо от порядка триангуляции. Может надо как-то двигать центр масс треугольников? Или использовать нелинейную интерполяцию?

Добавлено через 8 минут
Вот как когда сопромат моста, например, считают - там же тоже разбивают на треугольники. Но там математически доказано, что независимо от моего способа разбиения на треугольники, результат будет одинаковый (+- погрешность). Здесь, я думал, будет так же, но выяснилось, что очевидно, что нет. Как же добиться результата, который не зависит от способа триангуляции?
0
Модератор
Эксперт .NET
 Аватар для Элд Хасп
16140 / 11264 / 2888
Регистрация: 21.04.2018
Сообщений: 33,110
Записей в блоге: 2
03.10.2019, 06:43
VBDUnit, здесь или надо в теорию вкапываться. А это раздел программистов C#, а не теоретиков.
Или методом "научного тыка" пробовать разные способы.
Может имеет смысл обратиться в разделы где обсуждается графика, мультимедиа, игры.

Добавлено через 6 минут
Из "научного тыка".
Чтобы не было резких рёбер, то надо определять окружение точки. Определить для искомой точки ближайших известных соседей (4-6) и цвет определять как смесь цветов этих соседей обратно пропорционально расстоянию до них. Но надо как-то выбрать ближайших соседей чтобы они были со всех сторон, то есть чтобы было круговой охват.
0
677 / 479 / 216
Регистрация: 06.09.2013
Сообщений: 1,312
03.10.2019, 17:17
Ищите материалы про rbf-интерполяцию (rbf - radial basis functions), начать можно отсюда
https://en.wikipedia.org/wiki/... erpolation
2
178 / 33 / 17
Регистрация: 02.02.2014
Сообщений: 373
07.10.2019, 12:05  [ТС]
Из "научного тыка".
Чтобы не было резких рёбер, то надо определять окружение точки. Определить для искомой точки ближайших известных соседей (4-6) и цвет определять как смесь цветов этих соседей обратно пропорционально расстоянию до них. Но надо как-то выбрать ближайших соседей чтобы они были со всех сторон, то есть чтобы было круговой охват.
Думается мне, что тут поможет диаграмма Вороного, но есть ряд вопросов, которые, по крайней мере пока, мне сложны.

Ищите материалы про rbf-интерполяцию (rbf - radial basis functions), начать можно отсюда
https://en.wikipedia.org/wiki/... erpolation
Интересно. В принципе логично - провести кривую поверхность через точки в пространстве (сплайновые поверхности в 3д-редакторах, например) - это, по сути, такая же задача, только вместо интенсивностей каналов у нас высоты.

woldemas, могу ли я получить краткий ликбез о принципе работы этой штуки простыми словами, прежде чем окунуться в пучину матана? Чтобы сразу понимать в какую сторону идти?
0
677 / 479 / 216
Регистрация: 06.09.2013
Сообщений: 1,312
07.10.2019, 15:17
Лучший ответ Сообщение было отмечено Элд Хасп как решение

Решение

Цитата Сообщение от VBDUnit Посмотреть сообщение
могу ли я получить краткий ликбез о принципе работы этой штуки простыми словами, прежде чем окунуться в пучину матана?
Честно говоря, я это так и не использовал, хотя в свое время нарыл именно для подобной вашей задачи интерполяции цвета по узлам.
Но вроде суть там простая и особого матана нет: просто для каждого узла берется функция от двумерной координаты (x, y), которая стремится к нулю с увеличением расстояния от соответствующего узла. Если N узлов, получится N функций. Значение цвета каждой точки двумерной плоскости будет равно взвешенной сумме значений функций:

https://www.cyberforum.ru/cgi-bin/latex.cgi?I(x, y) = \sum_{i = 1}^{N} {\omega_i \phi_i (x, y)}

Чтобы найти https://www.cyberforum.ru/cgi-bin/latex.cgi?\omega_i просто подставляете в уравнение выше узлы и их цвета и получаете линейную систему уравнений относительно коэффициентов https://www.cyberforum.ru/cgi-bin/latex.cgi?\omega_i. После их расчета интерполяционная функция полностью определена. В качестве базовых функций берутся обычно гауссовы ядра.

https://www.cyberforum.ru/cgi-bin/latex.cgi?\phi_i(x, y) = e^{-\alpha \sqrt {(x - x_i)^2 + (y - y_i)^2 }}

Параметр альфа в степени гауссова ядра позволяет регулировать влияние каждого из узлов.
Так в теории, на практике не знаю, может есть нюансы. По крайней мере при интерполяции цветов, мне кажется, цвет будет изменяться более плавно и симметрично относительно узлов, чем при использовании триангуляции.
2
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
07.10.2019, 15:17
Помогаю со студенческими работами здесь

Градиент с зарытой собакой
Привет всем. Есть пример градиента http://rghost.ru/29463581 в котором градиент ведёт себя неправильно. Центр смещается вправо и это...

DrawString: неоднородная заливка текста. Градиент приветствуется
здравствуйте, собственно интересует вопрос рисую текст на компоненте, фон под текстом справа черный, слева белый, разделение четкой...

градиент
li { background:radial-gradient(#FFF6EB,#FF9137); padding:5px; border-bottom:2px solid linear-gradient(green,white); ...

Градиент
Напишите функцию gradient(color), создающую графический файл с плавным переходом цвета. Файл должен содержать прямоугольник длиной 512...

Градиент
Подскажите направление решения дано z(x,y) = (9x)^0,5 + 7y + y(9x^3+7y)^2 точка М(10,0) Найти производную функции u(x,y) в точке...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
10
Ответ Создать тему
Новые блоги и статьи
Программный отбор значения справочника
Maks 21.03.2026
Процедура ВодителиНачалоВыбора(Элемент, ДанныеВыбора, ВыборДобавлением, СтандартнаяОбработка) / / Отключаем стандартную обработку (стандартное открытие формы выбора без фильтров) . . .
Переходник USB-CAN-GPIO
Eddy_Em 20.03.2026
Достаточно давно на работе возникла необходимость в переходнике CAN-USB с гальваноразвязкой, оный и был разработан. Однако, все меня терзала совесть, что аж 48-ногий МК используется так тупо: просто. . .
Оттенки серого
Argus19 18.03.2026
Оттенки серого Нашёл в интернете 3 прекрасных модуля: Модуль класса открытия диалога открытия/ сохранения файла на Win32 API; Модуль класса быстрого перекодирования цветного изображения в оттенки. . .
SDL3 для Desktop (MinGW): Рисуем цветные прямоугольники с помощью рисовальщика SDL3 на Си и C++
8Observer8 17.03.2026
Содержание блога Финальные проекты на Си и на C++: finish-rectangles-sdl3-c. zip finish-rectangles-sdl3-cpp. zip
Символические и жёсткие ссылки в Linux.
algri14 15.03.2026
Существует два типа ссылок — символические и жёсткие. Ссылка в Linux — это запись в каталоге, которая может указывать либо на inode «файла-ИСТОЧНИКА», тогда это будет «жёсткая ссылка» (hard link),. . .
[Owen Logic] Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора
ФедосеевПавел 14.03.2026
Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ВВЕДЕНИЕ Выполняя задание на управление насосной группой заполнения резервуара,. . .
делаю науч статью по влиянию грибов на сукцессию
anaschu 13.03.2026
прикрепляю статью
SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++
8Observer8 10.03.2026
Содержание блога Финальные проекты на Си и на C++: hello-sdl3-c. zip hello-sdl3-cpp. zip Результат:
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru