-
Notifications
You must be signed in to change notification settings - Fork 54
/
index.html
61 lines (59 loc) · 3.56 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
55
56
57
58
59
60
61
<!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, AprilTag, OpenCV, april, tag, marker, dictionary, family, print, pdf, svg, 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" data-number="1024">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>
<option value="mip_36h12" data-width="6" data-height="6" data-number="250">MIP_36h12 (250)</option>
</optgroup>
<optgroup label="AprilTag">
<option value="april_16h5" data-width="4" data-height="4" data-number="30">AprilTag 16h5 (30)</option>
<option value="april_25h9" data-width="5" data-height="5" data-number="35">AprilTag 25h9 (35)</option>
<option value="april_36h10" data-width="6" data-height="6" data-number="2320">AprilTag 36h10 (2320)</option>
<option value="april_36h11" data-width="6" data-height="6" data-number="587">AprilTag 36h11 (587)</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>