原文：使用HTML5的canvas做图片剪裁
前言 图片裁剪上传，不仅是一个很贴合用户体验的功能，还能够统一特定图片尺寸，优化网站排版，一箭双雕。 需求就是那么简单，在浏览器里裁剪图片并上传到服务器。 我第一个想到的方法就是，将图片和裁剪参数 x，y，scale，rotate 一并上传给服务器，服务器来做图片处理，so easy。但是，这并不符合潮流发展的方向：能在前端做的处理，就放前端做吧。与潮流妥协的结果就是，前端越来越复杂。 一开始我并 ...
2017-04-06 17:20 0 1436 推荐指数：
相关推荐
日期：2013-5-23 来源：GBin1.com 本文来自极客标签社区用户webgeek的一个在线HTML5web开发小技巧，帮助你使用html5的画布功能来切割用户上传的大头照。 在线调试 例如需要剪裁的图片如下： 用来处理大头照的JS代码如下： 这个简单 ...
主要是通过一张图片的方式来模拟一下。 我这里认为大家都稍微了解甚至熟悉canvas的一些AP ...
之前一直想使用HTML5技术全新做一套地图API，可是苦于时间和精力，迟迟未有行动。后来下定决心，利用下班和周末做出一个大体框架出来，现在和网友分享一下自己的整体的一个思路和想法。欢迎大家提出宝贵建议，希望把这套API做的更好，有人真正利用起来。DEMO访问地址， 猛击 ...
上一篇也说到瓦片，我们为什么使用瓦片？这一篇主要是关于如何拼接地图？ 下面的一张图，可以一眼明了，地图是如何切割以及拼接的。 瓦片信息 瓦片信息包括切图原点，瓦片大小，格式 ...
注意：本文属于《html5 Canvas绘制图形入门详解》系列文章中的一部分。如果你是html5初学者，仅仅阅读本文，可能无法较深入的理解canvas，甚至无法顺畅地通读本文。请点击上述链接以了解使用html5 canvas绘制图形的完整内容。 在html5中，除了利用canvas绘制矢量图 ...
2013年的时候曾经使用canvas实现了一个擦除效果的需求，即模拟用户在模糊的玻璃上擦除水雾看到清晰景色的交互效果。好在2012年的时候学习HTML5的时候研究过canvas了，所以在比较短的时间内实现了一个方案【下文方案一】，后来继续探索之后进一步更新了这个方案【下文方案二】，提高了 ...
<!doctype html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>canvas导入序列帧</title> </head> ...