文件名称:PS钢笔与魔棒工具ImageGrabber.zip
文件大小:306KB
文件格式:ZIP
更新时间:2022-08-07 07:01:04
开源项目
Image Grabber 是一个使用 Canvas 技术实现的 PS 钢笔与魔棒工具。在线演示操作说明:拖拽图片到浏览器窗口使用 和-进行缩放魔棒工具点击图片,使用Delete/Backspace键可以删除所选的像素钢笔工具绘制一个路径,按选项面板的Mask按钮可以只显示路径内的图像使用钢笔工具时可以配合Option/Alt键来操作节点和控制杆点击Save按钮会将当前画布状态输出成图片实现说明:魔棒工具的算法使用的是Flood Fill,用了Web Workers来做计算,尽可能保证界面的响应蚁线参考Code Pen的这个示例。当图像缩放到尺寸较大时有渲染性能问题钢笔工具为了方便判断,直线去曲线都是用bezierCurveTo方法来绘制,借鉴了Photoshop的交互,简化了组合键和选择交互Mask遮罩选项使用Canvas Global Composite Operation提供的destination-in方式来绘制 标签:ImageGrabber
【文件预览】:
image_grabber-gh-pages
----index.html(2KB)
----.nojekyll(0B)
----images()
--------placeholder_drop.png(7KB)
--------black_arrow.png(3KB)
--------zoom.png(3KB)
--------tools_selected_bg.png(2KB)
--------placeholder_drop@2x.png(15KB)
--------pen.png(10KB)
--------zoom_100.png(3KB)
--------pen_100.png(7KB)
--------magic_wand_100.png(7KB)
--------magic_wand.png(9KB)
--------black_arrow_100.png(3KB)
--------tools_selected_bg_100.png(2KB)
----js()
--------seajs()
--------app()
----test_assets()
--------IMG_4390.jpg(132KB)
--------sky.jpg(43KB)
--------black.png(3KB)
----sources()
--------placeholder.psd(324KB)
----README.md(1KB)
----css()
--------main.css(4KB)
--------reset.css(1KB)