2020-03-04 22:24:49 +01:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<title>Plotting Data: COCO drawings</title>
|
2020-03-10 11:53:00 +01:00
|
|
|
<!-- Plotting Data publication -->
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="/a/css/main.css">
|
2020-03-10 12:08:21 +01:00
|
|
|
|
2020-03-04 22:24:49 +01:00
|
|
|
<link rel="stylesheet" type="text/css" href="coco.css">
|
|
|
|
|
</head>
|
2020-03-10 15:07:29 +01:00
|
|
|
<body class='hideImages saved'>
|
2020-03-10 11:53:00 +01:00
|
|
|
|
|
|
|
|
<nav id='publication'>
|
|
|
|
|
<a href="/a/introduction.html">
|
|
|
|
|
Introduction
|
|
|
|
|
</a>
|
|
|
|
|
<a href="/a/coco/" class='current'>
|
|
|
|
|
COCO
|
|
|
|
|
</a>
|
|
|
|
|
<a href="/a/enron/">
|
|
|
|
|
Enron
|
|
|
|
|
</a>
|
|
|
|
|
<a href="/a/20bn/">
|
|
|
|
|
Something-Something
|
|
|
|
|
</a>
|
|
|
|
|
<a href="/a/interviews.html">
|
|
|
|
|
Interviews
|
|
|
|
|
</a>
|
2020-03-10 12:08:21 +01:00
|
|
|
<div id='sub'>
|
2020-03-11 13:10:45 +01:00
|
|
|
<a href="/a/introduction.html#dataset-for-4-year-olds-coco">Dataset for 4 year olds</a>
|
2020-03-10 12:08:21 +01:00
|
|
|
</div>
|
2020-03-10 11:53:00 +01:00
|
|
|
</nav>
|
|
|
|
|
|
2020-03-04 22:24:49 +01:00
|
|
|
<div class='buttons buttons-inline'>
|
2020-03-10 15:51:05 +01:00
|
|
|
<label id='convert'><input type='checkbox' id='loadImages'> <span>Images</span></label>
|
|
|
|
|
<label id='labelcheck'><input type='checkbox' id='loadLabels'> <span>Labels</span></label>
|
|
|
|
|
<label id='bgcheck'><input type='checkbox' id='loadBg' checked> <span>Scenes</span></label>
|
2020-03-10 15:07:29 +01:00
|
|
|
<label id='godraw'><a href='/a/coco/'>Draw your own!</a></label>
|
2020-03-04 22:24:49 +01:00
|
|
|
</div>
|
|
|
|
|
<div id='saved'>
|
|
|
|
|
{images}
|
|
|
|
|
</div>
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
let loadImagesEl = document.getElementById('loadImages');
|
|
|
|
|
let loadLabelsEl = document.getElementById('loadLabels');
|
2020-03-10 15:07:29 +01:00
|
|
|
let loadBgsEl = document.getElementById('loadBg');
|
2020-03-04 22:24:49 +01:00
|
|
|
|
|
|
|
|
let setImageClass = function() {
|
|
|
|
|
if(loadImagesEl.checked) {
|
|
|
|
|
document.body.classList.remove('hideImages');
|
|
|
|
|
} else {
|
|
|
|
|
document.body.classList.add('hideImages');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
let setLabelClass = function() {
|
|
|
|
|
if(loadLabelsEl.checked) {
|
|
|
|
|
document.body.classList.remove('hideLabels');
|
|
|
|
|
} else {
|
|
|
|
|
document.body.classList.add('hideLabels');
|
|
|
|
|
}
|
|
|
|
|
}
|
2020-03-10 15:07:29 +01:00
|
|
|
let setBgClass = function() {
|
|
|
|
|
if(loadBgsEl.checked) {
|
|
|
|
|
document.body.classList.remove('hideBg');
|
|
|
|
|
} else {
|
|
|
|
|
document.body.classList.add('hideBg');
|
|
|
|
|
}
|
|
|
|
|
}
|
2020-03-04 22:24:49 +01:00
|
|
|
|
|
|
|
|
loadImagesEl.addEventListener('change', (e) => setImageClass());
|
|
|
|
|
loadLabelsEl.addEventListener('change', (e) => setLabelClass());
|
2020-03-10 15:07:29 +01:00
|
|
|
loadBgsEl.addEventListener('change', (e) => setBgClass());
|
2020-03-04 22:24:49 +01:00
|
|
|
setImageClass();
|
|
|
|
|
setLabelClass();
|
2020-03-10 15:07:29 +01:00
|
|
|
setBgClass();
|
2020-03-04 22:24:49 +01:00
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
