最近有个需求是在小程序里下过订单后会出现一个二维码图片，，长按识别二维码会弹出相关信息，，，需要实现长按识别图片二维码功能 百度后使用别人建议的wx.previewImage(),,但是根本实现不了啊，，，求大佬们指教啊！ [图片] [图片]

[图片] [图片] 这个小程序不知不觉已经上线一年，但是访问量一直没到1000 我分析的造成这个问题的原因如下： 1、没有公众号引流 2、用户搜索不到 3、内容不吸引人，用户不分享 有没有大佬指导一下，如何快速提交访问量？如果实在不行，去买量可不可行？

作者：代长新 我是代长新，来自上海享物说，主要负责游戏客户端研发。 [图片] 享物说是一个大家可以互相赠送物品，有趣、不花钱的社区平台。为了创造更好的社区氛围，我们决定通过小游戏来增加社区的趣味性和互动性。 《乐享花园》是我们在小游戏领域的第一个实践。这个游戏，从立项到做完，准确的说是客户端做完，我们一共用了3天的时间。 但是，当时我们种花浇花、领水滴任务都是通过浏览器缓存实现的，如果要上线还要等服务端人员到位，否则玩家清理一下手机，自己种的花就没了。但等我们服务端人员到位，再到游戏上线，就是几周以后的事情了。 小游戏开发之痛：无法摆脱对服务端的依赖 相信，这也是大部分小游戏开发时会遇到的问题 —— 功能很简单，但就是摆脱不了对服务端的依赖。如下图： [图片] 具体来说，小游戏对服务端的依赖主要有以下两个方面： 1、微信接口只支持在服务端调用 这就意味着，我们必须为这些接口架设一个中转服务器。如果没有这个中转服务器，我们就没法做用户登录，没法获取用户头像、名称信息，也拿不到access_token，更没有办法调用其他微信接口，如内容审查。 2、游戏功能实现需要服务器开发 对于很多小游戏来说，我们唯一用到服务端的地方就是，储存当前的关卡进度，展示一个世界排行，就可以了。而想要实现这么一个简单的需求时，你会发现，隔行如隔山。 如何用云开发解决小游戏在服务端痛点？ 1、云函数实现微信接口调用 曾经，我想过绕开服务器，直接通过客户端请求微信接口，结果踩了一个坑。 当时做的是聊天功能，需要对玩家发送的消息进行内容审查。我看完了接口文档，就跑过去跟服务器同学说，内容审查我这边全部做掉就可以，他那边不需要做额外的处理。 [图片] 等我们调通，上了体验版，一打开报错，我才想起来，这个接口文档的上面，有一行小字，而且颜色是灰色的，上面写着：此接口应在后端服务器调用。 第一次看到这句话，还以为它只不过是一个警告，所以根本没把它放在心上，哪知道它居然是一个error！而在这之前，我还特意做了一些我认为比较人性化的设计，比如使用这个接口需要一个密钥，这个密钥是有有效期的，当密钥过期的时候，我会把玩家发送的内容保存起来，向后端拉取新的密钥后，再发送出去，这样对于玩家来说，整个过程是无感知的。而现在则意味着所有这些都要服务器去实现了。 后来，我通过云开发来实现多有接口调用，事情就简单多了。 [图片] 就拿登录来说吧。 由于云函数具有微信天然鉴权的能力，可以直接返回openid，这一点对做登录确实很方便。乐享花园需要和享物说平台打通小红花积分数据，所以需要用户的unionid信息，这一步也是在云函数中实现的。 还有access_token，就是刚才用到的密钥，**为什么要单独说这个密钥呢？因为它会用到云函数特别有意思的功能，那就是定时触发器。**由于这个密钥是有两个小时有效期的，我们设定一个小时间隔定时刷新，保存到数据库中，用的时候直接从数据库中取出来就可以了，这样可以保证密钥永远是不过期的。 [图片] 通过云开发，为微信接口准备的中转服务器就不需要了；更重要的是，**服务端与微信接口分离，无需关心客户端场景。**不管这个客户端，是来自h5游戏，还是来自小游戏环境，对于服务端来说，都是一样的，再也不需要为客户端提供这样那样的权限接口。 2、云函数+数据库，实现全局排行榜功能 正如前面提到的痛点，小游戏开发对服务端的另一个依赖是游戏功能的实现。对于大部分小游戏来说，我们唯一用到服务端的地方就是：保存用户数据，展示一个世界排行榜。而如果用传统服务器实现这些功能的话，你会发现需要了解的后端架构知识非常庞大。 有次，我到服务端同学的旁边，原本是打算diss他的，因为我功能已经写完了，他还不知道在忙些什么东西。这时我看到他在做什么呢 —— 一边写dockfile文件，一边写linux命令，一边打开Postman调试，完了后发邮件给运维说要执行几个mysql语句。 而所有这些都还没有涉及到他要开发的游戏功能！ 所以说，一门后端语言从会写，到可以放到生产环境中，是两个完全不一样的概念。 云开发提供了数据库、云函数、云存储，通过这些能力，我们完全可以取代服务器来实现游戏功能。 在《乐享花园》里，我们通过云开发实现了全民成语接龙这个游戏功能，并且只用了2个云函数就实现了我们对服务器的全部需求。这里简单介绍一下这两个云函数： **第一个云函数是用来展示世界排行榜。**由于云函数拉取数据库的条目是有限制的，最大是100条，其实这个已经足够满足需求了；当然了，你要说我们的客户端很牛，性能不是问题，数据什么的先给我来个2000条，也不是不可以，这里做个处理就可以了。 另外在检索数据库数据时，这个过程会很慢，一定要记得，在后台添加数据库索引，可以把这个过程理解为通过磁盘换取CPU计算。这样速度会快很多。 [图片] **第二个云函数是用来上报玩家数据。**这个比较简单，一行代码搞定。 [图片] 就这样从微信接口调用，到游戏功能开发，一款不需要服务器的小游戏就全部开发完成了。 小结 其实，云开发可以使用的业务场景，还有很多，比如， 绕过微信https域名请求限制 存放游戏的全局设置 保存玩家的个性化数据 。。。 作为开发者，也希望云开发未来，可以提供更多的业务场景支持，比如 websocket，刚才说的聊天服务器，就可以省掉了； 帧同步，实时对战类游戏的实现，就不再有压力； 日志服务，方便统计，和排查玩家的行为，方便游戏迭代优化； 大数据统计分析，可以做一些事件漏斗等等～ 这样小游戏的研发门槛，就降得很低很低了！

以企业为主体注册小程序，能注册50个，而每个身份证只能绑定5个。 开发人员少的公司，每次登录小程序后台，还得去找不同的人要手机，扫码！(在后台可以进行开发人员设置，从而实现部分管理功能。然而这个规则确实不合理，假如公司注册几十个小程序，得找好几个人一起注册才行。万一涉及到类目等设置，还必须得用注册者的微信去扫码，非常非常不方便) 这样合理吗？ 墙裂建议官方去掉身份证只能绑5个上限，或者有申请渠道可以多绑定一些！

场景 在日常开发中经常遇到以下问题， 1、离职了，微信号还被公司的小程序绑定为体验者或者运营者 2、甲方爸爸的项目交付了，微信号还被绑定为体验者或者运营者 遇到上述问题怎么办？ 解决方案 关注公众平台安全助手（mphelper），点击菜单–>绑定查询->微信号绑定帐号，可以看到绑了哪些小程序，然后也可以直接进行解绑。 备注 特别注意：管理员无法解绑，只能登陆小程序后台进行换绑。建议联系原公司换绑管理员。 相关链接 https://developers.weixin.qq.com/community/develop/doc/000c0ad40f85e0961147c3c975b000?_at=1578280763953 https://developers.weixin.qq.com/community/develop/doc/00000450f605781be89868e3851000?_at=1578281244737

请问，假如我的微信账号现在已经绑定5个小程序，能否自己解绑一个，再重新绑定新的小程序？

微信开放平台只能绑定5个不同主体小程序，50个同主体小程序；想用app分享到小程序的功能，现在已经绑定了5个不同主体的小程序了，有什么办法可以解决吗 是不是可以在公众平台关联公众号，再在公众号绑定小程序，文档显示公众号可以单独绑定3个不同主体的小程序；这样可以正常调起分享吗 绑定小程序流程说明：登录微信开放平台（open.weixin.qq.com）—管理中心—公众帐号—绑定公众帐号 公众号关联小程序公众号关联小程序后，将可在图文消息、自定义菜单、模板消息等功能中使用小程序。 关联规则： 所有公众号都可以关联小程序。 一个公众号可关联10个同主体的小程序，3个不同主体的小程序。 一个小程序可关联500个公众号。 公众号一个月可新增关联小程序13次，小程序一个月可新增关联500次。

现在已知的是我登陆开发者工具之后编译二维码，可以在自己手机测试，但是如果我想多人同时可以测试，这样的话应该如何做到呢

有可以查询微信群用户数据的api吗？感谢

微信帧同步 断线重连后 再次调用GameServerManager.endGame去结束游戏，提示Error: game has not started

我们收到很多小游戏开发者的反馈，在设计小游戏时，为了增强小游戏的用户黏性，希望实现一些排行榜、或者“下一个即将超越的好友”等社交玩法。开发者需要获取到自己游戏中哪些玩家是当前用户的微信好友/某个群成员。但如果直接提供这个数据，会存在被恶意使用的风险。 因此我们既要保证开发者可以获取并合法的使用这类数据（如绘制排行榜等），但不能将这类数据收集并将其发送至第三方服务器。 [图片] （排行榜示意） 开放数据域介绍 基于这一背景，我们设计了“开放数据域”， 这是一个封闭、独立的JavaScript 作用域。 在这个作用域中，开发者可以将玩家数据托管到云端，并且可以获取到玩家的微信好友、群聊中的其他玩家数据，也即关系链数据。这个作用域和另一个执行游戏逻辑的“主域”是隔离的，没有共享变量，只能进行从主域到开放数据域的单向通信。开放数据域和主域有一个共享画布 shardCanvas。在开放数据域中，开发者可以调用 API 获取关系链数据和 2d 绘图 API，将获取到的关系链数据根据自己的业务需要绘制到 sharedCanvas 上，主域可以将 sharedCanvas 渲染上屏；但是为了保证数据安全，开放数据域不能调用网络、存储、文件等 API。 但如果我们的设计只做到这一步，开发者仅能拉取到一个不包含游戏数据的好友列表或群成员列表。此时开发者并不知道这些用户是自己游戏中的哪些玩家。因为每款游戏的游戏数据都是自定义的，可能包含分数、头衔、公会等信息，且结构不同，而这些信息往往是需要在排行榜中展示的。 为此，我们提供了托管数据 API： 前台使用的接口：wx.setUserCloudStorage 后台使用的接口：setUserStorage 开发者可以将每个玩家的分数、头衔等数据托管在微信后台，这些数据在调用关系链API 时会随着昵称、头像等信息一并返回。 完整的开放数据域的设计如下图所示： [图片]下面我们想分享开放数据域应用的一些实战经验。 01 自建函数路由规则 在一个小游戏中，只存在一个 sharedCanvas 。所有需要使用到关系链数据的页面场景，都只能绘制到这一个 sharedCanvas 上面。而在实际游戏中，往往存在多个关系链场景。例如排行榜页（好友排行）、结算页（即将超越某好友）、游戏页（某好友也在玩）等等。   如果将这些功能都写在一个文件内，势必难以管理。较好的做法是将代码按功能拆分成文件，由入口文件 index.js 来路由函数调用： [图片] 子模块们再对公用的 sharedCanvas 进行操作： [图片] 02 适时清空画布 如上文所说， sharedCanvas 会被多个场景共享使用，而场景的销毁并不会自动清空 sharedCanvas 上的内容。若在场景切换时忘记清空画布，则有可能出现错乱叠加等现象： [图片]（排行榜页面忘记重置 sharedCanvas 的效果） 因此，建议在场景切换时，要记得清空画布： [图片] 03 延时上屏 在涉及到网络请求的关系链场景中（如排行榜），若主域在初始化开放数据域后便立即渲染上屏，则有可能渲染不到任何数据： [图片] 这是因为存在网络延时，主域在渲染上屏时，开放数据域未获取到网络数据，sharedCanvas 为空。由于开放数据域无法主动向主域通信，所以可以考虑采用 setTimeout 或 setInterval 来延时上屏： [图片] 此外，亦可使用 WebGLRenderingContext.wxBindCanvasTexture() 方法将 sharedCanvas 绑定到主域的 WebGL 上下文中，以实现自动同步开放数据域的更新。 详细可查看： 教程文档 接口文档

现在个人小游戏需要版号了吗？ 但是提审的时候却又不需要，到底什么情况，官方给个结论？[图片]

网传个人小游戏也要版号了,有没有最新消息

小程序支持引入tensorflow.js做图像识别相关吗，如果不支持，可以说明理由么

文档中有这样一句： [代码]tip[代码]: [代码]canvas[代码] 组件是由客户端创建的原生组件，它的层级是最高的，不能通过 z-index 控制层级 比如，选中图片后，把图片画到canvas上，但是并不想让用户看到这个canvas，请问如何在小程序页面中隐藏canvas呢？

一个页面十几个canvas频繁重绘，并且因为层级问题需要转成image。能不能把canvas直接visibility:hidden。display:none，是不可能的。我用visibility，在模拟器上可以使用，一旦预览，真机，就没有用了

[图片] [图片] 最近本人在开发一个新项目的时候，注意到官方在2.9.0开始支持了一个canvas 2D的新API，同时对webGL上支持也有了很大的改进，相信很多人用canvas的组件做一些分享海报，战绩和新闻帖功能。 [图片] 这里是新的引入方式。 官方文档地址： https://developers.weixin.qq.com/miniprogram/dev/component/canvas.html 那么新的canvas2D API有啥好处呢？ 原本的API微信有做一定的修改，现在全面支持源生H5 JS的写法，迁移H5的老代码变成更加容易，学习成本更低 修复了一些诡异的BUG，例如原本在IOS早期版本写法顺序会导致clip()图片裁切失效等~ 性能上的优化和提升，复杂动画上帧数明显 举例写法上的一些改变： 1、设置font的写法： [代码]//原本（传值的写法） ctx.setFontSize(20); ctx.fillText('MINA', 100, 100) ctx.draw() //现在（和源生H5写法一致，赋值） ctx.font = "16px"; ctx.fillStyle = 'blue'; //可以直接写颜色，原本的不支持 //不需要 ctx.draw() [代码] 2、获取并添加图片写法： [代码]//原本 //使用的是 wx.getImageInfo的方法 wx.getImageInfo({ src: mainImg,//服务器返回的图片地址 success: function (res) { console.log(res); ctx.drawImage(res.path, 0, 0); ctx.draw(true); }, fail: function (res) { //失败回调 } }); //现在 //可以直接img.onload调用 const headerImg = canvas.createImage(); headerImg.src = headImage;//微信请求返回头像 headerImg.onload = () => { ctx.save(); ctx.beginPath()//开始创建一个路径 ctx.arc(38, 288, 18, 0, 2 * Math.PI, false)//画一个圆形裁剪区域 ctx.clip()//裁剪 ctx.drawImage(headerImg,0,0); ctx.closePath(); ctx.restore(); } [代码] 3、将canvas生成虚拟地址便于下载(重点)： [图片] 由于官方文档没有写清楚，误导了挺多人的。这里canvas对象必须通过选择器获取，并获得对应的node节点。 [代码]async saveImg() { let self = this; //这里是重点 新版本的type 2d 获取方法 const query = wx.createSelectorQuery(); const canvasObj = await new Promise((resolve, reject) => { query.select('#posterCanvas') .fields({ node: true, size: true }) .exec(async (res) => { resolve(res[0].node); }) }); console.log(canvasObj); wx.canvasToTempFilePath({ //fileType: 'jpg', //canvasId: 'posterCanvas', //之前的写法 canvas: canvasObj, //现在的写法 success: (res) => { console.log(res); self.setData({ canClose: true }); //保存图片 wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success: function (data) { wx.showToast({ title: '已保存到相册', icon: 'success', duration: 2000 }) // setTimeout(() => { // self.setData({show: false}) // }, 6000); }, fail: function (err) { console.log(err); if (err.errMsg === "saveImageToPhotosAlbum:fail auth deny") { console.log("当初用户拒绝，再次发起授权") } else { util.showToast("请截屏保存分享"); } }, complete(res) { wx.hideLoading(); console.log(res); } }) }, fail(res) { console.log(res); } }, this) }, [代码] 分享个canvas海报的代码片段： [图片] 片段名： PoCf4emw7TgE 片段link： https://developers.weixin.qq.com/s/PoCf4emw7TgE [图片] [图片] 总结，相对之前还要看官方文档的canvas自定义API，现在写起来更加的方便，老代码迁移起来得心应手，只要你之前会canvas，那么各种效果和动画，拿来就怼，没什么大问题~ 一些奇怪的问题（注意！！！） canvas 2d 目前（2020年4月3日）还不支持真机调试，会报错！！！ IDE工具 1.02.2003190 直接保存新版本canvas的API图片是打不开的，但是直接用手机保存在相册是没问题的，请更新到1.02.2003250 最新版即可解决~ 一些老款手机用新的API保存图片会有报错问题，如华为NOTE10，请更新系统到能支持的最新，且微信也是，即可解决~ 部分Android设备诡异的闪退和报错 [图片] 这种有可能是代码写法的问题，比如： [代码]//缺省写法 会导致部分Android机器 闪退 ctx.font = "bold 16px"; ctx.fillStyle = "#000" //在canvas 2D的写法中，所以写法必须规范且完整 ctx.font = "normal bold 12px sans-serif"; ctx.fillStyle = '#707070'; [代码] 所以在canvas 2D 的环境，所以写法必须原始且规范，不能用缺省写法，不然就会有诡异的闪退/报错。 后续：官方在7.0.13的Android版本已修复。 https://developers.weixin.qq.com/community/develop/doc/00088c13e1437890692afd8d85ec00 看完觉得有帮助记得点个赞哦~ 你的赞是我继续分享的最大动力！^-^

canvas高清屏下绘制字体模糊， [图片] 在web上面可以通过 [代码]<[代码][代码]canvas[代码] [代码]width[代码][代码]=[代码][代码]"400"[代码] [代码]height[代码][代码]=[代码][代码]"400"[代码] [代码]style[代码][代码]=[代码][代码]"width:200px; height: 200px "[代码][代码]/>[代码]来解决。 小程序的canvas不支持width属性。  请问要怎么处理？ 还是小程序以后会支持 width属性？

h5中可以解决这个问题，但是在微信小程序中尝试了几种方法都没解决这个问题，方法如下： 1、canvas的宽高扩大2倍，然后通过css进行控制scale、zoom，来缩放          结果：开发工具中可以实现，真机不行，缩放样式不执行 2、创建两个canvas，canvas1正常宽度(展示图片)，canvas2宽高扩大2倍(导出图片)；          1)canvas2通过z-index改变层级，使得canvas2在canvas1下层         结果：开发工具中可以实现，真机不行          2)改变canvas2的opacity值         结果：开发工具中可以实现，真机不行 目前只想到这几种方法，求助大神们解决。 希望微信小程序能解决这个问题

overflow:hidden与transform同事使用会overflow失效，view中包含image，image不能被view 裁剪成圆形 [图片] [图片]

求解怎么设置画布大小  写在内联的大小只能是容器大小，只能显示画布的一部分  想缩小画布该怎么设置呢

背景 业务场景需要在小程序内生成活动的分享海报，图片中的某些数据需动态展示。可行的方案有️二： 服务端合成：直接返回给前端图片URL 客户端合成：客户端利用canvas绘制 在当前业务场景下，使用客户端合成会优于服务端合成，避免造成不必要的服务器CPU浪费。 下面主要谈谈**客户端（canvas）**合成的过程。 实现思路 小程序端发起请求，获取需动态展示的数据； 利用canvas绘制画布； 导出图片保存到相册。 小技巧&那些坑 理想很丰满，现实很骨感。 实现思路很简单，然而，在实现过程中，发现会趟一些坑，也有一些小技巧，遂记录下来，以供参考。 promise化 画布的绘制依赖系统信息（自适应和优化图片清晰度）和动态数据。故画布需要在所有前置条件都准备完成时，方可绘制。为了提高代码优雅度和维护性，建议用promise化，避免回调地狱（Callback Hell）。 [代码] let promise1 = new Promise((resolve, reject) => { this.getData(resolve, reject) }); let promise2 = new Promise((resolve, reject) => { this.getSystemInfo(resolve, reject) }); Promise.all([promise1, promise2]).then(() => { this.drawCanvas() }).catch(err => { console.log(err) }); [代码] 自适应 1、为了在各个机型下保持大小自适应，需要计算出缩放比： [代码] getSystemInfo(resolve, reject) { try { const res = wx.getSystemInfoSync() //缓存系统信息 systemInfo = res //这里视觉基于iPone6(375*667)设计，2x图视觉，可以填写750，1x图视觉，可以填写375 zoom = res.windowWidth / 750 * 1 resolve() } catch (e) { // Do something when catch error reject("获取机型失败") } } [代码] 2、绘制时进行按缩放比进行缩放，如： [代码]ctx.drawImage(imgUrl, x * zoom, y * zoom, w * zoom, h * zoom) [代码] 绘制网络图片 经测试，绘制CDN图片需要先将图片下载到本地，在进行绘制： [代码]wx.downloadFile({ url: imgUrl, success: res => { if (res.statusCode === 200) { ctx.drawImage(res.tempFilePath, 326 * zoom, 176 * zoom, 14 * zoom, 14 * zoom) } } }) [代码] 绘制base64图片 因为业务上某些原因，依赖的图片数据，后端只能以base64格式返回给前端，而小程序在真机上无法直接绘制（开发工具OK）。 解决思路（存在兼容性问题，fileManager**基础库 1.9.9 **开始支持）： 1、调用fileManager.writeFile存储base64到本地； 2、绘制本地图片。 实现代码如下： [代码]// 先获得一个文件实例 fileManager = wx.getFileSystemManager() // 把图片base64格式转存到本地，用于canvas绘制 fileManager.writeFile({ filePath: `${wx.env.USER_DATA_PATH}/qrcode.png`, data: self.data.qrcode, encoding: 'base64', success: () => { //此处需先调用wx.getImageInfo，方可绘制成功 wx.getImageInfo({ src: `${wx.env.USER_DATA_PATH}/qrcode.png`, success: () => { //绘制二维码 ctx.drawImage(`${wx.env.USER_DATA_PATH}/qrcode.png`, 207 * zoom, 313 * zoom, 148 * zoom, 148 * zoom) ctx.draw() } }) } }) [代码] 保存到本地相册 wx.saveImageToPhotosAlbum这个API需用户授权，故开发者需做好拒绝授权的兼容。此处实现对拒绝授权的场景进行引导。 [代码]canvas2Img(e) { wx.getSetting({ success(res) { if (res.authSetting['scope.writePhotosAlbum'] === undefined) { //呼起授权界面 wx.authorize({ scope: 'scope.writePhotosAlbum', success() { save() } }) } else if (res.authSetting['scope.writePhotosAlbum'] === false) { //引导拒绝过授权的用户授权 wx.showModal({ title: '温馨提示', content: '需要您授权保存到相册的权限', success: res => { if (res.confirm) { wx.openSetting({ success(res) { if (res.authSetting['scope.writePhotosAlbum']) { save() } } }) } } }) } else { save() } } }) function save() { wx.canvasToTempFilePath({ x: 0, y: 0, width: 562*zoom, height: 792*zoom, destWidth: 562*zoom*systemInfo.pixelRatio, destHeight: 792*zoom*systemInfo.pixelRatio, fileType: 'png', quality: 1, canvasId: 'shareImg', success: res => { wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success: () => { wx.showModal({ content: '保存成功', showCancel: false, confirmText: '确认' }) }, fail: res => { if (res.errMsg !== 'saveImageToPhotosAlbum:fail cancel') { wx.showModal({ content: '保存到相册失败', showCancel: false }) } } }) }, fail: () => { wx.showModal({ content: '保存到相册失败', showCancel: false }) } }) } [代码] 导出清晰图片 wx.canvasToTempFilePath有destWidth（输出的图片的宽度）和destHeight（输出的图片的高度）属性。若此处以canvas的宽高去填写的话，在高像素手机下，导出的图片会模糊。 原因：destWidth和destHeight单位是物理像素（pixel），canvas绘制的时候用的是逻辑像素（物理像素=逻辑像素 * density），所以这里如果只是使用canvas中的width和height（逻辑像素）作为输出图片的长宽的话，生成的图片width和height实际上是缩放了到canvas的 1 / density大小了，所以就显得比较模糊了。 这里应该乘以设备像素比，实现如下： [代码]wx.canvasToTempFilePath({ x: 0, y: 0, width: 562*zoom, height: 792*zoom, destWidth: 562*zoom*systemInfo.pixelRatio, destHeight: 792*zoom*systemInfo.pixelRatio, fileType: 'png', quality: 1, canvasId: 'shareImg' )} [代码] 特殊字体的绘制 研究发现，目前小程序canvas无法支持设置特殊字体，而业务生成的海报，又期望以特殊字体去呈现，最终取了个折中方案——保留数字部分的特殊样式。 实现方式为：把0-9这10个数字单独切图，用ctx.drawImage API，以图片形式去绘制。 [代码]drawNum(num, x, y, w, h) { return new Promise(function (resolve, reject) { //这里存储0-9的图片CDN链接 let numMap = [] wx.downloadFile({ url: numMap[num], success: res => { if (res.statusCode === 200) { ctx.drawImage(res.tempFilePath, x * zoom, y * zoom, w * zoom, h * zoom) resolve() } }, fail: () => { reject() } }) }) } [代码] 安卓机型图片绘制锯齿化问题 测试发现，同样的绘制方案，在安卓下，调用ctx.drawImage方法，图片会出现锯齿问题。测试还发现，原像素越高，锯齿化程度降低（但业务上使用太大像素的素材也不合理），这里需要客户端底层进行优化，目前没有找到合适的解决方案。 总结 个人觉得，目前小程序canvas就底层能力上相比web还有一些不足。所以应注意两点： 提前从业务出发，考虑当前实现的可行性，以便采取更优方案（如特殊字体，像素要求等）； 若绘制canvas导出图片是个高频场景，可参考html2canvas进行封装，以便提高效能（SelectorQuery节点查询需1.9.90以上）。 ps:之前有想过利用web-view方式，在传统网页去绘制，然后通过web-view和小程序的通信来实现的方式。时间原因，并未尝试，感兴趣同学可以尝试下。

现在小程序的canvas只支持style的width和height，不支持标签的width和height。 这两个有很大区别，标签的width和height表示画布的大小，style表示页面上显示的大小 显示大小不等同于画布大小 最直接的影响就是2倍和3倍屏的优化，画布大小至少要是显示大小的2倍或则3倍

canvasPutImageData在开发工具中可以在canvas上输出图片，但是真机无法输出。 尝试在putImageData前清空画布，回调函数中setTimeOut一段时间再绘制，依旧无法生成，请检查，谢谢。 wx.canvasGetImageData({ canvasId: 'picEffect', x: 0, y: 0, width: that.data.picWidth, height: that.data.picHeight, success:function(res){ var data=res.data; if (imgData.length > 0) { data = imgData; } else { imgData=res.data; } var result=new Uint8ClampedArray(res.data.length); ……………… } var ctx = wx.createCanvasContext('picEffect'); ctx.clearRect(0,0,that.data.picWidth,that.data.picHeight); ctx.draw(true, setTimeout(function () { wx.canvasPutImageData({ canvasId: 'picEffect', data: result, x: 0, y: 0, width: that.data.picWidth, height: that.data.picHeight, success: function (res) { console.log(res); wx.hideLoading(); }, fail: function (res) { console.log(res); } })},100)); }

在做一个canvas的练习，想做一个画图，其中撤销的这个功能，  我看到有用  wx.drawCanvas   但是没找到，  也发现有  save() 和 restore() ， 自己试了半天，  动态画图，回不到上一步，   也看到使用 putImageData 请问 有人麻烦帮忙解答 关于canvas 画图  返回上一步的  过程么？ 谢谢~

第一个问题: 2.8.0以上用wx.canvasGetImageData报如下错误 errMsg: "canvasGetImageData: fail canvas is empty" https://developers.weixin.qq.com/s/bzwfgsmg7ghm 第二个问题: 用ctx.getImageData(0, 0, 200, 200)可以获取到数据,但是感觉只能获取1/4canvas的范围. 图像大小都是200x200,h5网页版是可以获取全的. [图片] 以上是用getImageData获取的图 https://developers.weixin.qq.com/s/vAwkbsme7Ch1

ImageData，CanvasContext能直接获取ImageData吗？ 在什么时候获取？

2d类型的canvas，putImageData在真机预览时不管用。开发工具里是可以的。线上未知。。 代码片段