Пример теней c#

@4elove4uk · Регистрация: 15.05.2015

Author24 — интернет-сервис помощи студентам

Добрый день, буду рад Вашей помощи, нужен исходник куба 3д, или другой простой фигуры, с реализовано тенью. Желательно на c#. Спасибо

@8Observer8 · 04.04.2017, 14:27

Я вам попозже сделаю пример вращающегося кубика с тенью на C# OpenGL. Я использую OpenTK: https://opentk.github.io/

Я портирую пример из главы "Глава 10. Продвинутые приёмы", параграфа "Отображение теней" этой книги по WebGL. Там реализована тень с помощью FBO. Там кстати, очень подробное объяснение идеи с примером: https://jsfiddle.net/8Observer8/brjzr00n/

@8Observer8 · 04.04.2017, 15:27

Какая у вас версия Visual Studio? Если никакой, то поставьте Visual Studio 2015 Community. Она бесплатная. VS 2017 - говорят, ещё сырая. Запустите вот этот мой пример для теста: LightedCube.rar. Он должен работать в VS2012 - VS2017. Напишите, запускается ли у вас.

Добавлено через 3 минуты
Если вам нужно, чтобы выводилось на окне WinForms или WPF, то дайте знать, тогда можно встроить OpenTK.GLControl на форму и рисовать на данном контролле.

@4elove4uk · 04.04.2017, 15:34 **[ТС]**

У меня студия 2015, надо на виндовсформ, я приложил проект, нужно сделать тени этой фигуре. Буду очень Вам благодарен. Спасибо.
Управлять(вращать, перемещать) клавишами w,a,d,s.

@8Observer8 · 04.04.2017, 15:44

Хорошо, я как раз хотел попрактиковаться на создании теней. Постараюсь сделать сегодня к вечеру.

Добавлено через 1 минуту
Уточните про управление, чем перемещать и чем вращать. Мышкой вращать, а на WASD - перемещать?

@4elove4uk · 04.04.2017, 15:44 **[ТС]**

Если можно, комментируйте, пожалуйста. Спасибо

@8Observer8 · 04.04.2017, 15:51

Да, хорошо. А вы пока скачайте и почитайте ту книгу выше, а точнее ту главу и параграф, что я там написал.

Добавлено через 2 минуты
Если покажется сложно, то вернитесь назад к началу книги, где описываются основы. Очень подробно и доступно всё описывается, но нужно время, чтобы к этому новому всему привыкнуть.

@8Observer8 · 05.04.2017, 21:55

До темы с тенями обязательная тема - это "Использование нарисованного изображения в качестве текстуры". В ней подробно объясняется, что такое объект буфера кадра (Frame Buffer Object), который применяется потом для теней.

Я перевёл этот пример: ch10/FramebufferObject

В этом проекте можно увидеть, как GLControl встраивается в WinForms: FrameBufferObject-WinForms.rar

Завтра постараюсь сделать кубик с тенями и с управлением, потому что с кубиком проще для начала.

@Igor3D · 06.04.2017, 11:41

Не по теме:

Сообщение от 8Observer8

Я портирую пример из главы "Глава 10. Продвинутые приёмы", параграфа "Отображение теней" этой книги по WebGL. Там реализована тень с помощью FBO. Там кстати, очень подробное объяснение идеи с примером: https://jsfiddle.net/8Observer8/brjzr00n/

Вы с таким энтузиазмом рекламируете эту книгу, что и я ее скачал и посмотрел :) Все там хорошо разжевано, просто имейте ввиду - это вещи очень простые, примерно так представлялась CG в конце 80-х. За истекшее время многое появилось, хотя далеко не все есть в OpenGL. Конечно нет ничего плохого в простых и дешевых вещах, но это всего лишь первое (часто весьма грубое) приближение.

@bySawka · 06.04.2017, 12:23

Не по теме:

8Observer8, добрый день, подскажите какую программу используете для создания gif ?

@8Observer8 · 06.04.2017, 12:28

Не по теме:

Сообщение от bySawka

добрый день, подскажите какую программу используете для создания gif ?

Camtasia Studio. Она имеет в составе Recorder для записи видео. Когда запись заканчиваете, то автоматически запускается Camtasia Studio, откуда из меню можно экспортирвать в gif.

@8Observer8 · 09.04.2017, 00:11

Портировал на C# этот пример: https://jsfiddle.net/8Observer8/jsnfwcae/

ShadowGameWindow.rar

Кликните здесь для просмотра всего текста

@Igor3D · 09.04.2017, 14:49

Сообщение от 8Observer8

Портировал на C# этот пример: https://jsfiddle.net/8Observer8/jsnfwcae/

Вот в примере можно настраивать густоту (или черноту) тени. Хорошо, но в жизни разные объекты бросают разные тени. Напр тень от зеленой пластиковой бутылки менее густая и даже зеленоватая. Возможно ли этого достичь современными могучими технологиями?

@8Observer8 · 09.04.2017, 14:58

Сообщение от Igor3D

Возможно ли этого достичь современными могучими технологиями?

Имя этим технологиям OpenGL 2.1. Тут вопрос умеет ли OpenGL такое, а точнее есть описание алгоритмов и математематики для таких теней. Мне пока хватит этого метода, под названием "карта теней". Я наметил себе по данному заданию такие варианты:

Вариант 0:
- цветная плоскость
- цветной кубик
- диффузное и фоновое освещение на шейдерах (OpenGL 2.1)
- тень кубика реализованна с помощью метода карты теней (FBO) на шейдерах
- кубик передвигается с помощью клавиш WASD

Вариант 1:
- цветная плоскость
- несколько цветных кубиков с диффузным и фоновым освещением на шейдерах (OpenGL 2.1)
- тень кубиков реализованна с помощью метода карты теней (FBO)
- один из кубиков передвигается с помощью клавиш WASD
- камера следует за объектом
- камера поворачивается вокруг объекта с помощью зажатой левой кнопки мыши
- реализовано определение столкновений

@Igor3D · 09.04.2017, 16:11

Сообщение от 8Observer8

Тут вопрос умеет ли OpenGL такое, а точнее есть описание алгоритмов и математематики для таких теней.

Разумеется, это просто "фильтр", зеленая бутылка пропускает больше зеленых лучей.

свет_в_тени = свет_источника * filter; // по каждой компоненте R, G, B

Сообщение от 8Observer8

Мне пока хватит этого метода, под названием "карта теней"

Терминология просто ужасна

А какие виды теней вообще есть в CG?

@8Observer8 · 09.04.2017, 20:49

Сообщение от Igor3D

Терминология просто ужасна А какие виды теней вообще есть в CG?

Пока что не знаю. Это первая тень. Терминологию взял из учебника:

Для реализации теней нам потребуется две пары шейдеров: (1) пара шейдеров,
которая вычисляет расстояние от источника света до объектов, и (2) пара шейде-
ров, которая рисует тени с использованием вычисленных расстояний. Нам также
понадобится некоторый способ передачи информации о расстоянии от источни-
ка света, вычисленном первой парой шейдеров, во вторую пару шейдеров. С этой
целью можно использовать изображение текстуры. Такое изображение называют
картой теней, а метод, основанный на создании карты теней, называют наложени-
ем теней. Прием наложения теней выполняется в два этапа:

1. Переместить точку наблюдения в позицию источника света и нарисовать
объекты, видимые оттуда. Сохранить в изображении текстуры (карте те-
ней) расстояния от источника света (точки наблюдения) до каждого фраг-
мента, видимого с этой позиции.

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

@Igor3D · 10.04.2017, 06:23

Сообщение от 8Observer8

Пока что не знаю. Это первая тень. Терминологию взял из учебника:

Это так называемая "buffer shadow" или "bitmap shadow" (возможно "карта теней" - корявый перевод). Главное достоинство - дешевизна расчета. В буфере хранится одно число на точку - расстояние от источника до препятствия (бросившего тень). Отсюда следует что тень может существовать в ограниченном угле (пирамиде) и не может иметь разных цветов (ответ на мой вопрос), поскольку буфер может только сказать "в тени или нет". Правда есть еще расстояние до препятствия которое можно обыграть

@8Observer8 · 10.04.2017, 21:35

Сообщение от Igor3D

Это так называемая "buffer shadow" или "bitmap shadow" (возможно "карта теней" - корявый перевод).

Для интереса посмотрел в оригинал, там называется "shadow map":

You need two pairs of shaders for this process: (1) a pair of shaders that calculate the
distance from the light source to the objects, and (2) a pair of shaders that draws the
shadow using the calculated distance. Then you need a method to pass the distance data
from the light source calculated in the first pair of shaders to the second pair of shaders.
You can use a texture image for this purpose. This texture image is called the shadow
map, so this method is called shadow mapping. The shadow mapping technique consists
of the following two processes:

1. Move the eye point to the position of the light source and draw objects from there.
Because the fragments drawn from the position are hit by the light, you write the
distances from the light source to each fragment in the texture image (shadow map).

2. Move the eye point back to the position from which you want to view the objects
and draw them from there. Compare the distance from the light source to the frag-
ments drawn in this step and the distance recorded in the shadow map from step
1. If the former distance is greater, you can draw the fragment as in shadow (in the
darker color).

@Igor3D · 11.04.2017, 09:34

Сообщение от 8Observer8

Для интереса посмотрел в оригинал, там называется "shadow map":

Не все написанное надо воспринимать как истину в последней инстанции

Ну ладно, пусть объекты расположились вдоль напр оси X в таком порядке

Объект1 ----------- Источник_света ------------------ Объект2 ------------> X

Ну и все это внутри кубика (комнаты, чтобы были стены принимающие тень). Что нужно сделать чтобы оба объекта (1 и 2) бросали тени?

@Igor3D · 12.04.2017, 09:35

Так, вижу изучающий решил отмолчаться

- ну это его право. Еще вопросик

C++

1
2
3

106 var viewProjMatrixFromLight = new Matrix4(); // Для карты теней
107 viewProjMatrixFromLight.setPerspective(70.0, OFFSCREEN_WIDTH/OFFSCREEN_HEIGHT, 1.0, 100.0);
108 viewProjMatrixFromLight.lookAt(LIGHT_X, LIGHT_Y, LIGHT_Z, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0);

Это из книги как устанавливается матрица для рендера тени. Хорошо, но поясните почему тень всегда "расходится", т.е. если мы будем удалять белую плоскость (на которую упала тень) от источника - то тень будет становиться все больше и больше. Можно и наоборот, приближать тр-к (бросающий тень) к источнику. Это правильно напр для лампочки, но ведь для солнца это не так. Как сделать чтобы размер тени не менялся?

@Igor3D 1824 / 732 / 99 Регистрация: 01.10.2012 Сообщений: 3,746
	09.04.2017, 14:49	13
	Сообщение от 8Observer8 Портировал на C# этот пример: https://jsfiddle.net/8Observer8/jsnfwcae/ Вот в примере можно настраивать густоту (или черноту) тени. Хорошо, но в жизни разные объекты бросают разные тени. Напр тень от зеленой пластиковой бутылки менее густая и даже зеленоватая. Возможно ли этого достичь современными могучими технологиями? 0

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	10.04.2017, 21:35	18
	Сообщение от Igor3D Это так называемая "buffer shadow" или "bitmap shadow" (возможно "карта теней" - корявый перевод). Для интереса посмотрел в оригинал, там называется "shadow map": You need two pairs of shaders for this process: (1) a pair of shaders that calculate the distance from the light source to the objects, and (2) a pair of shaders that draws the shadow using the calculated distance. Then you need a method to pass the distance data from the light source calculated in the first pair of shaders to the second pair of shaders. You can use a texture image for this purpose. This texture image is called the shadow map, so this method is called shadow mapping. The shadow mapping technique consists of the following two processes: 1. Move the eye point to the position of the light source and draw objects from there. Because the fragments drawn from the position are hit by the light, you write the distances from the light source to each fragment in the texture image (shadow map). 2. Move the eye point back to the position from which you want to view the objects and draw them from there. Compare the distance from the light source to the frag- ments drawn in this step and the distance recorded in the shadow map from step 1. If the former distance is greater, you can draw the fragment as in shadow (in the darker color). 0

@Igor3D 1824 / 732 / 99 Регистрация: 01.10.2012 Сообщений: 3,746
	11.04.2017, 09:34	19
	Сообщение от 8Observer8 Для интереса посмотрел в оригинал, там называется "shadow map": Не все написанное надо воспринимать как истину в последней инстанции Ну ладно, пусть объекты расположились вдоль напр оси X в таком порядке Объект1 ----------- Источник_света ------------------ Объект2 ------------> X Ну и все это внутри кубика (комнаты, чтобы были стены принимающие тень). Что нужно сделать чтобы оба объекта (1 и 2) бросали тени? 0

@4elove4uk 0 / 0 / 0 Регистрация: 15.05.2015 Сообщений: 41
		1
	Пример теней c# 04.04.2017, 13:25. Показов 5146. Ответов 26 Метки нет (Все метки) Добрый день, буду рад Вашей помощи, нужен исходник куба 3д, или другой простой фигуры, с реализовано тенью. Желательно на c#. Спасибо 0

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	04.04.2017, 14:27	2
	Я вам попозже сделаю пример вращающегося кубика с тенью на C# OpenGL. Я использую OpenTK: https://opentk.github.io/ Я портирую пример из главы "Глава 10. Продвинутые приёмы", параграфа "Отображение теней" этой книги по WebGL. Там реализована тень с помощью FBO. Там кстати, очень подробное объяснение идеи с примером: https://jsfiddle.net/8Observer8/brjzr00n/ Миниатюры 0

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	04.04.2017, 15:27	3
	Какая у вас версия Visual Studio? Если никакой, то поставьте Visual Studio 2015 Community. Она бесплатная. VS 2017 - говорят, ещё сырая. Запустите вот этот мой пример для теста: LightedCube.rar. Он должен работать в VS2012 - VS2017. Напишите, запускается ли у вас. Добавлено через 3 минуты Если вам нужно, чтобы выводилось на окне WinForms или WPF, то дайте знать, тогда можно встроить OpenTK.GLControl на форму и рисовать на данном контролле. 1

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	04.04.2017, 15:44	5
	Хорошо, я как раз хотел попрактиковаться на создании теней. Постараюсь сделать сегодня к вечеру. Добавлено через 1 минуту Уточните про управление, чем перемещать и чем вращать. Мышкой вращать, а на WASD - перемещать? 1

@4elove4uk 0 / 0 / 0 Регистрация: 15.05.2015 Сообщений: 41
	04.04.2017, 15:44 [ТС]	6
	Если можно, комментируйте, пожалуйста. Спасибо 0

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	04.04.2017, 15:51	7
	Да, хорошо. А вы пока скачайте и почитайте ту книгу выше, а точнее ту главу и параграф, что я там написал. Добавлено через 2 минуты Если покажется сложно, то вернитесь назад к началу книги, где описываются основы. Очень подробно и доступно всё описывается, но нужно время, чтобы к этому новому всему привыкнуть. 0

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	05.04.2017, 21:55	8
	До темы с тенями обязательная тема - это "Использование нарисованного изображения в качестве текстуры". В ней подробно объясняется, что такое объект буфера кадра (Frame Buffer Object), который применяется потом для теней. Я перевёл этот пример: ch10/FramebufferObject В этом проекте можно увидеть, как GLControl встраивается в WinForms: FrameBufferObject-WinForms.rar Завтра постараюсь сделать кубик с тенями и с управлением, потому что с кубиком проще для начала. 1

@Igor3D
	06.04.2017, 11:41 #9
	Не по теме: Сообщение от 8Observer8 Я портирую пример из главы "Глава 10. Продвинутые приёмы", параграфа "Отображение теней" этой книги по WebGL. Там реализована тень с помощью FBO. Там кстати, очень подробное объяснение идеи с примером: https://jsfiddle.net/8Observer8/brjzr00n/ Вы с таким энтузиазмом рекламируете эту книгу, что и я ее скачал и посмотрел :) Все там хорошо разжевано, просто имейте ввиду - это вещи очень простые, примерно так представлялась CG в конце 80-х. За истекшее время многое появилось, хотя далеко не все есть в OpenGL. Конечно нет ничего плохого в простых и дешевых вещах, но это всего лишь первое (часто весьма грубое) приближение. 0

@bySawka
	06.04.2017, 12:23 #10
	Не по теме: 8Observer8, добрый день, подскажите какую программу используете для создания gif ? 0

@8Observer8
	06.04.2017, 12:28 #11
	Не по теме: Сообщение от bySawka добрый день, подскажите какую программу используете для создания gif ? Camtasia Studio. Она имеет в составе Recorder для записи видео. Когда запись заканчиваете, то автоматически запускается Camtasia Studio, откуда из меню можно экспортирвать в gif. 0

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	09.04.2017, 00:11	12
	Портировал на C# этот пример: https://jsfiddle.net/8Observer8/jsnfwcae/ ShadowGameWindow.rar Кликните здесь для просмотра всего текста 1

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	09.04.2017, 14:58	14
	Сообщение от Igor3D Возможно ли этого достичь современными могучими технологиями? Имя этим технологиям OpenGL 2.1. Тут вопрос умеет ли OpenGL такое, а точнее есть описание алгоритмов и математематики для таких теней. Мне пока хватит этого метода, под названием "карта теней". Я наметил себе по данному заданию такие варианты: Вариант 0: - цветная плоскость - цветной кубик - диффузное и фоновое освещение на шейдерах (OpenGL 2.1) - тень кубика реализованна с помощью метода карты теней (FBO) на шейдерах - кубик передвигается с помощью клавиш WASD Вариант 1: - цветная плоскость - несколько цветных кубиков с диффузным и фоновым освещением на шейдерах (OpenGL 2.1) - тень кубиков реализованна с помощью метода карты теней (FBO) - один из кубиков передвигается с помощью клавиш WASD - камера следует за объектом - камера поворачивается вокруг объекта с помощью зажатой левой кнопки мыши - реализовано определение столкновений 0

@Igor3D 1824 / 732 / 99 Регистрация: 01.10.2012 Сообщений: 3,746
	09.04.2017, 16:11	15
	Сообщение от 8Observer8 Тут вопрос умеет ли OpenGL такое, а точнее есть описание алгоритмов и математематики для таких теней. Разумеется, это просто "фильтр", зеленая бутылка пропускает больше зеленых лучей. свет_в_тени = свет_источника * filter; // по каждой компоненте R, G, B Сообщение от 8Observer8 Мне пока хватит этого метода, под названием "карта теней" Терминология просто ужасна А какие виды теней вообще есть в CG? 0

@8Observer8 5158 / 2770 / 465 Регистрация: 05.10.2013 Сообщений: 7,321 Записей в блоге: 147
	09.04.2017, 20:49	16
	Сообщение от Igor3D Терминология просто ужасна А какие виды теней вообще есть в CG? Пока что не знаю. Это первая тень. Терминологию взял из учебника: Для реализации теней нам потребуется две пары шейдеров: (1) пара шейдеров, которая вычисляет расстояние от источника света до объектов, и (2) пара шейде- ров, которая рисует тени с использованием вычисленных расстояний. Нам также понадобится некоторый способ передачи информации о расстоянии от источни- ка света, вычисленном первой парой шейдеров, во вторую пару шейдеров. С этой целью можно использовать изображение текстуры. Такое изображение называют картой теней, а метод, основанный на создании карты теней, называют наложени- ем теней. Прием наложения теней выполняется в два этапа: 1. Переместить точку наблюдения в позицию источника света и нарисовать объекты, видимые оттуда. Сохранить в изображении текстуры (карте те- ней) расстояния от источника света (точки наблюдения) до каждого фраг- мента, видимого с этой позиции. 2. Переместить точку наблюдения в исходную позицию и вновь нарисовать объекты. Сравнить расстояние от источника света до фрагмента, нарисо- ванного на этом шаге, с расстоянием, записанным в карту теней на преды- дущем шаге. Если первое расстояние больше, фрагмент можно нарисовать, как находящийся в тени (более темным цветом). 0

@Igor3D 1824 / 732 / 99 Регистрация: 01.10.2012 Сообщений: 3,746
	10.04.2017, 06:23	17
	Сообщение от 8Observer8 Пока что не знаю. Это первая тень. Терминологию взял из учебника: Это так называемая "buffer shadow" или "bitmap shadow" (возможно "карта теней" - корявый перевод). Главное достоинство - дешевизна расчета. В буфере хранится одно число на точку - расстояние от источника до препятствия (бросившего тень). Отсюда следует что тень может существовать в ограниченном угле (пирамиде) и не может иметь разных цветов (ответ на мой вопрос), поскольку буфер может только сказать "в тени или нет". Правда есть еще расстояние до препятствия которое можно обыграть 1