Измените размер холста HTML5 для установки окну

Это классический пример CORS, который обозначает перекрестное совместное использование ресурсов. Borwsers запрещают отправлять AJAX-запрос в домен, отличный от того, откуда был создан файл javscript. Как говорится в сообщении об ошибке, вы должны установить HTTP-заголовок «Access-Control-Allow-Origin» из кода своего сервера. Узнайте больше о CORS здесь [введите описание ссылки здесь CORS MDN

382
задан gman 20 July 2019 в 17:36
поделиться

4 ответа

Я считаю, что нашел элегантное решение для этого:

JavaScript

/* important! for alignment, you should make things
 * relative to the canvas' current width/height.
 */
function draw() {
  var ctx = (a canvas context);
  ctx.canvas.width  = window.innerWidth;
  ctx.canvas.height = window.innerHeight;
  //...drawing code...
}

CSS

html, body {
  width:  100%;
  height: 100%;
  margin: 0;
}

До сих пор не было никакого большого негативного влияния на производительность.

355
ответ дан 22 November 2019 в 23:53
поделиться

Во-первых, вы не можете использовать атрибуты width и height, чтобы изменить размер (по крайней мере, с моей точки зрения), потому что это сломает его. Вы можете сделать это: HTML:

<canvas id = 'myCanvas'></canvas>

JS:

var canvas = document.getElementById('myCanvas');

var W = window.innerWidth;
var H = window.innerHeight;
canvas.width = W;
canvas.height = H;

(Пожалуйста, прости меня за любые опечатки, я склонен делать это много)

-1
ответ дан 16 September 2019 в 22:02
поделиться

Если ваш div полностью заполнил веб-страницу, вы можете заполнить этот div и получить холст, который заполняет div.

Это может показаться вам интересным, так как вам может потребоваться использовать css для использования процента, но это зависит от того, какой браузер вы используете, и насколько он соответствует спецификации: http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#the-canvas-element

Внутренние размеры холста элемент равен размеру координатное пространство, с числами интерпретируется в пикселях CSS. Однако, размер элемента может быть произвольным таблицей стилей. Во время рендеринга изображение масштабируется, чтобы соответствовать этому макету size.

Вам может потребоваться получить offsetWidth и высоту div или получить высоту / ширину окна и установить их в качестве значения пикселя.

4
ответ дан 22 November 2019 в 23:53
поделиться

Unless you want the canvas to upscale your image data automatically (that's what James Black's answer talks about, but it won't look pretty), you have to resize it yourself and redraw the image. Centering a canvas

8
ответ дан 22 November 2019 в 23:53
поделиться
Другие вопросы по тегам:

Похожие вопросы: