收藏
回答

为什么在开发版和体验版没报错,但是线上版就报错了

框架类型 问题类型 终端类型 操作系统 微信版本 基础库版本
小程序 Bug 客户端 Android 6.6.7 2.2.2

getPoster: function (event){

var _this=this;

//绘图开始

var ctx_height = _this.data.goods_canvas_height;

var ctx_width = _this.data.goods_poster_width;




var ctx = wx.createCanvasContext('myCanvas')

ctx.setFillStyle('#fff')

ctx.fillRect(0, 0, ctx_width, ctx_height)


//店铺头像填充绘制的圆

ctx.setFillStyle('#000')

ctx.save()

ctx.beginPath()

ctx.arc(ctx_width * 0.14 / 2 + 10, ctx_width * 0.14 / 2 + 10, ctx_width * 0.14 / 2, 0, 2 * Math.PI)

ctx.clip()

ctx.drawImage(_this.data.astore_logo_path, 10, 10, ctx_width * 0.14, ctx_width * 0.14)

ctx.restore()


//店铺名称

ctx.setFontSize(14)

ctx.setTextAlign('left')

ctx.setTextBaseline('middle')

ctx.fillText(_this.data.agent4_info.astore_name ? _this.data.agent4_info.astore_name : _this.data.agent4_info.agent4_name, ctx_width * 0.14 + 20, ctx_width * 0.14 / 2 + 10)


var text_start = 10;

//自营图标


if (typeof (_this.data.ziying_width) == 'undefined') {

var ziying_width = 25;

} else {

var ziying_width = _this.data.ziying_width / _this.data.ziying_height * 12;

}

ctx.drawImage(_this.data.ziying_path, text_start, ctx_width * 0.14 + 20, ziying_width, 12)

text_start = text_start + ziying_width + 5;


//跨境图标

if (_this.data.goods_info.cross_border) {

if (typeof (_this.data.kuajing_width) == 'undefined') {

var kuajing_width = 25;

} else {

var kuajing_width = _this.data.kuajing_width / _this.data.kuajing_height * 12;

}

ctx.drawImage(_this.data.kuajing_path, text_start, ctx_width * 0.14 + 20, kuajing_width, 12)

text_start = text_start + kuajing_width + 5;

}

//商品名换行

ctx.setFontSize(12)

ctx.setTextBaseline('top')

var temp_text_start = text_start;

var chr = _this.data.goods_info.goods_name.split("");//这个方法是将一个字符串分割成字符串数组

var temp = "";

var row = [];


for (var a = 0; a < chr.length; a++) {

if (ctx.measureText(temp).width < ctx_width - temp_text_start - 10-10) {

temp += chr[a];

}

else {

temp_text_start = 10;

a--; //这里添加了a-- 是为了防止字符丢失,效果图中有对比

row.push(temp);

temp = "";

}

}

row.push(temp);


//如果数组长度大于2 则截取前两个

if (row.length > 2) {

var rowCut = row.slice(0, 2);

var rowPart = rowCut[1];

var test = "";

var empty = [];

for (var a = 0; a < rowPart.length; a++) {

if (ctx.measureText(test).width < ctx_width - temp_text_start - 10 - 30) {

test += rowPart[a];

}

else {

break;

}

}

empty.push(test);

var group = empty[0] + "..."//这里只显示两行,超出的用...表示

rowCut.splice(1, 1, group);

row = rowCut;

}

for (var b = 0; b < row.length; b++) {

ctx.fillText(row[b], text_start, ctx_width * 0.14 + 20 + b * 15, 300);

ctx.fillText(row[b], text_start + 1, ctx_width * 0.14 + 20 + b * 15, 300);

text_start = 10;

}

//广告

ctx.setFillStyle('#9B9B9B')

var adv_txt = _this.data.goods_info.goods_advword ? _this.data.goods_info.goods_advword : (_this.data.goods_info.gc_name + _this.data.goods_info.goods_name)

var chr = adv_txt.split("");//这个方法是将一个字符串分割成字符串数组

var temp = "";

var row = [];


if (ctx.measureText(adv_txt).width < ctx_width - 20) {

ctx.fillText(adv_txt, 10, ctx_width * 0.14 + 20 + b * 15)

} else {

for (var a = 0; a < chr.length; a++) {

if (ctx.measureText(temp).width < ctx_width - 20 - 30) {

temp += chr[a];

}

else {

temp = temp + "...";

break;

}

}

ctx.fillText(temp, 10, ctx_width * 0.14 + 20 + b * 15)

}


//商品图片

ctx.drawImage(_this.data.goods_image_path, 0, ctx_width * 0.14 + 20 + (b + 1) * 15+10, ctx_width, ctx_width)

//画线

var left_width = parseInt(ctx_width * 0.5328)

var bottom_height = parseInt(ctx_height * 0.15)

ctx.setFillStyle('#E7E7E7')

ctx.fillRect(left_width, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10, 1, bottom_height)


//小程序

ctx.drawImage(_this.data.minipro_code_path, left_width + 10, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width +5, bottom_height, bottom_height)

ctx.setFontSize(10)

ctx.setFillStyle('#9B9B9B')

ctx.fillText('(长按查看商品)', left_width + 5, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 5 + bottom_height)

//国旗

if (_this.data.goods_info.country_id){

if (typeof (_this.data.country_pic_height) == 'undefined') {

var country_pic_width = 14

} else {

var country_pic_width = _this.data.country_pic_width / _this.data.country_pic_height * 14

}

}else{

var country_pic_width=0;

}

//品牌

ctx.setFontSize(12)

ctx.setFillStyle('#000')

ctx.setTextAlign('right')

var brand_text='';

brand_text += _this.data.goods_info.country_name;

if (_this.data.goods_info.country_name && _this.data.goods_info.brand_name){

brand_text += ' | ';

}

brand_text += _this.data.goods_info.brand_name;

var chr = brand_text.split("");//这个方法是将一个字符串分割成字符串数组

var temp = "";

var row = [];

if (ctx.measureText(brand_text).width < left_width - 20 - country_pic_width) {

} else {

for (var a = 0; a < chr.length; a++) {

if (ctx.measureText(temp).width < left_width - 20 - 24 - country_pic_width) {

temp += chr[a];

}

else {

brand_text = temp + "...";

break;

}

}

}

ctx.setTextBaseline('top')

ctx.fillText(brand_text, left_width - 10, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10)


if (_this.data.goods_info.country_id){

console.log(left_width - 10 - ctx.measureText(brand_text).width - country_pic_width);

console.log(ctx_width * 0.14 + 20 + (b + 1) * 15 + ctx_width);

console.log(_this.data.astore_logo_path);

ctx.drawImage(_this.data.country_pic_path, left_width - 10 - ctx.measureText(brand_text).width - country_pic_width - 5, ctx_width * 0.14 + 20  + (b + 1) * 15 + 10 + ctx_width + 10, country_pic_width, 14)

}


//销量

ctx.setFontSize(10)

ctx.setFillStyle('#5A5A5A')

ctx.setTextAlign('right')

ctx.fillText('销量:' + _this.data.goods_info.goods_salenum + '件', left_width - 10, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10+20)

//价格

ctx.setFontSize(16)

ctx.setFillStyle('#DB2819')

ctx.setTextAlign('right')

ctx.fillText(_this.data.goods_info.goods_agent2price, left_width - 10, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10 + 20 + 25)

ctx.fillText(_this.data.goods_info.goods_agent2price, left_width - 10-1, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10 + 20 + 25)

var text_width = ctx.measureText(String(_this.data.goods_info.goods_agent2price)).width;

ctx.setFontSize(10)

ctx.setTextAlign('left')

ctx.fillText('¥', left_width - 10-12 - text_width, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10 + 20 + 25+3)


//市场价

ctx.setFontSize(10)

ctx.setTextAlign('right')

ctx.setFillStyle('#9B9B9B')

ctx.fillText('市场价:' + _this.data.goods_info.goods_marketprice, left_width - 10 , ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10 + 20 + 25 + 3+15)

//划线

ctx.fillRect(left_width - 10 - ctx.measureText('市场价:' + _this.data.goods_info.goods_marketprice).width, ctx_width * 0.14 + 20 + (b + 1) * 15 + 10 + ctx_width + 10 + 20 + 25 + 3 + 15 + 5, ctx.measureText('市场价:' + _this.data.goods_info.goods_marketprice).width, 1)

ctx.draw()


//绘图结束


_this.setData({pop: { poster: 'active' } });

}


回答关注问题邀请回答
收藏

3 个回答

登录 后发表内容