Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Метод CanvasRenderingContext2D.stroke() Canvas 2D API управляет текущим или заданным путем с текущим стилем хода, используя правило ненулевой обмотки.

Syntax

void ctx.stroke();
void ctx.stroke(path);

Parameters

path
A Path2D путь к обводке.

Examples

Using the stroke method

Это всего лишь простой фрагмент кода, который использует метод stroke, чтобы погладить путь.

HTML

<canvas id="canvas"></canvas>

JavaScript

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
ctx.rect(10, 10, 100, 100);
ctx.stroke();

Отредактируйте приведенный ниже код и посмотрите, как обновляется ваше обновление на холсте:

Playable code
<canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas>
<div class="playable-buttons">
  <input id="edit" type="button" value="Edit" />
  <input id="reset" type="button" value="Reset" />
</div>
<textarea id="code" class="playable-code">
ctx.rect(10, 10, 100, 100);
ctx.stroke();</textarea>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var textarea = document.getElementById("code");
var reset = document.getElementById("reset");
var edit = document.getElementById("edit");
var code = textarea.value;

function drawCanvas() {
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  eval(textarea.value);
}

reset.addEventListener("click", function() {
  textarea.value = code;
  drawCanvas();
});

edit.addEventListener("click", function() {
  textarea.focus();
})

textarea.addEventListener("input", drawCanvas);
window.addEventListener("load", drawCanvas);

Specifications

Specification Status Comment
HTML Living Standard
Определение 'CanvasRenderingContext2D.stroke' в этой спецификации.
Живой стандарт  

Browser compatibility

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidEdge MobileFirefox для AndroidOpera для AndroidiOS SafariSamsung Internet
Базовая поддержкаChrome Полная поддержка ДаEdge Полная поддержка 12Firefox Полная поддержка ДаIE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка ДаWebView Android Полная поддержка ДаChrome Android Полная поддержка ДаEdge Mobile Полная поддержка ДаFirefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка ДаSamsung Internet Android Полная поддержка Да
Path parameterChrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка 31IE Нет поддержки НетOpera Полная поддержка ДаSafari Нет поддержки НетWebView Android ? Chrome Android ? Edge Mobile Полная поддержка ДаFirefox Android Полная поддержка 31Opera Android ? Safari iOS ? Samsung Internet Android ?

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки
Совместимость неизвестна  
Совместимость неизвестна

See also

Метки документа и участники

Внесли вклад в эту страницу: slychai85
Обновлялась последний раз: slychai85,