Все пиксели на рисунке рядом с которыми одинаковые становятся прозрачными. Применить можно для получения контура из силуэта.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style>
body{text-align: center;font-size:20px; }
#files{
width:300px;
cursor:pointer;
background:#ddc;
position:absolute;
font-size:20px;
top:50px;
left:200px;
}
#копир{display:none;}
#канва{
top:0px;
left:0;
position:absolute;
z-index:2;
}
#контур{ position:absolute;
top:100px;
left:300px;
}
</style>
</head>
<body>
<input type="file" id="files">
<div style=' width:300px; cursor:pointer;background:#ddc;position:absolute;font-size:20px;top:0;left:0;'onclick="document.location='http://clecar.ru'">Мой сайт</div>
<div id='контур'>
<img src='' id='копир'/>
<canvas id= 'канва' width='1' height='1'></canvas >
</div>
<div id='инф'style='' >0</div>
</body>
<script >
var и=document.all;
и('files').addEventListener('change', handleFileSelect, false);
document.ondragstart = function(){return false;}
document.body.onselectstart = function(){return false;}
function handleFileSelect(evt) {
var files = evt.target.files;
for (var i = 0, f; f = files[i]; i++) {
if (!f.type.match('image.*')) { continue; }
var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
и.копир.src= e.target.result;
и.files.value='';
}
})(f);reader.readAsDataURL(f);}
}
и.копир.onload = function(){
var т=parseInt(и.копир.width);
var в=parseInt(и.копир.height);
и.канва.width=т;
и.канва.height=в;
рис=и.канва.getContext("2d");
рис.drawImage(и.копир, 0, 0,т,в);
весь=рис.getImageData(0,0,т,в);
цв=весь.data;
for(n=0,m=в*т*4; n<m; n+=4){
if((цв[n]==цв[n+4])&&(цв[n]==цв[n-4])&&(цв[n]==цв[n+т*4])&&(цв[n]==цв[n-(т*4)]) ){цв[n+3]=0 }
}
рис.putImageData(весь, 0, 0);
}
</script >
</html>