步骤 1: 在 HTML 中设置画布，创建一个引用，并获取上下文对象
步骤 2: 绘制矩形、直线、贝塞尔曲线、圆和形状
步骤 3: 显示位图图像
步骤 4: 渐变
步骤 5: 动画
步骤 6: 更多 HTML5 画布提示
Canvas是一个二维坐标系，定位是以像素为单位，基于x，y坐标构建，原点坐标位于左上角。x轴沿着水平方向向右延伸，越往右，x越大，y轴沿垂直方向向下延伸，越往下，y越大。
即使坐标位于画布范围之外，也同样有效。可能我这样说也不太好懂，你可以去土豆搜一下“HTML5 矢量绘图新功能- Canvas 基本用法”
百度地图，高德地图，腾讯地图以及谷歌中国区地图。高德地图，腾讯地图以及谷歌中国区地图使用的是GCJ-02坐标系。百度地图使用的是BD-09坐标系。底层接口(HTML5Geolocation或ios，安卓API)通过GPS设备获取的坐标使用的是WGS-84坐标系。
不同的坐标系之间可能有几十到几百米的偏移，所以在开发基于地图的产品，或者做地理数据可视化时，我们需要修正不同坐标系之间的偏差。在中国地区(包括港澳台)，百度地图采取的是BD09坐标系。海外地区，目前采用的是WGS84（墨卡托）坐标。
