从今天开始我们聊一聊 Canvas 的API，因为Canvas的API较多，所以我们分为几次分享，首先分享的是裁剪类型的API使用。话不多说，先上实战图。 分享前，我们先来聊聊，在我们生活中如何绘制一张如下的图。 一张纸（Android 中的 canvas）：用来承载我们绘制的…

其实一开始也是想在网上找一下有没有相关的资料，但是可惜找不到，所以就自己慢慢的推出来了。我就举一下横坐标的例子吧！ 1. 先做出两个相同的元素，然后标记上坐标，并且设置容器属性overflow:hidden来隐藏溢出内容 ok，我们现在对比一下上面的结果，就会发现，放大3倍的时…

这些功能是用在前几天写的一个小程序上的，所以本文是以小程序为主要框架讲解。但其实你不懂小程序也没关系，懂js就可以啦，重点讲如何用canvas实现这些功能，学会活学活用运算canvas的坐标才是关键。😄 在拖拽组件内通过小程序的apiwx.createCanvasContex…

上一期的《canvas 基础及实现贝塞尔曲线动画》，我们回顾了 canvas 的基础操作和贝塞尔曲线实现原理；这一次，我们来补充下前一篇遗留下来的基础知识点之一：transform 变换矩阵。 setTransform(a, b, c, d, dx, dy) 方法会将当前的变形…

如果要计算坐标系的原点坐标，首先需要这两个基本要素。 从上面的示意图来看，需要这几个基本参数就可以计算出原点坐标。 那么对于三角形好像就没那么好定位点了，下面来看看理解图。 也就是说还需要定义一个三角形的大小值 arrowSize，通过最远点坐标和arrowSize就可以计算出…