Como posso desenhar uma imagem a repetindo até preencher uma área?
Algo como o efeito da propriedade CSS background-repeat
.
Onde a imagem é repetida até preencher toda a área da tag.
1 Resposta
A API do canvas tem uma funcionalidade para padrões.
Um exemplo:
var canvas = document.getElementById("my_canvas"),
context = canvas.getContext("2d"),
var img = new Image();
img.src = 'http://bit.ly/2fDRYfC';
img.onload = function(){
var pattern = context.createPattern(img, 'repeat');
context.fillStyle = pattern;
context.fillRect(0, 0, canvas.width, canvas.height);
}
-
1Eu lhe agradeço, desculpe não marcar como respondido antes é que simplesmente havia me esquecido.– Silva97Commented 30/11/2016 às 14:11
background-repeat