Установить фон на canvas

219
15 октября 2018, 00:30

Имеется изображение фона 50 на 50 px и холст размером 500 на 500, нужно изображениями фона заполнить весь холст. Как это сделать?

Answer 1

Можно так:

<canvas id='canvas' width=250 height=250></canvas>
<img src='http://900igr.net/up/datai/165870/0003-002-.png' id='img'/>

JS:

function ge(id) {
  return document.getElementById(id);
} 
const canvas = ge('canvas');
const ctx = canvas.getContext('2d');
const canvasWidth = canvas.width;
const canvasHeight = canvas.height;
const img = ge('img');
for (let i = 0; i < canvasWidth; i += 50) {
  for (let j = 0; j < canvasHeight; j += 50) {
    ctx.drawImage(img, i, j);
  }
}

Пример на JSFiddle

READ ALSO
JavaScript сравнение чисел в виде строки

JavaScript сравнение чисел в виде строки

Сижу и пишу условие на Vuejs

171
Помощь в выборе литературы

Помощь в выборе литературы

Нужна помощь в выборе книги, по которой можно (если это возможно) изучить front-end часть веб-программированияВ идеале в объеме, позволяющем претендовать...

182
Сортировка вложенного массива в mongose

Сортировка вложенного массива в mongose

есть такая модель https://pastebincom/i01Pw1Un и есть такой запрос https://pastebin

180
Нужна помощь с data-color button`а

Нужна помощь с data-color button`а

нужен скрипт который будет задавать data-color button-а при клике заднему фону Navbar`а на чистом js, объясните пож-ста,ибо в деле новичок,и не совсем...

231