<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>smartcrop.js testbed</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel=stylesheet href=css/style.css>
<script src="js/jquery-1.10.2.js"></script>
</head>
<body>
<h1>smartcrop.js testbed</h1>
<p>smartcrop.js is a content aware image cropping library. On this page you can test it with your own images. You can learn more about the library on it's <a href="https://github.com/jwagner/smartcrop.js/">github page</a>.</p>
<div>
<form>
<div class=drop>
<h2>Drop images on this page to analyze them.</h2>
<input type=file name=file accept="image/image/png,image/jpg,image/gif,image/JPEG" />
</div>
<label>Width<div><input name=width type="range" min=50 max=500 step=1 value=250 /><span class=value>250</span>px</div></label>
<label>Height<div><input name=height type="range" min=50 max=500 step=1 value=250 /><span class=value>250</span>px</div></label>
<label>minScale<div><input name=minScale type="range" min=0.5 max=1.0 step=0.1 value=1 /><span class=value>1.0</span></div></label>
<p><label>Rule of thirds<input name=ruleOfThirds type="checkbox" value=1 checked /></label></p>
<p><strong>Face Detection</strong></p>
<div><label><input name=faceDetection type=radio value=off checked />Off</label></div>
<div><label><input name=faceDetection type=radio value=jquery />Use <a href="http://facedetection.jaysalvat.com/">jquery.facedetection</a></label></div>
<div><label><input name=faceDetection type=radio value=tracking />Use <a href="https://trackingjs.com/">tracking.js</a></label></div>
<div><label class=opencv-loading><input name=faceDetection type=radio value=opencv disabled />Use <a href="https://opencv.org/">opencv.js</a></label></div>
</form>
</div>
<div class=output>
<canvas id="c"></canvas>
</div>
<div class=sidebar>
<div id=debug></div>
<h4>All Crops</h4>
<div class=crops>
</div>
</div>
<script src=js/jquery.js></script>
<script src=js/underscore.js></script>
<script src="js/smartcrop.js"></script>
<script src=js/smartcrop-debug.js></script>
<script src=js/tracking-min.js></script>
<script src=js/tracking-face-min.js></script>
<script src=js/jquery.facedetection.min.js></script>
<script src=js/testbed.js></script>
<script async src="js/opencv.js" integrity="sha384-ucXOxPgA5tSKdaZgFD+5C0lAJeavjW31veENhNvOwsTjgx8waDD0s1QcMdUxhlxk" crossorigin="anonymous" onload="openCvReady()"></script>
<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-5205069-2']);
_gaq.push(['_setDomainName', '29a.ch']);
_gaq.push(['_setSiteSpeedSampleRate', 50]);
_gaq.push(['_trackPageview']);
</script>
<script src="js/ga.js" async></script>
</body>
</html>
基于smartcrop.js智能剪裁 带人脸识别
需积分: 20 154 浏览量
2018-05-21
15:44:07
上传
评论
收藏 1.99MB ZIP 举报
29a.ch.zip （14个子文件） 
29a.ch 
index.html 3KB js 
tracking-min.js 20KB opencv.js 7.58MB tracking-face-min.js 178KB jquery.facedetection.min.js 203KB ga.js 45KB jquery.js 267KB underscore.js 14KB testbed.js 7KB uploadimg.js 3KB jquery-1.10.2.js 294B smartcrop.js 17KB smartcrop-debug.js 2KB css style.css 3KB资源评论
