forked from okalachev/arucogen
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
54 lines (52 loc) · 2.93 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="main.css"/>
<meta name="description" content="Generate ArUco marker for printing with dictionary selection">
<meta name="keywords" content="ArUco, OpenCV, marker, generate, dictionary, print, computer vision, robotics">
<link rel="icon" type="image/png" href="favicon.png">
<title>Online ArUco markers generator</title>
</head>
<body>
<h1>ArUco markers generator!</h1>
<form class="setup">
<div class="field">
<label for="frm-dict">Dictionary:</label>
<select name="dict" id="frm-dict">
<optgroup label="Standard dictionaries">
<option value="aruco" data-width="5" data-height="5">Original ArUco</option>
<option selected value="4x4_1000" data-width="4" data-height="4">4x4 (50, 100, 250, 1000)</option>
<option value="5x5_1000" data-width="5" data-height="5">5x5 (50, 100, 250, 1000)</option>
<option value="6x6_1000" data-width="6" data-height="6">6x6 (50, 100, 250, 1000)</option>
<option value="7x7_1000" data-width="7" data-height="7">7x7 (50, 100, 250, 1000)</option>
</optgroup>
</select>
</div>
<div class="field">
<label for="frm-id">Marker ID:</label>
<input id="frm-id" name="id" type="number" min="0" max="999" value="0">
</div>
<div class="field">
<label for="frm-size">Marker size, mm:</label>
<input id="frm-size" name="size" type="number" min="10" max="5000" value="100">
</div>
</form>
<div class="marker-id"></div>
<div class="marker"></div>
<div class="tools">
<a href="" class="save-button">Save</a> this marker as SVG, or
<a href="javascript:window.print()">open</a> standard browser's print dialog to print or get the PDF.
</div>
<footer>
<div>
If you like this project, please <a href="https://github.com/okalachev/arucogen"><nobr>★ it on GitHub</nobr></a>!
</div>
<div>
See <a href="https://docs.opencv.org/3.2.0/d5/dae/tutorial_aruco_detection.html">OpenCV documentation</a>
to learn about ArUco markers.<br>
Author: <a href="http://chev.me">Oleg Kalachev</a>.</div>
</footer>
<script type="text/javascript" src="main.js"></script>
<!-- Yandex.Metrika counter --> <script type="text/javascript" > (function (d, w, c) { (w[c] = w[c] || []).push(function() { try { w.yaCounter37286925 = new Ya.Metrika({ id:37286925, clickmap:true, trackLinks:true, accurateTrackBounce:true }); } catch(e) { } }); var n = d.getElementsByTagName("script")[0], s = d.createElement("script"), f = function () { n.parentNode.insertBefore(s, n); }; s.type = "text/javascript"; s.async = true; s.src = "https://mc.yandex.ru/metrika/watch.js"; if (w.opera == "[object Opera]") { d.addEventListener("DOMContentLoaded", f, false); } else { f(); } })(document, window, "yandex_metrika_callbacks"); </script> <noscript><div><img src="https://mc.yandex.ru/watch/37286925" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter -->
</body>
</html>