Study-Everyday

0507 ​

工作 ​

  • 一直在做关于前端图片加水印的需求
  • 总结：
    • 前端水印分为2种，一种是应用背景加水印，水印在用户登录的时候生成用户名、租户名等信息，作为背景图平铺在底层 div 上
    • 另一种是给图片加水印，用户上传图片的时候根据配置信息实时加水印存储
    • 这次做的是第二种：
      • 原理：使用 canvas 结合 fillText 生成小的水印图，然后使用 createPattern(canvas, 'repeat') 平铺在用户上传的资料上
      • 难点：水印倾斜后内容位置、宽度计算。因为限制30个字符的长度，图片大小不一，水印大小和水印内容字体大小是随着图片大小变化的，这里涉及一些数学计算处理。
      • 坑：一开始并不知道 canvas 可以使用 createPattern 这个 API 进行平铺，我是直接将整个画布进行旋转，平移，这里头的位置移动参数很难调，几乎快要无解。

学习 ​

反思 ​

  • 做的不好的
    • 没有做好今天工作和学习计划，时间管理没做好
    • 卡在一个问题上太久，应该及时寻求帮助和支持。
  • 如何改进：
    • 每天做好第二天的计划 todos，在合理范围内的任务项，尽可能达成，包括不限于：工作，学习，生活锻炼等。
    • 遇到技术问题不能解决时候，第一时间寻求支持。可能你认为的难题，人家大佬早就踩过坑了；或者你在做的事情已经有成熟的库支持，省时省力，只是你不知道而已。
    • 正确搜索：技术问题多用谷歌搜索和 github/npm 搜索，毕竟 talk is treap, show me the code!

好文推荐 ​

以下推荐来自 阮一峰周刊

Released under the MIT License.

Copyright © 2023-present Jsmond2016