小程序
小游戏
企业微信
微信支付
扫描小程序码分享
需求:根据文本内容生成长文海报。
问题:
代码片段:https://developers.weixin.qq.com/s/20IzsTmK7Fg3
2 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
经过测试发现最主要的问题是:measureText的性能好像比较低,生成长文时多次调用API,导致生成海报很慢。
解决方法:把measureText换成下面的方法:
测试结果:保存的速度提升了。。。。。。奈斯
最后:感谢大佬们回答问题!膜拜!
measureText(text, fontSize = 28) { text = String(text); // var text = text.split(''); var width = 0; // text.forEach(function(item) { if (/[a-zA-Z]/.test(text)) { width += 7; } else if (/[0-9]/.test(text)) { width += 5.5; } else if (/\./.test(text)) { width += 2.7; } else if (/-/.test(text)) { width += 3.25; } else if (/[\u4e00-\u9fa5]/.test(text)) { //中文匹配 width += 10; } else if (/\(|\)/.test(text)) { width += 3.73; } else if (/\s/.test(text)) { width += 2.5; } else if (/%/.test(text)) { width += 8; } else { width += 10; } // }); return width * fontSize / 10; }
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
看了下还好啊https://developers.weixin.qq.com/s/5KJlFTmn7mgO,要不你试试这两个插件?
1.官方的:https://developers.weixin.qq.com/miniprogram/dev/extended/component-plus/wxml-to-canvas.html
2.https://developers.weixin.qq.com/community/develop/article/doc/000ac686c5c5506f18b87ee825b013
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
经过测试发现最主要的问题是:measureText的性能好像比较低,生成长文时多次调用API,导致生成海报很慢。
解决方法:把measureText换成下面的方法:
测试结果:保存的速度提升了。。。。。。奈斯
最后:感谢大佬们回答问题!膜拜!
measureText(text, fontSize = 28) { text = String(text); // var text = text.split(''); var width = 0; // text.forEach(function(item) { if (/[a-zA-Z]/.test(text)) { width += 7; } else if (/[0-9]/.test(text)) { width += 5.5; } else if (/\./.test(text)) { width += 2.7; } else if (/-/.test(text)) { width += 3.25; } else if (/[\u4e00-\u9fa5]/.test(text)) { //中文匹配 width += 10; } else if (/\(|\)/.test(text)) { width += 3.73; } else if (/\s/.test(text)) { width += 2.5; } else if (/%/.test(text)) { width += 8; } else { width += 10; } // }); return width * fontSize / 10; }
看了下还好啊https://developers.weixin.qq.com/s/5KJlFTmn7mgO,要不你试试这两个插件?
1.官方的:https://developers.weixin.qq.com/miniprogram/dev/extended/component-plus/wxml-to-canvas.html
2.https://developers.weixin.qq.com/community/develop/article/doc/000ac686c5c5506f18b87ee825b013