如何使用javascript从图像创建拼图 [英] How to create jigsaw puzzle from an image using javascript

查看:157
本文介绍了如何使用javascript从图像创建拼图的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我google了,但没有找到一个好的答案。具体来说,我想学习:




  • 将图片切成曲线

  • 对我有用[0]丢个板砖[0]引用举报发新话题发新话题发新话题发新话题发短消息加为好友当前离线

    解决方案

    这个拼图有几个部分。 :)



    第一部分是SVG及其Canvas。这就是你需要画出来的,因为否则你不能做出一个弯曲的图片。使用标准HTML / CSS只能使用矩形。



    第二部分是从图片中生成拼图的算法。如果你不能自己弄明白(虽然看起来不复杂),Google应该帮助你。



    其他应该很简单。 p>

    已添加:快速 Google搜索在第一个结果中提供了这样的拼图引擎。请查看其来源


    I googled it but didn't find a good answer. Specifically, I want to learn:

    • to slice an image into curved pieces
    • to create individual objects from those pieces (i assume that i need this to reassemble)

    thanks.

    解决方案

    There are several pieces to this puzzle. :)

    The first piece is SVG and its Canvas. That's what you'll need to draw, because otherwise you can't make a curved piece out of a picture. Only rectangles are possible with standard HTML/CSS.

    The second piece is an algorithm for generating jigsaw pieces from the picture. Google should help you with that if you can't figure one out by yourself (though it doesn't seem very complicated).

    The rest should be straightforward.

    Added: A quick Google search gave just such a jigsaw engine in the first result. Check out the source of that.

    这篇关于如何使用javascript从图像创建拼图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆