微信小程序实现 用canvas 生成图片 并保存

需求:小程序获取到微信头像和昵称,生成2019年随机发生的趣事

ui:

微信小程序实现 用canvas 生成图片 并保存_第1张图片

点击保存生成的图片:

微信小程序实现 用canvas 生成图片 并保存_第2张图片

 

实现还是很简单的,直接上代码:

html:

css:

微信小程序实现 用canvas 生成图片 并保存_第3张图片

js:

1、定义全局canvas

2、设置所需要的参数

微信小程序实现 用canvas 生成图片 并保存_第4张图片

3、获取后台的数据为绘画做准备

微信小程序实现 用canvas 生成图片 并保存_第5张图片

4、用canvas绘画

微信小程序实现 用canvas 生成图片 并保存_第6张图片

微信小程序实现 用canvas 生成图片 并保存_第7张图片

5、调用上面请求的数据

微信小程序实现 用canvas 生成图片 并保存_第8张图片

6、保存图片

微信小程序实现 用canvas 生成图片 并保存_第9张图片

写的不是很好,希望对于新手朋友们有一定的帮助。

你可能感兴趣的:(微信小程序,用canvas生成图片)