今天在爱范儿上看到一个网站，深感 HTML5 当前在全世界为何如此牛逼哄哄

今天在 ifanr 上看到一个网站 www.iconninja.com ，最初觉得这个网站图标资源确实挺丰富的，而且提供了图标下载一条龙的服务，用了它的 css sprites generator ，才感觉作者的牛叉之处：他用 HTML5 的 canvas 居然做出了一个可以勾勒出 png 图片 css sprite 坐标的在线工具！地址： http://www.iconninja.com/css-sprites-generator
当用户在这个网站选中图标后，通过这个工具，你只需要选中一个区域，它便自动缩小“吸附”将这个区域的图标， sprite 的坐标在下方显示出来，而且你还可以自由放大缩小每个图标尺寸，右键删除该图标，自由拖动图标，左上角导入图片，前端开发者的福利啊，感觉 HTML5 为何如此牛叉，小白真心求教：这个到底是利用了 HTML5 canvas 的哪个 api 啊？

alwayshere

2016 年 12 月 14 日

不错，收藏了

ragnaroks

2016 年 12 月 15 日

可以,做 html5 小游戏可以省去自己合成精灵图了

Reign

2016 年 12 月 15 日

的确挺智能一个工具，收藏了，感谢楼主分享

hst001

2016 年 12 月 15 日

收藏，谢谢楼主

hst001

2016 年 12 月 15 日

看了下，应该就是很单纯的像游戏开发那样实现

wjm2038

2016 年 12 月 16 日

坏了。。。 Warning: copy(/home/wwwroot/www.iconninja.com/web/application/views/default/spritecow.m.php): failed to open stream: No such file or directory in /home/wwwroot/www.iconninja.com/web/system/controller.php on line 65 Warning: file_get_contents(/home/wwwroot/www.iconninja.com/web/runtime/tpl/default/spritecow.m.php): failed to open stream: No such file or directory in /home/wwwroot/www.iconninja.com/web/system/controller.php on line 68 Warning: include(/home/wwwroot/www.iconninja.com/web/application/views/default/spritecow.m.php): failed to open stream: No such file or directory in /home/wwwroot/www.iconninja.com/web/system/controller.php on line 102 Warning: include(): Failed opening '/home/wwwroot/www.iconninja.com/web/application/views/default/spritecow.m.php' for inclusion (include_path='.:') in /home/wwwroot/www.iconninja.com/web/system/controller.php on line 102

pheyer

2016 年 12 月 16 日

确实很强大的，以后可以用用。
不过我有一个问题，下载下来只有一个大图片，但是并没有什么东西告诉我每个小图片的位置和坐标，这叫我怎么用？

pheyer

2016 年 12 月 16 日

@ragnaroks 一般做游戏的都是先用小图的，然后有工具自动合成精灵图吧？

pheyer

2016 年 12 月 16 日

另外，自动合成精灵图是能够通过程序算出最优大小的吧

kisshere

2016 年 12 月 16 日

@pheyer 我都说了用鼠标选中勾勒啊下面自动显示坐标了

ragnaroks

2016 年 12 月 16 日

@pheyer 那是在有工具链的情况下,在"H5"还没完善前,做页游加载 dds 文件都够喝一壶了何况还得去拼接 dds

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://v2ex.xtra.eu.org/t/327675

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.