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

[kisshere]

今天在 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]

不错，收藏了

[ragnaroks]

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

[Reign]

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

[hst001]

收藏，谢谢楼主

[hst001]

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

[wjm2038]

坏了。。。 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]

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

[pheyer]

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

[pheyer]

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

[kisshere]

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

[ragnaroks]

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