核心知识
坐标系与 2D 上下文
原点在左上角，x 向右增加，y 向下增加；绘图命令由 context 执行。
- getContext('2d') 返回 2D 上下文
- 默认变换下，坐标单位对应画布内部像素；变换可改变映射
- 先建立坐标草图再写代码
const canvas = document.querySelector('#poster');
const ctx = canvas.getContext('2d');原点在左上角，x 向右增加，y 向下增加；绘图命令由 context 执行。
const canvas = document.querySelector('#poster');
const ctx = canvas.getContext('2d');