小编use*_*806的帖子

使用javascript调整图像大小以在canvas createPattern中使用

我已经看到了一些关于如何调整想要在IMG标签内使用的图像的技巧,但我希望在Javascript中有一个图像变量,调整它的大小然后在context.createPattern中使用图像(图像,"重复").我没有找到任何暗示如何做到这一点.

您可以在http://karllarsson.batcave.net/moon.html找到一个功能演示, 其中包含我想要做的图像.

Loktar的解决方案看起来不错.我还没有时间来修正正确的方面,但现在我知道该怎么做了.再一次谢谢你.这是一个有效的演示http://karllarsson.batcave.net/moon2.html

这是我无法工作的两条线,因为我也想要它们.

image.width = side*2;
image.height = side*2;

function drawShape() {
    try {
        var canvas = document.getElementById('tutorial');                 
        var image = new Image();                                          
        image.src = "http://xxx.yyy.zzz/jjj.jpg";                         
        image.width = side * 2;                                           
        image.height = side * 2;                                          

        if (canvas.getContext){
            var ctx = canvas.getContext('2d');                            
            ctx.clearRect(0, 0, canvas.width, canvas.height);             
            ctx.fillStyle = ctx.createPattern(image, "repeat");           
            ctx.beginPath();                                              
            var centerX = canvas.width / 2 - side / 2;                    
            var centerY = canvas.height / 2 - side / 2;                   
            ctx.rect(centerX, centerY, side, side); …
Run Code Online (Sandbox Code Playgroud)

javascript resize canvas

14
推荐指数
1
解决办法
5582
查看次数

标签 统计

canvas ×1

javascript ×1

resize ×1