initcanvas
(),複製**
rem(px)
複製**
/*
* opt.x / opt.y : x,y是矩形的起點;
* opt.w / opt.h : w,h是矩形的寬高;
* opt.color : 顏色 -- #ffffff
* opt.opacity : 透明度 -- 1
* opt.fill : 是否填充 -- false
*/drawrect(opt={})else
ctx.restore(); //恢復之前儲存的繪圖上下文
},複製**
/*
* opt : object
* opt.text / opt.x / opt.y 繪製文字的內容和座標
* opt.align : 用於設定文字的對齊 -- left（可選值 'left'、'center'、'right'）
* opt.base : 用於設定文字的水平對齊 -- top (可選值 'top'、'bottom'、'middle'、'normal')
* opt.color : 字型顏色 -- #333333
* opt.size : 字型大小 -- 16
* opt.maxwidth : 文字最大寬度
* opt.lineheight : 行高 -- 1
* opt.opacity : 透明度 -- 1
* opt.isparagraph : 段落模式 -- false
* 擴充套件中...
* return : 文字的高度 = 行數*行高*字型大小
*/drawwraptext( opt={} )else
if( j == _len -1 && text != '' )}}
} ctx.closepath();
ctx.restore(); //恢復之前儲存的繪圖上下文
console.log('文字的高度 = 行數*行高*字型大小 = ', line_count * lineheight * opt.size )
return line_count * lineheight * opt.size;
},複製**
/*
* 注意：需用wx.getimageinfo()處理
* opt : object
* opt.imageresource 所要繪製的資源
* opt.dx 影象的左上角在目標canvas上 x 軸的位置
* opt.dy 影象的左上角在目標canvas上 y 軸的位置
* opt.dwidth 在目標畫布上繪製影象的寬度，允許對繪製的影象進行縮放
* opt.dheight 在目標畫布上繪製影象的高度，允許對繪製的影象進行縮放
* opt.image 資訊 wx.getimageinfo()
* opt.clip 縮放裁剪
* opt.arc 圓形
*/drawimage( opt={} )else
if( opt.clip )
opt.dheight = h
console.log(1,'width <= height',opt.dheight);
}else
if( opt.image.width/opt.dwidth > opt.image.height/opt.dheight )
opt.dwidth = w;
console.log(2,'height > width',opt.dheight);}}
ctx.clip();//剪下某個區域，之後的繪圖都會被限制在剪下的區域內，ctx.restore()恢復
} ctx.drawimage(opt.imageresource,opt.dx, opt.dy, opt.dwidth, opt.dheight,opt.sx, opt.sy, opt.swidth, opt.sheight);// 推進去，必須是https
ctx.restore(); //恢復之前儲存的繪圖上下文
},複製**
未完待續...
WeZRender 微信小程式Canvas增強元件
canvas增強元件，基於html5 canvas類庫zrender。wxml canvas js var wezrender require lib wezrender zr wezrender.zrender.init line canvas 1 375,600 資料驅動 利用wezrender...
微信小程式canvas文字換行效果
我們在canvas上繪製多行文字的時候，不可能一行一行的繪製，這時就需要到了換行這個功能。文字換行 引數 1 canvas物件，2 文字 3 距離左側的距離 4 距離頂部的距離 5 不用管 6 文字的寬度 文字換行 引數 1 canvas物件，2 文字 3 距離左側的距離 4 距離頂部的距離 5 6...
微信小程式canvas元素 父元件滾動
1 首先現根據官網的tips，看看自己是不是把canvas寫在這個元件裡 2 看看自己是不是在 config裡設定了config 如果設定了就去掉。4 如果上面的方法都用過了還沒有解決，那麼檢查你的canvas的所有父級元素是否設定了height 100 overflow相關的屬性 visible除...