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

标签 javascript drag-and-drop html5-canvas kineticjs

是否可以在 html5 canvas 中传播图像.. 比如说我有 2,3 个形状..比如一个矩形、一个圆形和一些正方形以及一些随机的不成比例的形状.. 我有一个图像列表..它们是纹理,不完全是颜色,只是纹理,如果我点击一个,我希望它散布在任何形状内(相应地变换自身而不扭曲表面) 可能通过映射坐标然后展开图像或将其相乘.. 有什么办法吗? 当然在 html5 canvas 里面 这有点难以解释,但如果有人对此有任何想法,那么一些指示会很好​​..

问候, 阿希什

最佳答案

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

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

可能有用的链接:

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

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

关于javascript - 在 html5 Canvas 中的形状内传播图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10087308/

相关文章:

javascript - 如何访问另一个原型(prototype)对象的变量

javascript - 如果其他 div 不可见,则淡入 div

objective-c - Cocoa:如何在拖动时变形拖动图像

html - 更改 HTML5 拖放文件的鼠标光标(GMail 拖放)

javascript - HTML5 Canvas 上的drawImage 不起作用

javascript - Fabric.js 使用插入的图像加载 json 会破坏 Canvas

javascript - HTML Keydown 事件即使在举行时也只发生一次吗?

php - 运行后从 php 文件运行 Javascript

python - 在 wxPython 中跨面板拖放图像

JavaScript左右点击功能