/chengji

Primary LanguageHTML

生成高考成绩单H5页面

该项目是在2017年高考放榜前两天突然想到，可以尝试通过H5技术，生成高考成绩单玩一玩，主要也是自己在运营着一个公众号，想通过该项目，尝试引爆自己的公众号粉丝数量。 最终该项目一天内上线，给我的公众号带来了500的粉丝量和700多的转发量，想想也是意外，因为没有通过推广，只是发在了自己的朋友圈还有几个微信群而已。 由于需要紧急上线，没有太多的时间能去部署到服务器等等原因，然后也没试过H5开发，就上网查阅了一下资料，然后就决定采用静态页面的写法。

项目地址：https://pandakill.github.io/chengji/new_index.html

项目结构：

  • new_index.html ： 可以输入姓名、学习等级等信息
  • picture.html ： 根据填写的资料，生成成绩单

技术点：

  1. js本地解析scheme，获取参数
  2. 利用canvas在网页上进行图片绘制

项目不足的地方：

  1. 在成绩单盖章的地方，会偶尔出现盖章不成功（即不显示盖章图片）的情况
  2. 由于没有导入字体库的问题，填写的资料渲染到图片上的时候，会出现字体是跟随本地系统的字体，与图片原先其他的字体不同