html2canvas uniapp 本地图片

html2canvas 是一款能够将网页内容转换为 Canvas 图片的 JavaScript 库，而 uniapp 是一款支持多端开发的框架，可以将同一份代码打包成不同平台的应用。在 uniapp 中使用 html2canvas 可以很方便地将网页内容转换为图片，同时支持将本地图片也转换成 Canvas 图片。

在使用 html2canvas 时，需要先将要转换的 HTML 元素传入 html2canvas 函数中，然后通过回调函数获取到转换后的 Canvas 对象，最后可以将 Canvas 对象转换成图片文件，或者直接插入到 HTML 中展示。

对于本地图片的处理，可以先将图片转换成 base64 编码的字符串，然后将字符串作为图片的 src 属性值传入 HTML 中，再将包含图片的 HTML 元素传入 html2canvas 函数中进行转换。具体代码实现可以参考以下示例：

// 将本地图片转换成 base64 编码字符串
function getBase64Image(img) {
    var canvas = document.createElement("canvas");
    canvas.width = img.width;
    canvas.height = img.height;

    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0, img.width, img.height);

    var dataURL = canvas.toDataURL("image/png");

    return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}

// 将包含本地图片的 HTML 元素转换成 Canvas 图片
html2canvas(document.querySelector("#content"), {
    onrendered: function(canvas) {
        // 将 Canvas 转换成图片文件
        var imgData = canvas.toDataURL();
        var img = new Image();
        img.src = imgData;
        document.body.appendChild(img);
    }
});

// HTML 代码示例
<div id="content">
    <img src="data:image/png;base64,iVBORw0KG..."><!-- 本地图片 -->
    <p>Hello world!</p>
</div>