如何在HTML5画布中绘制调整大小的图片而不是线条？

Question

所以我们可以有一个绘制线条的函数，例如：

function drawLine(g, n, x1, y1, x2, y2){
    g.beginPath();
    g.lineWidth = n > 0 ? n : 1;
    g.strokeStyle = "rgb(0, 128, 32)";
    g.moveTo(x1, y1);
    g.lineTo(x2, y2);
    g.stroke();
}

但是如果我们想要绘制一张图片而不是线条（按照线条大小调整大小，并带有alpha通道），该怎么办呢？

如何实现这样的功能？

- Rella

---

插入图像还是绘制任意图像？http://goo.gl/hxMFc和http://goo.gl/xAMBj - Kai

嗯...你可以在空白画布上画线，获取其图像数据，然后找到该线并使用坐标从实际图像中提取像素... - Pointy

Answer 1

使用上下文的drawImage()方法，但首先 translate，rotate和scale上下文。图像将作为一个长而细的线条旋转出来。 编辑：我已经将这个技术作为一个函数封装，并放了一个实时示例。

- Phrogz