javascript - 在 html5 画布中的形状内传播图像

Question

是否可以在 html5 画布内传播图像.. 比如说我有 2,3 个形状.. 像一个矩形一个圆形和一些正方形和一些随机的不成比例的形状.. 我有一个图像列表.. 它们是纹理不完全是颜色只是纹理，如果我点击一个我希望它在任何形状内传播（相应地变换自身而不扭曲饰面）可能通过映射坐标然后传播图像或乘以它..有什么办法吗所以？？当然，在 html5 画布中解释起来有点困难，但如果有人对此有任何想法，那么一些指针会很好..

问候， 阿希什

Answer 1

首先，您必须保存形状的坐标并点击测试您的鼠标点击以查找匹配项。

要使用图像填充形状，请使用带有参数“repeat”的 createPattern 函数。为您的图案定义 fillstyle 属性，并根据形状的坐标进行填充。

可能有用的链接：

http://www.tutorialspoint.com/html5/canvas_pattern_shadow.htm

http://simonsarris.com/blog/140-canvas-moving-selectable-shapes