报错:draw.js const_drawImage =(img) =>{if(this.use2dCanvas) {console.log('canvas:', canvas);constImage = canvas.createImage()// 这行报错Image.onload =()=>{ ctx.drawImage(Image, x, y, w, h) ctx.restore() resolve() } Image.onerror =()=>{ reject(newError(`createImage fail:$...
6、配置wxml页面 /pages/domData.js const wxml = (name, pic, c1) => `<viewclass="container"><imagesrc="` + pic + `"class="pic"/><textclass="name">${name}</text><textclass="content">` + c1[0] + `</text><textclass="content">` + c1[1] + `</text><textclass="content"...
需要为wxml-to-canvas指定width和height属性,默认为400*300,当该尺寸与wxss最大容器尺寸不一致时会有异常 只能使用view、text、image标签 view只用于布局、text只用于文字、image只用于图片(可绝对定位作为背景) text、image必须指定width、height view可以不指定height、只指定width,由子元素动态撑高。 渲染高度限制:IO...
最后回到插件市场下载x-wxml-to-canvas插件,一开始也是用这个插件但是各种报错,现在只能回头再尝试,毕竟2000多的下载量,该是有一定含金量的。于是~打断点,跟代码——发现是插件原代码有点点点点缺陷,稍微改了下... 好家伙,给我整出来了,有view有image,nice~ 以下是我记得的x-wxml-to-canvas插件的修改点 1 2 ...
{ wxml, style }) p1.then((res) => { this.container = res this.extraImage() }) }, extraImage() { const p2 = this.widget.canvasToTempFilePath() p2.then(res => { this.setData({ src: res.tempFilePath, width: this.container.layoutBox.width, height: this.container.layoutBox....
<videoclass="video"src="{{src}}"><wxml-to-canvasclass="widget"></wxml-to-canvas></video><imagesrc="{{src}}"style="width: {{width}}px; height: {{height}}px"></image> Step4. js 获取实例 const{wxml,style}=require('./demo.js')Page({data:{src:''},onLoad(){this.widget=this...
{ wxml, style }) p1.then((res) => { this.container = res this.extraImage() }) }, extraImage() { const p2 = this.widget.canvasToTempFilePath() p2.then(res => { this.setData({ src: res.tempFilePath, width: this.container.layoutBox.width, height: this.container.layoutBox....
npm install wxml-to-canvas (下载完后重新构建npm) 新建组件-share.js 因为我们涉及到动态参数,所以使用了传参 constwxml=(img,name,organiseid,codeImg)=>{return`<viewclass="container"><viewclass="box1"><imageclass="img"src='`+img+`'></image></view><viewclass="namebox"><textclass="nametex...
(res)=>{this.container=resreturnthis.extraImage(this)}).then((res)=>{resolve(res)})})},// 生成临时图片地址extraImage(){returnnewPromise((resolve,reject)=>{constp2=this.widget.canvasToTempFilePath()p2.then((res)=>{this.setData({tempFilePath:res.tempFilePath})resolve(res.tempFilePath...
<viewclass="share-page-btn"@tap="extraImage"> <buttonclass="btn-big":style="getBtnStyle">保存图片</button> </view> </view> </template> <script> const { wxml, style } = require('./DomData.js') export default { name: '', ...