Chiebot-Mirror
/
opencv
mirror of https://github.com/opencv/opencv.git
8
0
Fork 0
Code Issues Projects Releases Wiki Activity

Use horizontal input/output images layout in OpenCV.js tutorials

Browse Source
pull/9737/head
Ningxin Hu 7 years ago
parent 386f402e0c
commit 06d22af2bf
65 changed files with 1163 additions and 555 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 20
      doc/js_tutorials/js_assets/js_basic_ops_copymakeborder.html
  2. 20
      doc/js_tutorials/js_assets/js_basic_ops_roi.html
  3. 20
      doc/js_tutorials/js_assets/js_canny.html
  4. 20
      doc/js_tutorials/js_assets/js_colorspaces_cvtColor.html
  5. 20
      doc/js_tutorials/js_assets/js_colorspaces_inRange.html
  6. 20
      doc/js_tutorials/js_assets/js_contour_features_approxPolyDP.html
  7. 4
      doc/js_tutorials/js_assets/js_contour_features_area.html
  8. 20
      doc/js_tutorials/js_assets/js_contour_features_boundingRect.html
  9. 20
      doc/js_tutorials/js_assets/js_contour_features_convexHull.html
  10. 20
      doc/js_tutorials/js_assets/js_contour_features_fitEllipse.html
  11. 20
      doc/js_tutorials/js_assets/js_contour_features_fitLine.html
  12. 20
      doc/js_tutorials/js_assets/js_contour_features_minAreaRect.html
  13. 20
      doc/js_tutorials/js_assets/js_contour_features_minEnclosingCircle.html
  14. 4
      doc/js_tutorials/js_assets/js_contour_features_moments.html
  15. 4
      doc/js_tutorials/js_assets/js_contour_features_perimeter.html
  16. 20
      doc/js_tutorials/js_assets/js_contour_properties_transpose.html
  17. 20
      doc/js_tutorials/js_assets/js_contours_begin_contours.html
  18. 20
      doc/js_tutorials/js_assets/js_contours_more_functions_convexityDefects.html
  19. 23
      doc/js_tutorials/js_assets/js_contours_more_functions_shape.html
  20. 7
      doc/js_tutorials/js_assets/js_example_style.css
  21. 20
      doc/js_tutorials/js_assets/js_face_detection.html
  22. 20
      doc/js_tutorials/js_assets/js_filtering_GaussianBlur.html
  23. 20
      doc/js_tutorials/js_assets/js_filtering_bilateralFilter.html
  24. 20
      doc/js_tutorials/js_assets/js_filtering_blur.html
  25. 20
      doc/js_tutorials/js_assets/js_filtering_filter.html
  26. 20
      doc/js_tutorials/js_assets/js_filtering_medianBlur.html
  27. 20
      doc/js_tutorials/js_assets/js_fourier_transform_dft.html
  28. 20
      doc/js_tutorials/js_assets/js_geometric_transformations_getAffineTransform.html
  29. 20
      doc/js_tutorials/js_assets/js_geometric_transformations_resize.html
  30. 20
      doc/js_tutorials/js_assets/js_geometric_transformations_rotateWarpAffine.html
  31. 20
      doc/js_tutorials/js_assets/js_geometric_transformations_warpAffine.html
  32. 20
      doc/js_tutorials/js_assets/js_geometric_transformations_warpPerspective.html
  33. 20
      doc/js_tutorials/js_assets/js_grabcut_grabCut.html
  34. 20
      doc/js_tutorials/js_assets/js_gradients_Laplacian.html
  35. 30
      doc/js_tutorials/js_assets/js_gradients_Sobel.html
  36. 30
      doc/js_tutorials/js_assets/js_gradients_absSobel.html
  37. 34
      doc/js_tutorials/js_assets/js_histogram_backprojection_calcBackProject.html
  38. 20
      doc/js_tutorials/js_assets/js_histogram_begins_calcHist.html
  39. 20
      doc/js_tutorials/js_assets/js_histogram_equalization_createCLAHE.html
  40. 20
      doc/js_tutorials/js_assets/js_histogram_equalization_equalizeHist.html
  41. 20
      doc/js_tutorials/js_assets/js_houghcircles_HoughCirclesP.html
  42. 20
      doc/js_tutorials/js_assets/js_houghlines_HoughLines.html
  43. 20
      doc/js_tutorials/js_assets/js_houghlines_HoughLinesP.html
  44. 38
      doc/js_tutorials/js_assets/js_image_arithmetics_bitwise.html
  45. 20
      doc/js_tutorials/js_assets/js_image_display.html
  46. 20
      doc/js_tutorials/js_assets/js_morphological_ops_blackHat.html
  47. 20
      doc/js_tutorials/js_assets/js_morphological_ops_closing.html
  48. 20
      doc/js_tutorials/js_assets/js_morphological_ops_dilate.html
  49. 20
      doc/js_tutorials/js_assets/js_morphological_ops_erode.html
  50. 20
      doc/js_tutorials/js_assets/js_morphological_ops_getStructuringElement.html
  51. 20
      doc/js_tutorials/js_assets/js_morphological_ops_gradient.html
  52. 20
      doc/js_tutorials/js_assets/js_morphological_ops_opening.html
  53. 20
      doc/js_tutorials/js_assets/js_morphological_ops_topHat.html
  54. 20
      doc/js_tutorials/js_assets/js_pyramids_pyrDown.html
  55. 20
      doc/js_tutorials/js_assets/js_pyramids_pyrUp.html
  56. 22
      doc/js_tutorials/js_assets/js_setup_usage.html
  57. 38
      doc/js_tutorials/js_assets/js_template_matching_matchTemplate.html
  58. 20
      doc/js_tutorials/js_assets/js_thresholding_adaptiveThreshold.html
  59. 20
      doc/js_tutorials/js_assets/js_thresholding_threshold.html
  60. 30
      doc/js_tutorials/js_assets/js_trackbar.html
  61. 20
      doc/js_tutorials/js_assets/js_watershed_background.html
  62. 20
      doc/js_tutorials/js_assets/js_watershed_distanceTransform.html
  63. 20
      doc/js_tutorials/js_assets/js_watershed_foreground.html
  64. 20
      doc/js_tutorials/js_assets/js_watershed_threshold.html
  65. 20
      doc/js_tutorials/js_assets/js_watershed_watershed.html

20
doc/js_tutorials/js_assets/js_basic_ops_copymakeborder.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_basic_ops_roi.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_canny.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_colorspaces_cvtColor.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_colorspaces_inRange.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contour_features_approxPolyDP.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

4
doc/js_tutorials/js_assets/js_contour_features_area.html
Unescape View File

@ -19,11 +19,11 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <div>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> <div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</div> </div>
<div class="inputoutput"> <div>
<p><strong>The area is: </strong><span id="areaOutput"></span></p> <p><strong>The area is: </strong><span id="areaOutput"></span></p>
</div> </div>

20
doc/js_tutorials/js_assets/js_contour_features_boundingRect.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contour_features_convexHull.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contour_features_fitEllipse.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contour_features_fitLine.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contour_features_minAreaRect.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contour_features_minEnclosingCircle.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

4
doc/js_tutorials/js_assets/js_contour_features_moments.html
Unescape View File

@ -19,11 +19,11 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <div>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> <div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</div> </div>
<div class="inputoutput"> <div>
<p><strong>The m00 is: </strong><span id="momentsOutput"></span></p> <p><strong>The m00 is: </strong><span id="momentsOutput"></span></p>
</div> </div>
</div> </div>

4
doc/js_tutorials/js_assets/js_contour_features_perimeter.html
Unescape View File

@ -19,11 +19,11 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <div>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> <div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</div> </div>
<div class="inputoutput"> <div>
<p><strong>The perimeter is: </strong><span id="perimeterOutput"></span></p> <p><strong>The perimeter is: </strong><span id="perimeterOutput"></span></p>
</div> </div>
</div> </div>

20
doc/js_tutorials/js_assets/js_contour_properties_transpose.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contours_begin_contours.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_contours_more_functions_convexityDefects.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

23
doc/js_tutorials/js_assets/js_contours_more_functions_shape.html
Unescape View File

@ -19,19 +19,28 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</td>
</tr>
</table>
</div> </div>
<div class="inputoutput"> <div>
<p><strong>The result is: </strong><span id="matchShapesOutput"></span></p> <p><strong>The result is: </strong><span id="matchShapesOutput"></span></p>
</div> </div>
</div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">
let src = cv.imread('canvasInput'); let src = cv.imread('canvasInput');

7
doc/js_tutorials/js_assets/js_example_style.css
Unescape View File

@ -45,10 +45,6 @@ button[disabled] {
color: red; color: red;
font-weight: bold; font-weight: bold;
} }
.inputoutput {
margin-top: 1em;
margin-bottom: 1em;
}
.caption { .caption {
margin: 0; margin: 0;
font-weight: bold; font-weight: bold;
@ -69,3 +65,6 @@ button[disabled] {
.hidden { .hidden {
display: none; display: none;
} }
.small {
max-width: 300px;
}

20
doc/js_tutorials/js_assets/js_face_detection.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_filtering_GaussianBlur.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_filtering_bilateralFilter.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_filtering_blur.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_filtering_filter.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_filtering_medianBlur.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_fourier_transform_dft.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_geometric_transformations_getAffineTransform.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_geometric_transformations_resize.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_geometric_transformations_rotateWarpAffine.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_geometric_transformations_warpAffine.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_geometric_transformations_warpPerspective.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_grabcut_grabCut.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_gradients_Laplacian.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

30
doc/js_tutorials/js_assets/js_gradients_Sobel.html
Unescape View File

@ -19,18 +19,30 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<canvas id="canvasInput"></canvas> <tr>
<td>
<canvas id="canvasInput" class="small"></canvas>
</td>
<td>
<canvas id="canvasOutputx" class="small"></canvas>
</td>
<td>
<canvas id="canvasOutputy" class="small"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> <div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</div> </td>
<div class="inputoutput"> <td>
<canvas id="canvasOutputx"></canvas>
<div class="caption">canvasOutputx</div> <div class="caption">canvasOutputx</div>
</div> </td>
<div class="inputoutput"> <td>
<canvas id="canvasOutputy"></canvas>
<div class="caption">canvasOutputy</div> <div class="caption">canvasOutputy</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

30
doc/js_tutorials/js_assets/js_gradients_absSobel.html
Unescape View File

@ -19,18 +19,30 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<canvas id="canvasInput"></canvas> <tr>
<td>
<canvas id="canvasInput" class="small"></canvas>
</td>
<td>
<canvas id="canvasOutput8U" class="small"></canvas>
</td>
<td>
<canvas id="canvasOutput64F" class="small"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> <div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</div> </td>
<div class="inputoutput"> <td>
<canvas id="canvasOutput8U"></canvas>
<div class="caption">canvasOutput8U</div> <div class="caption">canvasOutput8U</div>
</div> </td>
<div class="inputoutput"> <td>
<canvas id="canvasOutput64F"></canvas>
<div class="caption">canvasOutput64F</div> <div class="caption">canvasOutput64F</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

34
doc/js_tutorials/js_assets/js_histogram_backprojection_calcBackProject.html
Unescape View File

@ -19,18 +19,30 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<canvas id="srcCanvasInput"></canvas> <tr>
<div class="caption">srcCanvasInput <input type="file" id="srcFileInput" name="file" /></div> <td>
</div> <canvas id="srcCanvasInput" class="small"></canvas>
<div class="inputoutput"> </td>
<canvas id="dstCanvasInput"></canvas> <td>
<div class="caption">dstCanvasInput <input type="file" id="dstFileInput" name="file" /></div> <canvas id="dstCanvasInput" class="small"></canvas>
</div> </td>
<div class="inputoutput"> <td>
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput" class="small"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">srcCanvasInput <input type="file" id="srcFileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">dstCanvasInput <input type="file" id="dstFileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_histogram_begins_calcHist.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_histogram_equalization_createCLAHE.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_histogram_equalization_equalizeHist.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_houghcircles_HoughCirclesP.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_houghlines_HoughLines.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_houghlines_HoughLinesP.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

38
doc/js_tutorials/js_assets/js_image_arithmetics_bitwise.html
Unescape View File

@ -19,18 +19,38 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="imageCanvasInput"></canvas> <canvas id="imageCanvasInput"></canvas>
<div class="caption">imageCanvasInput <input type="file" id="imageFileInput" name="file" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="logoCanvasInput"></canvas>
<div class="caption">logoCanvasInput <input type="file" id="logoFileInput" name="file" /></div>
</div>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">imageCanvasInput <input type="file" id="imageFileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
<tr>
<td>
<canvas id="logoCanvasInput"></canvas>
</td>
<td>
</td>
</tr>
<tr>
<td>
<div class="caption">logoCanvasInput <input type="file" id="logoFileInput" name="file" accept="image/*" /></div>
</td>
<td>
</td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_image_display.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_blackHat.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_closing.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_dilate.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_erode.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_getStructuringElement.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_gradient.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_opening.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_morphological_ops_topHat.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_pyramids_pyrDown.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_pyramids_pyrUp.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

22
doc/js_tutorials/js_assets/js_setup_usage.html
Unescape View File

@ -9,14 +9,24 @@
<h2>Hello OpenCV.js</h2> <h2>Hello OpenCV.js</h2>
<p id="status">OpenCV.js is loading...</p> <p id="status">OpenCV.js is loading...</p>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<img id="imageSrc" alt="No Image" /> <tr>
<td>
<img id="imageSrc" alt="No Image" class="small" />
</td>
<td>
<canvas id="canvasOutput" class="small" height="300px"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">imageSrc <input type="file" id="fileInput" name="file" accept="image/*" /></div> <div class="caption">imageSrc <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</div> </td>
<div class="inputoutput"> <td>
<canvas id="canvasOutput" ></canvas>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script type="text/javascript"> <script type="text/javascript">

38
doc/js_tutorials/js_assets/js_template_matching_matchTemplate.html
Unescape View File

@ -20,18 +20,38 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="imageCanvasInput"></canvas> <canvas id="imageCanvasInput"></canvas>
<div class="caption">imageCanvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="templateCanvasInput"></canvas>
<div class="caption">templateCanvasInput <input type="file" id="templateFileInput" name="file" /></div>
</div>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">imageCanvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
<tr>
<td>
<canvas id="templateCanvasInput"></canvas>
</td>
<td>
</td>
</tr>
<tr>
<td>
<div class="caption">templateCanvasInput <input type="file" id="templateFileInput" name="file" accept="image/*" /></div>
</td>
<td>
</td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_thresholding_adaptiveThreshold.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_thresholding_threshold.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

30
doc/js_tutorials/js_assets/js_trackbar.html
Unescape View File

@ -21,49 +21,33 @@
<b>trackbar</b> <b>trackbar</b>
<input type="range" id="trackbar" disabled value="50" min="0" max="100" step="1"> <input type="range" id="trackbar" disabled value="50" min="0" max="100" step="1">
<label id="weightValue" ></label> <label id="weightValue" ></label>
<div class="inputoutput">
<div> <div>
<table cellpadding="0" cellspacing="0" width="0" border="0"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr> <tr>
<td> <td>
<canvas id="canvasInput1"></canvas> <canvas id="canvasInput1" class="small"></canvas>
</td> </td>
<td> <td>
<canvas id="canvasInput2"></canvas> <canvas id="canvasInput2" class="small"></canvas>
</td> </td>
<td></td>
<td></td>
</tr>
<tr>
<td> <td>
<p class="caption">canvasInput1</p> <canvas id="canvasOutput" class="small"></canvas>
</td> </td>
<td>
<p class="caption">canvasInput2</p>
</td>
<td></td>
<td></td>
</tr> </tr>
<tr> <tr>
<td> <td>
<canvas id="canvasOutput"></canvas> <div class="caption">canvasInput1</div>
</td>
<td>
<div class="caption">canvasInput2</div>
</td> </td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td> <td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</td> </td>
<td></td>
<td></td>
<td></td>
</tr> </tr>
</table> </table>
</div> </div>
</div> </div>
</div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">
let trackbar = document.getElementById('trackbar'); let trackbar = document.getElementById('trackbar');

20
doc/js_tutorials/js_assets/js_watershed_background.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_watershed_distanceTransform.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_watershed_foreground.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_watershed_threshold.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

20
doc/js_tutorials/js_assets/js_watershed_watershed.html
Unescape View File

@ -19,14 +19,24 @@
<p class="err" id="errorMessage"></p> <p class="err" id="errorMessage"></p>
</div> </div>
<div> <div>
<div class="inputoutput"> <table cellpadding="0" cellspacing="0" width="0" border="0">
<tr>
<td>
<canvas id="canvasInput"></canvas> <canvas id="canvasInput"></canvas>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div> </td>
</div> <td>
<div class="inputoutput">
<canvas id="canvasOutput"></canvas> <canvas id="canvasOutput"></canvas>
</td>
</tr>
<tr>
<td>
<div class="caption">canvasInput <input type="file" id="fileInput" name="file" accept="image/*" /></div>
</td>
<td>
<div class="caption">canvasOutput</div> <div class="caption">canvasOutput</div>
</div> </td>
</tr>
</table>
</div> </div>
<script src="utils.js" type="text/javascript"></script> <script src="utils.js" type="text/javascript"></script>
<script id="codeSnippet" type="text/code-snippet"> <script id="codeSnippet" type="text/code-snippet">

Write Preview
Loading…
Cancel
Save