2023-10-31

This commit is contained in:
Gennadiy 2023-12-17 09:39:19 +03:00
parent fb49164b15
commit f2e0e0f461
12 changed files with 90 additions and 86 deletions

View file

@ -17,12 +17,12 @@
<div style="display: flex; flex-direction: row; align-items: start; flex-wrap: wrap;">
<div style="padding: 0 8px 8px 0;">
<canvas id="container">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
<div style="padding: 0 8px 8px 0;">
<canvas id="next">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column; align-items: start;">

View file

@ -17,12 +17,12 @@
<div style="display: flex; flex-direction: row; align-items: start; flex-wrap: wrap;">
<div style="padding: 0 8px 8px 0;">
<canvas id="container">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
<div style="padding: 0 8px 8px 0;">
<canvas id="next">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column; align-items: start;">

View file

@ -35,7 +35,7 @@ with lines and draw lines on the canvas. We renew the image at a frequency of 20
<div>
<canvas id="canvas" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
@ -43,7 +43,7 @@ with lines and draw lines on the canvas. We renew the image at a frequency of 20
```html
<canvas id="canvas" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
```
@ -116,7 +116,7 @@ central point — counterclockwise. This code works in conjunction with the prev
<div>
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
@ -124,7 +124,7 @@ central point — counterclockwise. This code works in conjunction with the prev
```html
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
```

View file

@ -25,13 +25,13 @@ Complicated model, many cubes: [Spinning spatial cross]({{ '/en/2023/01/16/spinn
<div style="display: flex; flex-direction: column; padding-right: 8px;">
<span>Parallel projection</span>
<canvas id="canvas1" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column;">
<span>Perspective projection</span>
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
</div>
@ -53,7 +53,7 @@ center onto the observer screen.
<div>
<canvas id="canvas3" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
<form>

View file

@ -1,6 +1,6 @@
---
title: Spinning spatial cross
description: We are writing an algorithm for rotating a three-dimensional figure by an angle around its center along all three axes at once. In the previous example...
description: We are writing an algorithm for rotating a three-dimensional figure around its center along all three axes at once. In the previous example, we rotated cube...
sections: [Volumetric figures,Rotation matrix,Experimental model]
tags: [javascript,online,canvas,geometry,matrix,graphics,image,picture,square,cube]
scripts: [/js/classes-point-cube.js,/js/spinning-spatial-cross.js,/js/spinning-spatial-cross2.js]
@ -12,12 +12,12 @@ date: 2023.01.16
lang: en
---
We are writing an algorithm for rotating a three-dimensional figure by an angle
around its center along all three axes at once. In the previous example, we
We are writing an algorithm for rotating a three-dimensional figure around
its center along all three axes at once. In the previous example, we
[rotated cube in space]({{ '/en/2023/01/11/spinning-cube-in-space.html' | relative_url }})
now there are a lot of cubes, the algorithm is almost the same and we use the same formulas.
We draw two variants of the figure: *spatial cross* and *cross-cube* in two types of projections,
consider the difference.
in this example, there are a lot of cubes, the algorithm will be almost the same, and we will use
the same formulas. For clarity, let's take two variants of a symmetrical volumetric figure in two
types of projections *spatial cross* and *cross-cube* we consider the difference between them.
Testing the experimental interface: [Volumetric tetris]({{ '/en/2023/01/22/volumetric-tetris.html' | relative_url }}).
@ -27,13 +27,13 @@ Testing the experimental interface: [Volumetric tetris]({{ '/en/2023/01/22/volum
<div style="display: flex; flex-direction: column; padding-right: 8px;">
<span>Parallel projection</span>
<canvas id="canvas1" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column;">
<span>Perspective projection</span>
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
</div>
@ -44,13 +44,13 @@ Testing the experimental interface: [Volumetric tetris]({{ '/en/2023/01/22/volum
<div style="display: flex; flex-direction: column; padding-right: 8px;">
<span>Parallel projection</span>
<canvas id="canvas3" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column;">
<span>Perspective projection</span>
<canvas id="canvas4" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
</div>
@ -67,7 +67,7 @@ direction — *linear perspective* or *reverse perspective* and transparency of
<div>
<canvas id="canvas5" width="300" height="300" style="border: 1px solid gray;">
<p>Your browser does not support Canvas</p>
<p>Canvas for displaying computations results</p>
</canvas>
</div>
<div>

View file

@ -1,8 +1,8 @@
---
title: Volumetric tetris
description: General educational game in the broad meaning of this word. When learning programming languages, it is recommended to write your own version first and then...
description: General educational game in the broad meaning of this word. In the process of learning programming languages, it is recommended to write your own version...
sections: [Logical game,Experimental interface]
tags: [javascript,online,canvas,game,puzzle,geometry,matrix,graphics,square,cube,3d,three-dimensional]
tags: [javascript,online,canvas,game,classic,puzzle,geometry,matrix,graphics,square,cube,3d,three-dimensional]
scripts: [/js/classes-point-cube.js,/js/tetris-figures.js,/js/tetris-model.js,/js/tetris-controller.js,/js/tetris-view.js]
styles: [/css/pomodoro1.css]
canonical_url: /en/2023/01/22/volumetric-tetris.html
@ -12,17 +12,17 @@ date: 2023.01.22
lang: en
---
General educational game in the broad meaning of this word. When learning programming languages, it is
recommended to write your own version first and then use it to demonstrate and test other software or
hardware. The three-dimensional interface is written in JavaScript Canvas the logic of the game itself
is two-dimensional.
General educational game in the broad meaning of this word. In the process of learning programming languages,
it is recommended to write your own version first and then use it for demonstrating and testing another
software or hardware. The three-dimensional interface is written in JavaScript Canvas the logic of the
game itself is two-dimensional.
Description of graphics algorithm: [Spinning cube in space]({{ '/en/2023/01/11/spinning-cube-in-space.html' | relative_url }}).
{% include heading.html text="Experimental interface" hash="experimental-interface" %}
Turned off by default you can just play Tetris. In addition to the flat version, two volumetric variants
are added: *parallel projection* and *perspective projection* parameters for each of them can be changed.
Turned off by default you can just play Tetris. In addition to the two-dimensional version, two volumetric variants
are added *parallel projection* and *perspective projection* parameters for each of them can be changed.
For perspective projection: you can change the position of the observer screen and the remoteness of the
projection source. The observer looks at the center of the image, and the center of the projection is remote
at a distance, comparable to the size of the playing field. For parallel projection: you can change the
@ -31,22 +31,22 @@ point for rotations — is the central lower far point of the field. For all var
of the cube 32, the size of the square 30 and the indent 2. The origin of coordinates is located at
the upper left point, the axes are directed: `X` to the right, `Y` downwards and `Z` to the distance.
*Usage example:* start the game, collect a certain number of figures on the field, then pause the game,
and switch between the variants of the three-dimensional image, rotate the field with figures, change
the settings and so on.
<b>Testing:</b> start the game, collect a certain number of figures on the field, pause the game, and
then switch the variants of the three-dimensional image, rotate the field with figures, change the
transparency, move the central point and so on.
<b>Controls:</b> keyboard buttons with arrows right, left, up, down and the button `pause`.
{% include volumetric-tetris-en.html -%}
{% include heading.html text="Gaming process" hash="gaming-process" %}
Controls: keyboard buttons with arrows right, left, up, down and the button `pause`.
Game points are awarded for fully collected rows of the elements of the figures. The number of points scored
depends on the number of rows collected, 10 points for each row if there are 10 cubes in a row, and multiply
increases, if collected at the same time: 2 lines by 3 times, 3 lines by 5 times, 4 lines by 10 times.
Game feature: the collected lines first blink and then disappear, while the gaming process is not suspended
for this time the current figure continues to fall.
<b>Game feature:</b> the collected lines first blink and then disappear, while the
gaming process is not suspended for this time the current figure continues to fall.
Level increases when collecting 10 completed rows, that is 100 points, if there are 10 cubes in a row. At each
new level, the speed of the figures increases and reaches its maximum at level 21. In snail mode, the speed

View file

@ -12,18 +12,19 @@ lang: en
{%- assign articles = "" | split: "" %}
{%- assign articles = articles | push: "Volumetric tetris" %}
{%- capture article_brief %}
General educational game in the broad meaning of this word. When learning programming languages, it is
recommended to write your own version first and then use it to demonstrate and test other software or
hardware. The three-dimensional interface is written in JavaScript Canvas the logic of the game itself
is two-dimensional.
General educational game in the broad meaning of this word. In the process of learning programming languages,
it is recommended to write your own version first and then use it for demonstrating and testing another
software or hardware. The three-dimensional interface is written in JavaScript Canvas the logic of the
game itself is two-dimensional.
{%- endcapture %}
{%- assign articles = articles | push: article_brief %}
{%- assign articles = articles | push: "Spinning spatial cross" %}
{%- capture article_brief %}
We are writing an algorithm for rotating a three-dimensional figure by an angle around its center along
all three axes at once. In the previous example, we rotated cube in space now there are a lot of cubes,
the algorithm is almost the same and we use the same formulas. We draw two variants of the figure:
*spatial cross* and *cross-cube* in two types of projections, consider the difference.
We are writing an algorithm for rotating a three-dimensional figure around its center along all three axes
at once. In the previous example, we rotated cube in space in this example, there are a lot of cubes, the
algorithm will be almost the same, and we will use the same formulas. For clarity, let's take two variants
of a symmetrical volumetric figure in two types of projections *spatial cross* and *cross-cube* we
consider the difference between them.
{%- endcapture %}
{%- assign articles = articles | push: article_brief %}
{%- assign articles = articles | push: "Spinning cube in space" %}

View file

@ -34,7 +34,7 @@ alt="&x'=x_0+(x-x_0)cos\varphi-(y-y_0)sin\varphi,&\\&y'=y_0+(x-x_0)sin\varphi+(y
<div>
<canvas id="canvas" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
@ -42,7 +42,7 @@ alt="&x'=x_0+(x-x_0)cos\varphi-(y-y_0)sin\varphi,&\\&y'=y_0+(x-x_0)sin\varphi+(y
```html
<canvas id="canvas" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
```
@ -115,7 +115,7 @@ document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
<div>
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
@ -123,7 +123,7 @@ document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
```html
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
```

View file

@ -1,6 +1,6 @@
---
title: Вращаем куб в пространстве
description: Рассматриваем разницу между параллельной и перспективной проекцией. Обе широко используются на практике для различных целей. В предыдущем примере мы вращали...
description: Рассмотрим разницу между параллельной и перспективной проекцией. Обе широко используются на практике для различных целей. В предыдущем примере мы вращали...
sections: [Линейная перспектива,Матрица поворота,Экспериментальная модель]
tags: [javascript,онлайн,canvas,геометрия,графика,изображение,картинка,квадрат,куб]
scripts: [/js/classes-point-cube.js,/js/spinning-cube.js,/js/spinning-cube2.js]
@ -11,8 +11,8 @@ title_translated: Spinning cube in space
date: 2023.01.10
---
Рассматриваем разницу между параллельной и перспективной проекцией. Обе
широко используются на практике для различных целей. В предыдущем примере мы
Рассмотрим разницу между параллельной и перспективной проекцией. Обе широко
используются на практике для различных целей. В предыдущем примере мы
[вращали квадрат на плоскости]({{ '/ru/2023/01/05/spinning-square-on-plane.html' | relative_url }})
переходим в трёхмерное пространство. Теперь, чтобы отобразить на плоскости экрана поворот трёхмерного
объекта, нужно сначала создать *математическую модель* трёхмерного объекта, повернуть её на угол, срисовать
@ -24,13 +24,13 @@ date: 2023.01.10
<div style="display: flex; flex-direction: column; padding-right: 8px;">
<span>Параллельная проекция</span>
<canvas id="canvas1" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column;">
<span>Перспективная проекция</span>
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
</div>
@ -51,7 +51,7 @@ date: 2023.01.10
<div>
<canvas id="canvas3" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
<form>

View file

@ -1,6 +1,6 @@
---
title: Вращаем пространственный крест
description: Пишем алгоритм для поворота объёмной фигуры на угол вокруг своего центра по всем трём осям сразу. В предыдущем примере мы вращали куб в пространстве...
description: Пишем алгоритм для поворота объёмной фигуры вокруг своего центра по всем трём осям сразу. В предыдущем примере мы вращали куб в пространстве в этом...
sections: [Объёмные фигуры,Матрица поворота,Экспериментальная модель]
tags: [javascript,онлайн,canvas,геометрия,матрица,графика,изображение,картинка,квадрат,куб]
scripts: [/js/classes-point-cube.js,/js/spinning-spatial-cross.js,/js/spinning-spatial-cross2.js]
@ -11,10 +11,11 @@ title_translated: Spinning spatial cross
date: 2023.01.15
---
Пишем алгоритм для поворота объёмной фигуры на угол вокруг своего центра по всем трём осям сразу. В предыдущем
Пишем алгоритм для поворота объёмной фигуры вокруг своего центра по всем трём осям сразу. В предыдущем
примере мы [вращали куб в пространстве]({{ '/ru/2023/01/10/spinning-cube-in-space.html' | relative_url }})
теперь кубиков будет много, алгоритм будет почти такой же и формулы будем использовать те же. Рисуем два
варианта фигуры: *пространственный крест* и *крест-куб* в двух типах проекций, рассматриваем разницу.
в этом примере кубиков будет много, алгоритм будет почти такой же, и формулы будем использовать те же. Для
наглядности возьмём два варианта симметричной объёмной фигуры в двух типах проекций *пространственный крест*
и *крест-куб* рассматриваем разницу между ними.
Тестирование экспериментального интерфейса: [Объёмный тетрис]({{ '/ru/2023/01/21/volumetric-tetris.html' | relative_url }}).
@ -24,13 +25,13 @@ date: 2023.01.15
<div style="display: flex; flex-direction: column; padding-right: 8px;">
<span>Параллельная проекция</span>
<canvas id="canvas1" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column;">
<span>Перспективная проекция</span>
<canvas id="canvas2" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
</div>
@ -41,13 +42,13 @@ date: 2023.01.15
<div style="display: flex; flex-direction: column; padding-right: 8px;">
<span>Параллельная проекция</span>
<canvas id="canvas3" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
<div style="display: flex; flex-direction: column;">
<span>Перспективная проекция</span>
<canvas id="canvas4" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
</div>
@ -64,7 +65,7 @@ date: 2023.01.15
<div>
<canvas id="canvas5" width="300" height="300" style="border: 1px solid gray;">
<p>Ваш браузер не поддерживает Canvas</p>
<p>Холст для отображения результатов вычислений</p>
</canvas>
</div>
<div>

View file

@ -1,8 +1,8 @@
---
title: Объёмный тетрис
description: Общеобразовательная игра в широком смысле этого слова. При изучении языков программирования рекомендуется сначала написать свою версию и потом использовать...
description: Общеобразовательная игра в широком смысле этого слова. В процессе изучения языков программирования рекомендуется сначала написать свою версию и потом...
sections: [Логическая игра,Экспериментальный интерфейс]
tags: [javascript,онлайн,canvas,игра,головоломка,геометрия,матрица,графика,квадрат,куб,3d,трёхмерный]
tags: [javascript,онлайн,canvas,игра,классика,головоломка,геометрия,матрица,графика,квадрат,куб,3д,трёхмерный]
scripts: [/js/classes-point-cube.js,/js/tetris-figures.js,/js/tetris-model.js,/js/tetris-controller.js,/js/tetris-view.js]
styles: [/css/pomodoro1.css]
canonical_url: /ru/2023/01/21/volumetric-tetris.html
@ -11,16 +11,17 @@ title_translated: Volumetric tetris
date: 2023.01.21
---
Общеобразовательная игра в широком смысле этого слова. При изучении языков программирования рекомендуется
сначала написать свою версию и потом использовать её для демонстрации и тестирования другого программного
обеспечения или оборудования. Трёхмерный интерфейс написан на JavaScript Canvas логика самой игры двухмерная.
Общеобразовательная игра в широком смысле этого слова. В процессе изучения языков программирования
рекомендуется сначала написать свою версию и потом использовать её для демонстрации и тестирования
другого программного обеспечения или оборудования. Трёхмерный интерфейс написан на JavaScript Canvas
логика самой игры двухмерная.
Описание алгоритма графики: [Вращаем куб в пространстве]({{ '/ru/2023/01/10/spinning-cube-in-space.html' | relative_url }}).
{% include heading.html text="Экспериментальный интерфейс" hash="experimental-interface" %}
По умолчанию выключен можно просто играть в тетрис. В дополнение к плоской версии добавлены два объёмных
варианта: *параллельная проекция* и *перспективная проекция* параметры для каждого из них можно изменять.
По умолчанию выключен можно просто играть в тетрис. В дополнение к двухмерной версии добавлены два объёмных
варианта *параллельная проекция* и *перспективная проекция* параметры для каждого из них можно изменять.
Для перспективной проекции: можно изменять положение экрана наблюдателя и удалённость источника проекции.
Наблюдатель смотрит в центр изображения, а центр проекции удалён на расстояние, сопоставимое с размерами
игрового поля. Для параллельной проекции: можно изменять вертикальное положение. Для обеих проекций: можно
@ -28,22 +29,22 @@ date: 2023.01.21
точка поля. Для всех вариантов изображения: размер кубика 32, размер квадратика 30 и отступ 2.
Начало координат расположено в верхней левой точке, оси направлены: `X` вправо, `Y` вниз и `Z` вдаль.
*Пример использования:* начинаем игру, набираем какое-то количество фигур на поле, затем ставим игру на
паузу, и переключаемся между вариантами объёмного изображения, поворачиваем поле с фигурами, изменяем
настройки и так далее.
<b>Тестирование:</b> начинаем игру, набираем некоторое количество фигур на поле, ставим игру на паузу,
а затем переключаем варианты объёмного изображения, поворачиваем поле с фигурами, изменяем прозрачность,
двигаем центральную точку и так далее.
<b>Управление:</b> кнопки на клавиатуре со стрелками вправо, влево, вверх, вниз и кнопка пауза `pause`.
{% include volumetric-tetris-ru.html -%}
{% include heading.html text="Игровой процесс" hash="gaming-process" %}
Управление: кнопки на клавиатуре со стрелками вправо, влево, вверх, вниз и кнопка пауза `pause`.
Игровые очки начисляются за полностью собранные строки из элементов фигур. Количество набранных очков зависит
от количества собранных строк, по 10 очков за каждую строку, если в строке 10 кубиков, и кратно увеличивается,
если одновременно собрано: 2 строки в 3 раза, 3 строки в 5 раз, 4 строки в 10 раз.
Особенность игры: собранные строки сначала моргают и после этого исчезают, при этом игровой процесс на это
время не приостанавливается текущая фигура продолжает падать.
<b>Особенность игры:</b> собранные строки сначала моргают и после этого исчезают, при
этом игровой процесс на это время не останавливается текущая фигура продолжает падать.
Уровень увеличивается при сборе 10 заполненных строк, то есть 100 очков, если в строке 10 кубиков. На каждом
новом уровне, скорость фигур повышается и на 21 уровне достигает максимума. В режиме улитки скорость повышается

View file

@ -11,22 +11,23 @@ title_translated: Code with comments
{%- assign articles = "" | split: "" %}
{%- assign articles = articles | push: "Объёмный тетрис" %}
{%- capture article_brief %}
Общеобразовательная игра в широком смысле этого слова. При изучении языков программирования рекомендуется
сначала написать свою версию и потом использовать её для демонстрации и тестирования другого программного
обеспечения или оборудования. Трёхмерный интерфейс написан на JavaScript Canvas логика самой игры двухмерная.
Общеобразовательная игра в широком смысле этого слова. В процессе изучения языков программирования
рекомендуется сначала написать свою версию и потом использовать её для демонстрации и тестирования
другого программного обеспечения или оборудования. Трёхмерный интерфейс написан на JavaScript Canvas
логика самой игры двухмерная.
{%- endcapture %}
{%- assign articles = articles | push: article_brief %}
{%- assign articles = articles | push: "Вращаем пространственный крест" %}
{%- capture article_brief %}
Пишем алгоритм для поворота объёмной фигуры на угол вокруг своего центра по всем трём осям сразу. В
предыдущем примере мы вращали куб в пространстве теперь кубиков будет много, алгоритм будет почти
такой же и формулы будем использовать те же. Рисуем два варианта фигуры: *пространственный крест* и
*крест-куб* в двух типах проекций, рассматриваем разницу.
Пишем алгоритм для поворота объёмной фигуры вокруг своего центра по всем трём осям сразу. В предыдущем
примере мы вращали куб в пространстве в этом примере кубиков будет много, алгоритм будет почти такой
же, и формулы будем использовать те же. Для наглядности возьмём два варианта симметричной объёмной фигуры
в двух типах проекций *пространственный крест* и *крест-куб* рассматриваем разницу между ними.
{%- endcapture %}
{%- assign articles = articles | push: article_brief %}
{%- assign articles = articles | push: "Вращаем куб в пространстве" %}
{%- capture article_brief %}
Рассматриваем разницу между параллельной и перспективной проекцией. Обе широко используются на практике
Рассмотрим разницу между параллельной и перспективной проекцией. Обе широко используются на практике
для различных целей. В предыдущем примере мы вращали квадрат на плоскости переходим в трёхмерное
пространство. Теперь, чтобы отобразить на плоскости экрана поворот трёхмерного объекта, нужно сначала
создать *математическую модель* трёхмерного объекта, повернуть её на угол, срисовать с неё проекцию и