CanvasContext.drawImage

使用顺序：drawImage(imageResource, dx, dy, dWidth, dHeight, sx, sy, sWidth, sHeight) 解释：绘制图像到画布。

方法参数

示例

扫码体验

请使用百度APP扫码

图片示例

代码示例1

在开发者工具中预览效果

  1. <canvas canvas-id="myCanvas" class="myCanvas"/><button type="primary" bindtap="drawImage">点击上传</button>
  1. Page({    drawImage () {        const canvasContext = swan.createCanvasContext('myCanvas');        swan.chooseImage({            success: function(res){                canvasContext.drawImage(res.tempFilePaths[0], 0, 0, 150, 100);                canvasContext.draw();            }        });    }});

代码示例2 - 把用户正方形图片绘制成圆形

在开发者工具中预览效果

  1. Page({    data: { },    onLoad: function () {        var contex = swan.createCanvasContext('myCanvas')        contex.beginPath();         contex.arc(110, 60, 30, 0, 2 * Math.PI);        contex.clip();        contex.drawImage('/image/faceDetect.png', 80,30,60,60); // 推进去图片，这里注意头像坐标要在圆形区域内        contex.draw();    }})