2023-07-31
This commit is contained in:
parent
09b0d8c349
commit
41e768b9ac
20 changed files with 93 additions and 98 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
@ -2,4 +2,4 @@
|
|||
*.iml
|
||||
*.zip
|
||||
_site*
|
||||
.repo_*.sh
|
||||
.repo_*
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
## Дерево каталогов
|
||||
|
||||
<pre>
|
||||
.
|
||||
<a href='.'>.</a>
|
||||
├─ <a href='jekyll_site'>jekyll_site</a>
|
||||
│ ├─ <a href='jekyll_site/_includes'>_includes</a>
|
||||
│ │ ├─ <a href='jekyll_site/_includes/classes-point-cube-en.md'>classes-point-cube-en.md</a>
|
||||
|
@ -10,19 +10,13 @@
|
|||
│ │ ├─ <a href='jekyll_site/_includes/counters_head.html'>counters_head.html</a>
|
||||
│ │ ├─ <a href='jekyll_site/_includes/volumetric-tetris-en.html'>volumetric-tetris-en.html</a>
|
||||
│ │ └─ <a href='jekyll_site/_includes/volumetric-tetris-ru.html'>volumetric-tetris-ru.html</a>
|
||||
│ ├─ <a href='jekyll_site/css'>css</a>
|
||||
│ │ └─ <a href='jekyll_site/css/pomodoro1.css'>pomodoro1.css</a>
|
||||
│ ├─ <a href='jekyll_site/css'>css</a>/<a href='jekyll_site/css/pomodoro1.css'>pomodoro1.css</a>
|
||||
│ ├─ <a href='jekyll_site/en'>en</a>
|
||||
│ │ ├─ <a href='jekyll_site/en/2023'>2023</a>
|
||||
│ │ │ └─ <a href='jekyll_site/en/2023/01'>01</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/en/2023/01/06'>06</a>
|
||||
│ │ │ │ └─ <a href='jekyll_site/en/2023/01/06/spinning-square-on-plane.md'>spinning-square-on-plane.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/en/2023/01/11'>11</a>
|
||||
│ │ │ │ └─ <a href='jekyll_site/en/2023/01/11/spinning-cube-in-space.md'>spinning-cube-in-space.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/en/2023/01/16'>16</a>
|
||||
│ │ │ │ └─ <a href='jekyll_site/en/2023/01/16/spinning-spatial-cross.md'>spinning-spatial-cross.md</a>
|
||||
│ │ │ └─ <a href='jekyll_site/en/2023/01/22'>22</a>
|
||||
│ │ │ └─ <a href='jekyll_site/en/2023/01/22/volumetric-tetris.md'>volumetric-tetris.md</a>
|
||||
│ │ ├─ <a href='jekyll_site/en/2023'>2023</a>/<a href='jekyll_site/en/2023/01'>01</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/en/2023/01/06'>06</a>/<a href='jekyll_site/en/2023/01/06/spinning-square-on-plane.md'>spinning-square-on-plane.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/en/2023/01/11'>11</a>/<a href='jekyll_site/en/2023/01/11/spinning-cube-in-space.md'>spinning-cube-in-space.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/en/2023/01/16'>16</a>/<a href='jekyll_site/en/2023/01/16/spinning-spatial-cross.md'>spinning-spatial-cross.md</a>
|
||||
│ │ │ └─ <a href='jekyll_site/en/2023/01/22'>22</a>/<a href='jekyll_site/en/2023/01/22/volumetric-tetris.md'>volumetric-tetris.md</a>
|
||||
│ │ └─ <a href='jekyll_site/en/index.md'>index.md</a>
|
||||
│ ├─ <a href='jekyll_site/img'>img</a>
|
||||
│ │ ├─ <a href='jekyll_site/img/central-projection.svg'>central-projection.svg</a>
|
||||
|
@ -46,28 +40,25 @@
|
|||
│ │ ├─ <a href='jekyll_site/js/tetris-model.js'>tetris-model.js</a>
|
||||
│ │ └─ <a href='jekyll_site/js/tetris-view.js'>tetris-view.js</a>
|
||||
│ ├─ <a href='jekyll_site/ru'>ru</a>
|
||||
│ │ ├─ <a href='jekyll_site/ru/2023'>2023</a>
|
||||
│ │ │ └─ <a href='jekyll_site/ru/2023/01'>01</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/ru/2023/01/05'>05</a>
|
||||
│ │ │ │ └─ <a href='jekyll_site/ru/2023/01/05/spinning-square-on-plane.md'>spinning-square-on-plane.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/ru/2023/01/10'>10</a>
|
||||
│ │ │ │ └─ <a href='jekyll_site/ru/2023/01/10/spinning-cube-in-space.md'>spinning-cube-in-space.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/ru/2023/01/15'>15</a>
|
||||
│ │ │ │ └─ <a href='jekyll_site/ru/2023/01/15/spinning-spatial-cross.md'>spinning-spatial-cross.md</a>
|
||||
│ │ │ └─ <a href='jekyll_site/ru/2023/01/21'>21</a>
|
||||
│ │ │ └─ <a href='jekyll_site/ru/2023/01/21/volumetric-tetris.md'>volumetric-tetris.md</a>
|
||||
│ │ ├─ <a href='jekyll_site/ru/2023'>2023</a>/<a href='jekyll_site/ru/2023/01'>01</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/ru/2023/01/05'>05</a>/<a href='jekyll_site/ru/2023/01/05/spinning-square-on-plane.md'>spinning-square-on-plane.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/ru/2023/01/10'>10</a>/<a href='jekyll_site/ru/2023/01/10/spinning-cube-in-space.md'>spinning-cube-in-space.md</a>
|
||||
│ │ │ ├─ <a href='jekyll_site/ru/2023/01/15'>15</a>/<a href='jekyll_site/ru/2023/01/15/spinning-spatial-cross.md'>spinning-spatial-cross.md</a>
|
||||
│ │ │ └─ <a href='jekyll_site/ru/2023/01/21'>21</a>/<a href='jekyll_site/ru/2023/01/21/volumetric-tetris.md'>volumetric-tetris.md</a>
|
||||
│ │ └─ <a href='jekyll_site/ru/index.md'>index.md</a>
|
||||
│ ├─ <a href='jekyll_site/Gemfile_color'>Gemfile_color</a>
|
||||
│ ├─ <a href='jekyll_site/Gemfile_older'>Gemfile_older</a>
|
||||
│ ├─ <a href='jekyll_site/_config_color.yml'>_config_color.yml</a>
|
||||
│ ├─ <a href='jekyll_site/_config_older.yml'>_config_older.yml</a>
|
||||
│ └─ <a href='jekyll_site/robots.txt'>robots.txt</a>
|
||||
├─ <a href='.gitattributes'>.gitattributes</a>
|
||||
├─ <a href='.gitignore'>.gitignore</a>
|
||||
├─ <a href='CONTRIBUTING.md'>CONTRIBUTING.md</a>
|
||||
├─ <a href='DIRECTORY-TREE.md'>DIRECTORY-TREE.md</a>
|
||||
├─ <a href='DIRECTORY_TREE.md'>DIRECTORY_TREE.md</a>
|
||||
├─ <a href='LICENSE.md'>LICENSE.md</a>
|
||||
├─ <a href='OPEN_LICENSE.txt'>OPEN_LICENSE.txt</a>
|
||||
├─ <a href='README.en.md'>README.en.md</a>
|
||||
├─ <a href='README.md'>README.md</a>
|
||||
├─ <a href='WIKI.md'>WIKI.md</a>
|
||||
├─ <a href='build.sh'>build.sh</a>
|
||||
├─ <a href='package.sh'>package.sh</a>
|
||||
└─ <a href='serve.sh'>serve.sh</a>
|
16
README.en.md
16
README.en.md
|
@ -1,16 +0,0 @@
|
|||
## Website pages
|
||||
|
||||
- [Volumetric tetris](https://pomodoro1.mircloud.ru/en/2023/01/22/volumetric-tetris.html) — 22.01.2023.
|
||||
- [Spinning spatial cross](https://pomodoro1.mircloud.ru/en/2023/01/16/spinning-spatial-cross.html) — 16.01.2023.
|
||||
- [Spinning cube in space](https://pomodoro1.mircloud.ru/en/2023/01/11/spinning-cube-in-space.html) — 11.01.2023.
|
||||
- [Spinning square on plane](https://pomodoro1.mircloud.ru/en/2023/01/06/spinning-square-on-plane.html) — 06.01.2023.
|
||||
|
||||
## [Source texts](README.md)
|
||||
|
||||
- Series of the static websites [«Pomodori»](https://hub.mos.ru/golovin.gg/pomodoro/blob/master/README.en.md).
|
||||
- Used formats — Markdown, Liquid, YAML.
|
||||
- Build tool — Jekyll with tomato design themes.
|
||||
- Automation of processes — Bash scripts for command line.
|
||||
- [build.sh](build.sh) — Building a site in two tomato themes and optimizing the results.
|
||||
- [serve.sh](serve.sh) — Local deployment to verify the correctness of the build.
|
||||
- [package.sh](package.sh) — Preparing an archive for subsequent deployment.
|
15
README.md
15
README.md
|
@ -1,16 +1,5 @@
|
|||
## Страницы вёб-сайта
|
||||
## Исходные тексты
|
||||
|
||||
- [Объёмный тетрис](https://pomodoro1.mircloud.ru/ru/2023/01/21/volumetric-tetris.html) — 21.01.2023.
|
||||
- [Вращаем пространственный крест](https://pomodoro1.mircloud.ru/ru/2023/01/15/spinning-spatial-cross.html) — 15.01.2023.
|
||||
- [Вращаем куб в пространстве](https://pomodoro1.mircloud.ru/ru/2023/01/10/spinning-cube-in-space.html) — 10.01.2023.
|
||||
- [Вращаем квадрат на плоскости](https://pomodoro1.mircloud.ru/ru/2023/01/05/spinning-square-on-plane.html) — 05.01.2023.
|
||||
|
||||
## [Исходные тексты](README.en.md)
|
||||
|
||||
- Серия статических вёб-сайтов [«Помидоры»](https://hub.mos.ru/golovin.gg/pomodoro/blob/master/README.md).
|
||||
- Используемые форматы — Markdown, Liquid, YAML.
|
||||
- Инструмент сборки — Jekyll с помидорными темами оформления.
|
||||
- Автоматизация процессов — Bash скрипты для командной строки.
|
||||
- [build.sh](build.sh) — Сборка сайта в двух помидорных темах и оптимизация результатов.
|
||||
- [serve.sh](serve.sh) — Локальное развёртывание для проверки корректности сборки.
|
||||
- [package.sh](package.sh) — Подготовка архива для последующего развёртывания.
|
||||
- Управление процессами — Bash скрипты.
|
||||
|
|
29
WIKI.md
Normal file
29
WIKI.md
Normal file
|
@ -0,0 +1,29 @@
|
|||
<hr>
|
||||
|
||||
<details open>
|
||||
<summary><h3>Оглавление</h3></summary>
|
||||
|
||||
<hr>
|
||||
|
||||
- [Объёмный тетрис](https://pomodoro1.mircloud.ru/ru/2023/01/21/volumetric-tetris.html) — 21.01.2023.
|
||||
- [Вращаем пространственный крест](https://pomodoro1.mircloud.ru/ru/2023/01/15/spinning-spatial-cross.html) — 15.01.2023.
|
||||
- [Вращаем куб в пространстве](https://pomodoro1.mircloud.ru/ru/2023/01/10/spinning-cube-in-space.html) — 10.01.2023.
|
||||
- [Вращаем квадрат на плоскости](https://pomodoro1.mircloud.ru/ru/2023/01/05/spinning-square-on-plane.html) — 05.01.2023.
|
||||
|
||||
</details>
|
||||
|
||||
<hr>
|
||||
|
||||
<details open>
|
||||
<summary><h3>Contents</h3></summary>
|
||||
|
||||
<hr>
|
||||
|
||||
- [Volumetric tetris](https://pomodoro1.mircloud.ru/en/2023/01/22/volumetric-tetris.html) — 22.01.2023.
|
||||
- [Spinning spatial cross](https://pomodoro1.mircloud.ru/en/2023/01/16/spinning-spatial-cross.html) — 16.01.2023.
|
||||
- [Spinning cube in space](https://pomodoro1.mircloud.ru/en/2023/01/11/spinning-cube-in-space.html) — 11.01.2023.
|
||||
- [Spinning square on plane](https://pomodoro1.mircloud.ru/en/2023/01/06/spinning-square-on-plane.html) — 06.01.2023.
|
||||
|
||||
</details>
|
||||
|
||||
<hr>
|
|
@ -1,10 +1,10 @@
|
|||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-209134013-1"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-1L7J3YNRZ7"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'UA-209134013-1');
|
||||
gtag('config', 'G-1L7J3YNRZ7');
|
||||
</script>
|
||||
<!-- Yandex.Metrika counter -->
|
||||
<script>
|
||||
|
|
|
@ -60,7 +60,7 @@ let t0 = {x:150, y:150};
|
|||
let deg = 1;
|
||||
```
|
||||
```js
|
||||
// figure rotation and image update
|
||||
// figure rotation and image refresh
|
||||
function repaint() {
|
||||
// rotate the original array of points by an angle
|
||||
for (let i = 0; i < square.length; i++)
|
||||
|
@ -103,7 +103,7 @@ function drawFigure(canvas, arr) {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// after loading the page, set the image refresh interval
|
||||
// after loading the page, set the image refresh rate at 20 Hz
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
```
|
||||
|
||||
|
@ -139,7 +139,7 @@ let square2 = [];
|
|||
let t2 = {x:100, y:100};
|
||||
```
|
||||
```js
|
||||
// figure rotation and image update
|
||||
// figure rotation and image refresh
|
||||
function repaint2() {
|
||||
// rotate the point in the opposite direction
|
||||
t2 = rotateOnDegree(t0, t2, -deg);
|
||||
|
@ -156,6 +156,6 @@ function repaint2() {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// after loading the page, set the image refresh interval
|
||||
// after loading the page, set the image refresh rate at 20 Hz
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint2,50));
|
||||
```
|
||||
|
|
|
@ -12,12 +12,12 @@ date: 2023.01.11
|
|||
lang: en
|
||||
---
|
||||
|
||||
We consider the difference between parallel and perspective projection.
|
||||
Both are widely used in practice for various purposes. In the previous example, we
|
||||
We consider the difference between parallel and perspective projection. Both
|
||||
are widely used in practice for various purposes. In the previous example, we
|
||||
[rotated square on plane]({{ '/en/2023/01/06/spinning-square-on-plane.html' | relative_url }})
|
||||
— we pass into three-dimensional space. Now, to display the rotation of a three-dimensional object
|
||||
on the screen plane, we first need to create a three-dimensional object, rotate it by an angle,
|
||||
draw a projection from it and display already the projection on the screen.
|
||||
on the screen plane, we first need to create a *mathematical model* of a three-dimensional object,
|
||||
rotate it by an angle, draw a projection from it and display already the projection on the screen.
|
||||
|
||||
Complicated model, many cubes: [Spinning spatial cross]({{ '/en/2023/01/16/spinning-spatial-cross.html' | relative_url }}).
|
||||
|
||||
|
@ -184,7 +184,7 @@ const tv = new Point(150,150,80);
|
|||
const deg = {x:0,y:1,z:0};
|
||||
```
|
||||
```js
|
||||
// figure rotation and image update
|
||||
// figure rotation and image refresh
|
||||
function repaint() {
|
||||
cube.rotate(deg, t0);
|
||||
// draw parallel projection
|
||||
|
@ -224,6 +224,6 @@ function drawFigure(canvas, proj) {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// after loading the page, set the image refresh interval
|
||||
// after loading the page, set the image refresh rate at 20 Hz
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
```
|
||||
|
|
|
@ -270,6 +270,6 @@ function drawFigure(canvas, proj, alpha=0.8) {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// after loading the page, set the image refresh interval
|
||||
// after loading the page, set the image refresh rate at 20 Hz
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
```
|
||||
|
|
|
@ -20,18 +20,19 @@ is two-dimensional.
|
|||
{%- 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 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.
|
||||
{%- endcapture %}
|
||||
{%- assign articles = articles | push: article_brief %}
|
||||
{%- assign articles = articles | push: "Spinning cube in space" %}
|
||||
{%- capture article_brief %}
|
||||
We consider the difference between parallel and perspective projection. Both are widely used in practice for various
|
||||
purposes. In the previous example, we rotated square on plane — we pass into three-dimensional space. Now, to display
|
||||
the rotation of a three-dimensional object on the screen plane, we first need to create a three-dimensional object,
|
||||
rotate it by an angle, draw a projection from it and display already the projection on the screen.
|
||||
We consider the difference between parallel and perspective projection. Both are widely used in practice
|
||||
for various purposes. In the previous example, we rotated square on plane — we pass into three-dimensional
|
||||
space. Now, to display the rotation of a three-dimensional object on the screen plane, we first need to
|
||||
create a *mathematical model* of a three-dimensional object, rotate it by an angle, draw a projection from
|
||||
it and display already the projection on the screen.
|
||||
{%- endcapture %}
|
||||
{%- assign articles = articles | push: article_brief %}
|
||||
{%- assign articles = articles | push: "Spinning square on plane" %}
|
||||
|
|
|
@ -53,5 +53,5 @@ function drawFigure(canvas, proj) {
|
|||
}
|
||||
}
|
||||
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
|
|
|
@ -51,5 +51,5 @@ function centerPoint(canvas) {
|
|||
context.arc(tv3.x, tv3.y, 5.5, 0, 2*Math.PI);
|
||||
context.stroke();
|
||||
}
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint3,50));
|
||||
|
|
|
@ -112,5 +112,5 @@ function drawFigure(canvas, proj, alpha=0.8) {
|
|||
}
|
||||
}
|
||||
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
|
|
|
@ -92,5 +92,5 @@ function centerPoint(canvas) {
|
|||
context.arc(tv5.x, tv5.y, 6.5, 0, 2*Math.PI);
|
||||
context.stroke();
|
||||
}
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint5,50));
|
||||
|
|
|
@ -48,5 +48,5 @@ function drawFigure(canvas, arr) {
|
|||
context.stroke();
|
||||
}
|
||||
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
|
|
|
@ -22,5 +22,5 @@ function repaint2() {
|
|||
drawFigure(canvas2, square2);
|
||||
}
|
||||
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint2,50));
|
||||
|
|
|
@ -102,7 +102,7 @@ function drawFigure(canvas, arr) {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
```
|
||||
|
||||
|
@ -155,6 +155,6 @@ function repaint2() {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint2,50));
|
||||
```
|
||||
|
|
|
@ -11,12 +11,12 @@ title_translated: Spinning cube in space
|
|||
date: 2023.01.10
|
||||
---
|
||||
|
||||
Рассматриваем разницу между параллельной и перспективной проекцией.
|
||||
Обе широко используются на практике для различных целей. В предыдущем примере мы
|
||||
Рассматриваем разницу между параллельной и перспективной проекцией. Обе
|
||||
широко используются на практике для различных целей. В предыдущем примере мы
|
||||
[вращали квадрат на плоскости]({{ '/ru/2023/01/05/spinning-square-on-plane.html' | relative_url }})
|
||||
— переходим в трёхмерное пространство. Теперь, чтобы отобразить на плоскости экрана поворот трёхмерного
|
||||
объекта, нужно сначала создать трёхмерный объект, повернуть его на угол, срисовать с него проекцию и
|
||||
отобразить на экране уже проекцию.
|
||||
объекта, нужно сначала создать *математическую модель* трёхмерного объекта, повернуть её на угол, срисовать
|
||||
с неё проекцию и отобразить на экране уже проекцию.
|
||||
|
||||
Усложнённая модель, много кубиков: [Вращаем пространственный крест]({{ '/ru/2023/01/15/spinning-spatial-cross.html' | relative_url }}).
|
||||
|
||||
|
@ -221,6 +221,6 @@ function drawFigure(canvas, proj) {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
```
|
||||
|
|
|
@ -266,6 +266,6 @@ function drawFigure(canvas, proj, alpha=0.8) {
|
|||
}
|
||||
```
|
||||
```js
|
||||
// после загрузки страницы, задаём интервал обновления изображения
|
||||
// после загрузки страницы, задаём частоту обновления изображения 20 Гц
|
||||
document.addEventListener('DOMContentLoaded',()=>setInterval(repaint,50));
|
||||
```
|
||||
|
|
|
@ -18,18 +18,19 @@ title_translated: Code with comments
|
|||
{%- 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 %}
|
||||
Рассматриваем разницу между параллельной и перспективной проекцией. Обе широко используются на практике для
|
||||
различных целей. В предыдущем примере мы вращали квадрат на плоскости — переходим в трёхмерное пространство.
|
||||
Теперь, чтобы отобразить на плоскости экрана поворот трёхмерного объекта, нужно сначала создать трёхмерный
|
||||
объект, повернуть его на угол, срисовать с него проекцию и отобразить на экране уже проекцию.
|
||||
Рассматриваем разницу между параллельной и перспективной проекцией. Обе широко используются на практике
|
||||
для различных целей. В предыдущем примере мы вращали квадрат на плоскости — переходим в трёхмерное
|
||||
пространство. Теперь, чтобы отобразить на плоскости экрана поворот трёхмерного объекта, нужно сначала
|
||||
создать *математическую модель* трёхмерного объекта, повернуть её на угол, срисовать с неё проекцию и
|
||||
отобразить на экране уже проекцию.
|
||||
{%- endcapture %}
|
||||
{%- assign articles = articles | push: article_brief %}
|
||||
{%- assign articles = articles | push: "Вращаем квадрат на плоскости" %}
|
||||
|
|
Loading…
Add table
Reference in a new issue