Select Git revision
blobs_diff_img_dilatation_erosion.html
-
Marius Bilasco authoredMarius Bilasco authored
blobs_diff_img_dilatation_erosion.html 2.42 KiB
<html>
<head>
<script lang="js" src="../tools.js"></script>
<script lang="js" src="../processing2.js"></script>
<script lang="js" src="../movement/difference.js"></script>
<script lang="js" src="../effects/focus.js"></script>
<script lang="js" src="../metrics/generic.js"></script>
<script lang="js" src="../metrics/pixels.js"></script>
<script lang="js" src="../effects/generic.js"></script>
<script lang="js" src="../effects/morpho.js"></script>
<script lang="js" src="../filters/morpho.js"></script>
<script lang="js" src="../filters/linear.js"></script>
<script lang="js" src="../segmentation/blobs.js"></script>
</head>
<body>
<img id="input" src="../data/16_03.jpg" width="320" height="180"></img>
<canvas id="output1" width="320" height="180"></canvas><br></br>
<canvas id="output2" width="320" height="180" style="display:none"></canvas>
<canvas id="output3" width="320" height="180"></canvas>
<canvas id="output4" width="320" height="180"></canvas>
<script lang="javascript">
var _focus_options={focus_x:50,focus_y:50,focus_dx:5,focus_dy:5,focus_radius:50,width:320,height:180};
var _task1=new focus.MovingFocus(_focus_options);
var _proc1=new processing2("input",_task1,"output1");
var _opt_options={width:320,height:180};
var _task2=new diff.NormalizedDifferenceImageRGB(_opt_options);
var _proc2=new processing2("output1",_task2,"output2");
var _opt_options={dilatation_width:8,dilatation_height:8,
erosion_width:2,erosion_height:2};
var _task3=new morpho_effects.DilatationErosionWindow(_opt_options);
var _proc3=new processing2("output2",_task3,"output3");
var _opt_options={metric:pixel_metrics.visible_edist,threshold:0};
var _task4=new blobs.Pixel8ConnectivityBlobs(_opt_options);
var _proc4=new processing2("output3",_task4,"output4");
var img_elt=document.getElementById("input");
img_elt.addEventListener("loadeddata",function(){
_task2.set_first_frame_from_eltId("input");
});
var count=0;
var cvs4=document.getElementById("output4");
var cvs4_ctxt=cvs4.getContext("2d");
var loop=function() {
_proc1.do_process();
_task1.updateFocus();
_proc2.do_process();
_proc3.do_process();
cvs4_ctxt.beginPath();
cvs4_ctxt.clearRect(0,0,cvs4.width,cvs4.height);
_proc4.do_process();
count++;
if (count<1000)
setTimeout(loop,200);
}
loop();
</script>
</body>
</html>