Created
October 6, 2016 06:04
-
-
Save notionparallax/c5048e469472e7beed31120142ee5306 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html lang=en> | |
<head> | |
<meta charset=utf-8> | |
<title>Training data stickers</title> | |
</head> | |
<body> | |
<style> | |
text{ | |
font-size:57.83px; | |
fill:#fff; | |
font-family:Blender-Bold, Blender; | |
font-weight:700; | |
} | |
body { | |
padding: 0; | |
margin: 0; | |
} | |
svg { | |
height: 24%; | |
width: 24%; | |
display: inline-block; | |
} | |
@media print{ | |
svg { | |
height: 99.1mm; | |
width: 67.7mm; | |
display: inline-block; | |
} | |
@page { | |
/*size: auto;*/ | |
size: a4 landscape; | |
margin-top: 4.7mm; | |
margin-bottom: 4.7mm; | |
margin-left: 13mm; | |
margin-right: 13mm; | |
} | |
} | |
</style> | |
<script type="text/javascript"> | |
document.addEventListener("DOMContentLoaded", function(event) { | |
let allTheSvgs = ""; | |
let row="<tr>" | |
let numberOfstickersPerRow = 4 | |
for (var i = 1; i <= 400; i++) { | |
let number = "COW"; | |
if (i<10){ number = `00${i}`;} | |
else if (i<100){ number = `0${i}`;} | |
else { number = `${i}`;} | |
let svgtemplate = ` | |
<svg id="sticker${number}" | |
xmlns="http://www.w3.org/2000/svg" | |
xmlns:xlink="http://www.w3.org/1999/xlink" | |
viewBox="0 0 191.91 280.91"> | |
<image width="150" | |
height="150" | |
transform="translate(20.95 120)" | |
xlink:href="https://chart.googleapis.com/chart?chs=400x400&cht=qr&chl=${number}&choe=UTF-8&chld=h|0"/> | |
<polygon transform="scale(0.8) translate(22 0)" | |
points="95.95 3.38 163.22 119.6 28.7 119.6 95.95 3.38"/> | |
<text transform="translate(50.93 100)">${number}</text> | |
</svg> | |
`; | |
row = row + svgtemplate; | |
if (i%numberOfstickersPerRow==0){ | |
allTheSvgs += row;// + "</tr>"; | |
row = ""; | |
} | |
} | |
let theTable = document.createElement('table'); | |
theTable.innerHTML = allTheSvgs; | |
// var body = document.querySelector("body"); | |
document.body.appendChild(theTable); | |
}); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment