smartcrop.js 介绍
在很多项目开发中，经常会遇见 上传 图片 的场景，它可能是 用户 照片信息，也可能是商品 图片 等。然而在网页布局中，为了更好的 用户 体验，它们往往都需要一些宽度和高度的限制。对于不合适的 图片 ，常常需要为 用户 提供一种裁剪方式，以此来满足网站更好的 用户 体验。但是 图片 默 认的裁剪区域往往被 显示 在 一个 固定的位置，而这个位置却往往又不是精准的 用户 裁剪位置 ?。
smartcrop.js 组件的原理大致是根据颜色饱和度进行范围扩散裁剪。这是js实现的算法，读像素点的颜色然后根据特定的算法（比如算色差，渐变度等）找出可能是重点的部分。
Smartcrop.js使用相当愚蠢的图像处理。简而言之：
使用laplace查找边缘
使用皮肤等颜色查找区域
找到饱和度较高的区域
按选项指定的区域提升区域（例如检测到的面部）
使用滑动窗口 生成 一组候选作物
使用重要性 函数 对它们排序，以将细节集中在中心并避免它在边缘。
输出 最高等级的候选作物
我们可以使用npm install smartcrop或者bower install smartcrop来下载它。然后像如下方式使用它：?
SmartCrop.crop(image,{
width: 100,
height: 100
},
function(result){
console.log(result); // {topCrop: {x: 300,y: 200,height: 200,width: 200}}
});
它会 输出 一个 比较好的最佳 图片 裁剪位置，如{topCrop: {x: 300,width: 200}}的数据。
?
网站地址 : https://29a.ch/2014/04/03/smartcrop-content-aware-image-cropping
GitHub: https://github.com/jwagner/smartcrop.js
网站描述: 内容 感知的 图片 裁剪
smartcrop.js官方网站
官方网站： https://29a.ch/2014/04/03/smartcrop-content-aware-image-cropping
如果觉得 网站内容还不错，欢迎将 网站 推荐给程序员好友。