diff options
author | Alexey Pyltsyn <lex61rus@gmail.com> | 2021-10-27 02:31:24 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-10-27 02:31:24 +0300 |
commit | 980fe00a74a9ad013b945755415ace2e5429c3c2 (patch) | |
tree | a1c6bb4b302e69bfa53eab13e44500eba55d1696 /files/ru/web/api/canvas_api/tutorial/transformations | |
parent | 374a039b97a11ee7306539d16aaab27fed66b398 (diff) | |
download | translated-content-980fe00a74a9ad013b945755415ace2e5429c3c2.tar.gz translated-content-980fe00a74a9ad013b945755415ace2e5429c3c2.tar.bz2 translated-content-980fe00a74a9ad013b945755415ace2e5429c3c2.zip |
[RU] Remove notranslate (#2874)
Diffstat (limited to 'files/ru/web/api/canvas_api/tutorial/transformations')
-rw-r--r-- | files/ru/web/api/canvas_api/tutorial/transformations/index.html | 40 |
1 files changed, 20 insertions, 20 deletions
diff --git a/files/ru/web/api/canvas_api/tutorial/transformations/index.html b/files/ru/web/api/canvas_api/tutorial/transformations/index.html index 5a557d2aed..a169bc0cf5 100644 --- a/files/ru/web/api/canvas_api/tutorial/transformations/index.html +++ b/files/ru/web/api/canvas_api/tutorial/transformations/index.html @@ -5,17 +5,17 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations --- <div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Using_images", "Web/API/Canvas_API/Tutorial/Compositing")}}</div> -<div class="summary"><span class="notranslate">Ранее в этом уроке мы узнали о</span> <span class="notranslate" style="background-color: #e6ecf9;"> <a href="https://translate.googleusercontent.com/translate_c?act=url&depth=1&hl=ru&ie=UTF8&prev=_t&rurl=translate.google.com&sl=en&sp=nmt4&tl=ru&u=https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes&usg=ALkJrhiuWce927wE2920fN95Jlcrf1HyUg">сетке холста</a></span> <span class="notranslate">и <strong>координатном пространстве</strong> .</span> <span class="notranslate"> До сих пор мы использовали только сетку по умолчанию и изменили размер всего холста для наших нужд.</span> При преобразованиях существуют более мощные способы изменения исходных координат в различные положение, поворот сетки и даже масштабирование.</div> +<div class="summary"><span>Ранее в этом уроке мы узнали о</span> <span style="background-color: #e6ecf9;"> <a href="https://translate.googleusercontent.com/translate_c?act=url&depth=1&hl=ru&ie=UTF8&prev=_t&rurl=translate.google.com&sl=en&sp=nmt4&tl=ru&u=https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes&usg=ALkJrhiuWce927wE2920fN95Jlcrf1HyUg">сетке холста</a></span> <span>и <strong>координатном пространстве</strong> .</span> <span> До сих пор мы использовали только сетку по умолчанию и изменили размер всего холста для наших нужд.</span> При преобразованиях существуют более мощные способы изменения исходных координат в различные положение, поворот сетки и даже масштабирование.</div> -<h2 id="Saving_and_restoring_state"><span class="notranslate" style="background-color: #e6ecf9;">Сохранение и восстановление состояния</span></h2> +<h2 id="Saving_and_restoring_state"><span style="background-color: #e6ecf9;">Сохранение и восстановление состояния</span></h2> -<p><span class="notranslate">Прежде чем перейти к методам преобразования, давайте рассмотрим два других метода, которые необходимы, когда вы начинаете создавать все более сложные рисунки.</span></p> +<p><span>Прежде чем перейти к методам преобразования, давайте рассмотрим два других метода, которые необходимы, когда вы начинаете создавать все более сложные рисунки.</span></p> <dl> <dt>{{domxref("CanvasRenderingContext2D.save", "save()")}}</dt> - <dd><span class="notranslate">Сохраняет все состояние холста.</span></dd> + <dd><span>Сохраняет все состояние холста.</span></dd> <dt>{{domxref("CanvasRenderingContext2D.restore", "restore()")}}</dt> - <dd><span class="notranslate">Восстанавливает последнее сохранённое состояние холста.</span></dd> + <dd><span>Восстанавливает последнее сохранённое состояние холста.</span></dd> </dl> <p>Состояние холста сохраняется в стеке. Каждый раз, когда вызывается метод <code>save()</code>, текущее состояние отрисовки записывается в стек. Состояние отрисовки содержит:</p> @@ -32,7 +32,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <p>Здесь показано, как функционирует сохранение в стек состояния отрисовки на примере последовательной отрисовки набора прямоугольников.</p> -<pre class="brush: js; highlight:[5,10,15,18] notranslate">function draw() { +<pre class="brush: js; highlight:[5,10,15,18]">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); ctx.fillRect(0, 0, 150, 150); // рисуем прямоугольник с настройками по умолчанию @@ -54,9 +54,9 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations }</pre> <div class="hidden"> -<pre class="brush: html notranslate"><canvas id="canvas" width="150" height="150"></canvas></pre> +<pre class="brush: html"><canvas id="canvas" width="150" height="150"></canvas></pre> -<pre class="brush: js notranslate">draw();</pre> +<pre class="brush: js">draw();</pre> </div> <p>Сначала рисуется большой прямоугольник с настройками по умолчанию. Затем мы сохраняем состояние холста, после чего изменяем цвет заливки. Затем рисуем второй синий прямоугольник меньшего размера и опять сохраняем состояние. Снова изменяем какие-то настройки и рисуем третий полупрозрачный белый прямоугольник.</p> @@ -84,7 +84,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <p>Внутри функции <code>draw()</code> мы вызываем <code>fillRect()</code> девять раз, используя два цикла <code>for</code>. Каждый раз мы сохраняем состояние холста, смещаем его, рисуем прямоугольник, а затем восстанавливаем исходное состояние. Заметьте, что <code>fillRect()</code> всегда использует одни и те же параметры, а изменение позиции фигуры осуществляется с помощью <code>translate()</code>.</p> -<pre class="brush: js; highlight:[7] notranslate">function draw() { +<pre class="brush: js; highlight:[7]">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); for (var i = 0; i < 3; i++) { for (var j = 0; j < 3; j++) { @@ -99,9 +99,9 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations </pre> <div class="hidden"> -<pre class="brush: html notranslate"><canvas id="canvas" width="150" height="150"></canvas></pre> +<pre class="brush: html"><canvas id="canvas" width="150" height="150"></canvas></pre> -<pre class="brush: js notranslate">draw();</pre> +<pre class="brush: js">draw();</pre> </div> <p>{{EmbedLiveSample("A_translate_example", "160", "160", "https://mdn.mozillademos.org/files/9857/translate.png")}}</p> @@ -125,7 +125,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <p><strong>Памятка</strong>: Углы измеряются в радианах, а не в градусах. Для преобразования единиц используйте следующую формулу: <code>radians = (Math.PI/180)*degrees</code>.</p> </div> -<pre class="brush: js; highlight:[9, 23] notranslate">function draw() { +<pre class="brush: js; highlight:[9, 23]">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); // left rectangles, rotate from canvas origin @@ -159,9 +159,9 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <p>Для поворота прямоугольника относительно его центра мы сначала смещаем начало координат, выполняем поворот, а затем выполняем обратное смещение к точке 0,0, и наконец рисуем прямоугольник.</p> <div class="hidden"> -<pre class="brush: html notranslate"><canvas id="canvas" width="300" height="200"></canvas></pre> +<pre class="brush: html"><canvas id="canvas" width="300" height="200"></canvas></pre> -<pre class="brush: js notranslate">draw();</pre> +<pre class="brush: js">draw();</pre> </div> <p>{{EmbedLiveSample("A_rotate_example", "310", "210", "https://mdn.mozillademos.org/files/9859/rotate.png")}}</p> @@ -183,7 +183,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <p>В этом примере мы нарисуем прямоугольники, используя разные масштабные коэффициенты.</p> -<pre class="brush: js; highlight:[6,11] notranslate">function draw() { +<pre class="brush: js; highlight:[6,11]">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); // рисуем масштабированный прямоугольник. @@ -201,9 +201,9 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations </pre> <div class="hidden"> -<pre class="brush: html notranslate"><canvas id="canvas" width="150" height="150"></canvas></pre> +<pre class="brush: html"><canvas id="canvas" width="150" height="150"></canvas></pre> -<pre class="brush: js notranslate">draw();</pre> +<pre class="brush: js">draw();</pre> </div> <p>{{EmbedLiveSample("A_scale_example", "160", "160", "https://mdn.mozillademos.org/files/9861/scale.png")}}</p> @@ -244,7 +244,7 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations <h3 id="Пример_использования_transform_и_setTransform">Пример использования <code>transform</code> и <code>setTransform</code></h3> -<pre class="brush: js; highlight:[12,15] notranslate">function draw() { +<pre class="brush: js; highlight:[12,15]">function draw() { var ctx = document.getElementById('canvas').getContext('2d'); var sin = Math.sin(Math.PI / 6); @@ -265,9 +265,9 @@ translation_of: Web/API/Canvas_API/Tutorial/Transformations </pre> <div class="hidden"> -<pre class="brush: html notranslate"><canvas id="canvas" width="200" height="250"></canvas></pre> +<pre class="brush: html"><canvas id="canvas" width="200" height="250"></canvas></pre> -<pre class="brush: js notranslate">draw();</pre> +<pre class="brush: js">draw();</pre> </div> <p>{{EmbedLiveSample("Пример_использования_transform_и_setTransform", "230", "280", "https://mdn.mozillademos.org/files/255/Canvas_transform.png")}}</p> |