<canvas id="canvas" :style="{width:canvas_width+'px' ,height:canvas_height+'px' }" canvas-id="firstCanvas" ></canvas>
// 照片打水印
imageWatermark (url, canvas_id, width = 100, height = 100,content1,content2,self) {
return new Promise((resolve, reject) => {
/加上延迟 处理h5 防止为改变dome 大小就开始绘制 会出现图片显示不完整/
setTimeout(()=>{
const ctx = uni.createCanvasContext(canvas_id, self);
ctx.drawImage(url, 0, 0, width, height );
ctx.setFontSize(50)
ctx.setFillStyle('#ff0000') //水印颜色
let clientIdWidth = 10
let clientIdHeight = 50 //内容2高度
ctx.fillText(content2, clientIdWidth, clientIdHeight)
for(let i = 1; (i-1)20 < content1.length; i++){
let start = 18(i-1);
let end = 18i;
ctx.fillText(content1.substring(start, end), 10, (50+50i))
}
ctx.draw(false, () => {
setTimeout(() => {
uni.canvasToTempFilePath({
canvasId: canvas_id,
destWidth:width,
destHeight:height,
fileType: 'jpg',
quality: 0.9,
success: (res) => {
console.log(res)
resolve(res.tempFilePath)
},
fail: (err) => {
console.log(err,123)
}
}, self)
},500)
})
},500)
})
},
3 个回复
意念开发创始人 (作者)
先是给图片打水印，打完水印生成图片 返回的图片是空白的 水印也没有
FullStack - 【插件开发】【专治疑难杂症】【ios上架、马甲包、白包、过审、已成功上架过几百个】【多款插件已上架：https://ext.dcloud.net.cn/publisher?id=22130】【非诚勿扰】QQ：543610866
FullStack - 【插件开发】【专治疑难杂症】【ios上架、马甲包、白包、过审、已成功上架过几百个】【多款插件已上架：https://ext.dcloud.net.cn/publisher?id=22130】【非诚勿扰】QQ：543610866
最后要执行ctx.draw()
意念开发创始人 (作者)
已经找到原因了 但不知道如何解决 canvas大小之前是获取的图片大小 ios上画布太大了就显示空白 如果<canvas>宽高 给小一点的固定值 就可以显示
2022-01-14 08:43
DCloud_UNI_GSQ
回复 意念开发创始人: 你现在绘制的多大？
2022-01-14 14:33
意念开发创始人 (作者)
回复 DCloud_UNI_GSQ: 现在 我固定死了 宽1200 高1000 就可以 画出来
2022-01-14 15:08
DCloud_UNI_GSQ
回复 意念开发创始人: 关于尺寸限制文档有，你绘制这么大的用途是什么？
2022-01-14 15:19