Hébergeur de fichiers indépendant

map.html

À propos

Type de fichier
Fichier HTML de 256 Ko (text/html)
Confidentialité
Fichier public, envoyé le 30 octobre 2018 à 13:12, depuis l'adresse IP 92.154.x.x (France)
Sécurité
Ne contient aucun Virus ou Malware connus - Dernière vérification: 17/06/19
Statistiques
La présente page de téléchargement a été vue 163 fois depuis l'envoi du fichier
Page de téléchargement

Aperçu du fichier


<html lang="en"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" id="www-widgetapi-script" src="https://s.ytimg.com/yts/jsbin/www-widgetapi-vflY6gPjD/www-widgetapi.js" async=""></script><script src="https://www.youtube.com/iframe_api"></script><script async="" src="https://www.google-analytics.com/analytics.js"></script><script src="https://apis.google.com/_/scs/apps-static/_/js/k=oz.gapi.fr.BUES4F5XsDY.O/m=signin2/rt=j/sv=1/d=1/ed=1/am=wQ/rs=AGLTcCNWx40KR3jbQ6FmTMdWsK3clVe8FQ/cb=gapi.loaded_0" async=""></script><script><!--
if(window.location.protocol == "file:") {
document.write('<base href="http://hextml.playest.net/" />');
}
--></script>
<title>Map The Blank</title>
<link rel="stylesheet" type="text/css" id="mainstyle" href="includes/hextml.css?v6.55">
<link rel="stylesheet" type="text/css" id="mapstyle" href="includes/map.025.css?v6.55">
<link rel="shortcut icon" type="image/png" href="includes/images/favicon.png">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">

<meta name="description" content="Online hexmap maker and campaign manager. For DnD or any other tabletop RPG. Maps can be shared in almost real-time with anyone.">

<meta property="og:title" content="An online mapmaker - Hextml">
<meta property="og:description" content="Online hexmap maker and campaign manager for DnD and other RPG.">
<meta property="og:image" content="http://hextml.playest.net/preview.jpg">
<meta property="og:url" content="http://hextml.playest.net">
<meta property="og:type" content="article">
<meta property="og:locale" content="en_GB">
<meta name="twitter:card" content="app">
<meta name="twitter:site" content="@playest">
<meta name="twitter:creator" content="@playest">

<meta name="google-signin-scope" content="profile email">
<meta name="google-signin-client_id" content="521171258594-inp0d33scqcnt0sjb2dctob05tf8stot.apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async="async" defer="defer" gapi_processed="true"></script>
<style>
.splashing .header, .splashing .left-panel, .splashing .main, .splashing #togetherjs-dock, .splashing .hovermap {
display: none;
}
.splashscreen .logo {
position: absolute;
}
.splashing .splashscreen {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100%;
}
.splashscreen .rotate {
-webkit-animation:spin 4s linear infinite;
-moz-animation:spin 4s linear infinite;
animation:spin 4s linear infinite;
}
.splashscreen .ldlogo {
display: flex;
align-items: center;
justify-content: center;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

</style>
<style id="resourcesStyle">


/**/

/**/
</style>
<style id="resourcesBgColor">


/**/

/**/
</style>
<link id="togetherjs-stylesheet" rel="stylesheet" href="http://hextml.playest.net/includes/togetherjs/togetherjs.css?bust=1540456225940"><script src="http://hextml.playest.net/includes/togetherjs/libs/require.js?bust=1540456225940"></script><style>.abcRioButton{-webkit-border-radius:1px;border-radius:1px;-webkit-box-shadow 0 2px 4px 0px rgba(0,0,0,.25);box-shadow:0 2px 4px 0 rgba(0,0,0,.25);-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background-color .218s,border-color .218s,box-shadow .218s;transition:background-color .218s,border-color .218s,box-shadow .218s;-webkit-user-select:none;-webkit-appearance:none;background-color:#fff;background-image:none;color:#262626;cursor:pointer;outline:none;overflow:hidden;position:relative;text-align:center;vertical-align:middle;white-space:nowrap;width:auto}.abcRioButton:hover{-webkit-box-shadow:0 0 3px 3px rgba(66,133,244,.3);box-shadow:0 0 3px 3px rgba(66,133,244,.3)}.abcRioButtonBlue{background-color:#4285f4;border:none;color:#fff}.abcRioButtonBlue:hover{background-color:#4285f4}.abcRioButtonBlue:active{background-color:#3367d6}.abcRioButtonLightBlue{background-color:#fff;color:#757575}.abcRioButtonLightBlue:active{background-color:#eee;color:#6d6d6d}.abcRioButtonIcon{float:left}.abcRioButtonBlue .abcRioButtonIcon{background-color:#fff;-webkit-border-radius:1px;border-radius:1px}.abcRioButtonSvg{display:block}.abcRioButtonContents{font-family:Roboto,arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:.21px;margin-left:6px;margin-right:6px;vertical-align:top}.abcRioButtonContentWrapper{height:100%;width:100%}.abcRioButtonBlue .abcRioButtonContentWrapper{border:1px solid transparent}.abcRioButtonErrorWrapper,.abcRioButtonWorkingWrapper{display:none;height:100%;width:100%}.abcRioButtonErrorIcon,.abcRioButtonWorkingIcon{margin-left:auto;margin-right:auto}.abcRioButtonErrorState,.abcRioButtonWorkingState{border:1px solid #d5d5d5;border:1px solid rgba(0,0,0,.17);-webkit-box-shadow:0 1px 0 rgba(0,0,0,.05);box-shadow:0 1px 0 rgba(0,0,0,.05);color:#262626}.abcRioButtonErrorState:hover,.abcRioButtonWorkingState:hover{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);-webkit-box-shadow:0 1px 0 rgba(0,0,0,.1);box-shadow:0 1px 0 rgba(0,0,0,.1)}.abcRioButtonErrorState:active,.abcRioButtonWorkingState:active{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);-webkit-box-shadow:inset 0 1px 0 #ddd;box-shadow:inset 0 1px 0 #ddd;color:#262626}.abcRioButtonWorkingState,.abcRioButtonWorkingState:hover{background-color:#f5f5f5}.abcRioButtonWorkingState:active{background-color:#e5e5e5}.abcRioButtonErrorState,.abcRioButtonErrorState:hover{background-color:#fff}.abcRioButtonErrorState:active{background-color:#e5e5e5}.abcRioButtonWorkingState .abcRioButtonWorkingWrapper,.abcRioButtonErrorState .abcRioButtonErrorWrapper{display:block}.abcRioButtonErrorState .abcRioButtonContentWrapper,.abcRioButtonWorkingState .abcRioButtonContentWrapper,.abcRioButtonErrorState .abcRioButtonWorkingWrapper{display:none}.-webkit-keyframes abcRioButtonWorkingIconPathSpinKeyframes{0%{-webkit-transform:rotate(0)}} </style><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="session" src="http://hextml.playest.net/includes/togetherjs/session.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="jquery" src="http://hextml.playest.net/includes/togetherjs/libs/jquery-1.8.3.min.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="util" src="http://hextml.playest.net/includes/togetherjs/util.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="channels" src="http://hextml.playest.net/includes/togetherjs/channels.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="storage" src="http://hextml.playest.net/includes/togetherjs/storage.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="jqueryPlugins" src="http://hextml.playest.net/includes/togetherjs/jqueryPlugins.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="ui" src="http://hextml.playest.net/includes/togetherjs/ui.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="templates" src="http://hextml.playest.net/includes/togetherjs/templates.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="templating" src="http://hextml.playest.net/includes/togetherjs/templating.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="linkify" src="http://hextml.playest.net/includes/togetherjs/linkify.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="peers" src="http://hextml.playest.net/includes/togetherjs/peers.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="windowing" src="http://hextml.playest.net/includes/togetherjs/windowing.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="tinycolor" src="http://hextml.playest.net/includes/togetherjs/libs/tinycolor.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="elementFinder" src="http://hextml.playest.net/includes/togetherjs/elementFinder.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="visibilityApi" src="http://hextml.playest.net/includes/togetherjs/visibilityApi.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="chat" src="http://hextml.playest.net/includes/togetherjs/chat.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="webrtc" src="http://hextml.playest.net/includes/togetherjs/webrtc.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="cursor" src="http://hextml.playest.net/includes/togetherjs/cursor.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="startup" src="http://hextml.playest.net/includes/togetherjs/startup.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="videos" src="http://hextml.playest.net/includes/togetherjs/videos.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="forms" src="http://hextml.playest.net/includes/togetherjs/forms.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="youtubeVideos" src="http://hextml.playest.net/includes/togetherjs/youtubeVideos.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="playback" src="http://hextml.playest.net/includes/togetherjs/playback.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="eventMaker" src="http://hextml.playest.net/includes/togetherjs/eventMaker.js?bust=1540456225940"></script><script type="text/javascript" charset="utf-8" async="" data-requirecontext="togetherjs" data-requiremodule="ot" src="http://hextml.playest.net/includes/togetherjs/ot.js?bust=1540456225940"></script></head>
<body class="truefow hideText stamp">

<script>
var url = window.location.pathname;
var basename = url.substring(url.lastIndexOf('/') + 1);
if(basename == "view.html") {
console.log("entering play(er)mode");
document.querySelector("body").classList.add("fullMap");
document.querySelector("body").classList.add("playerMode");
if(window.location.protocol != "file:") {
//document.querySelector("body").classList.add("fullMapLock");
}
}</script>

<div class="splashscreen">
<div class="ldlogo">
<img class="logo" src="includes/images/hextml_logo.png">
<img class="rotate" src="includes/images/loadingfg.png">
</div>
<div class="ldmsg">Unloading stuff...</div>
</div>

<div class="settings overpanel" style="display: none;">
<div class="panel">
<button class="close" onclick="theInterface.hideSettings();" title="close">×</button>

<div class="titleLine panelLine">
<input class="mapTitle" value="Title" oninput="theProject.updateTitleEvent(this);" type="text">
</div>

<div class="editor panelItem">

<p class="help"></p>

<div class="centered line">
<div class="mapSizeManager">
<div>
<button onclick="theProject.incrementMapSizeEvent('row', 'before', -1);">-</button>
<button onclick="theProject.incrementMapSizeEvent('row', 'before', +1);">+</button>
</div>

<div class="left">
<button onclick="theProject.incrementMapSizeEvent('col', 'before', +1);">+</button><br>
<button onclick="theProject.incrementMapSizeEvent('col', 'before', -1);">-</button>
</div>
<img src="includes/images/map.svg" alt="map">
<div class="right">
<button onclick="theProject.incrementMapSizeEvent('col', 'after', +1);">+</button><br>
<button onclick="theProject.incrementMapSizeEvent('col', 'after', -1);">-</button>
</div>

<div>
<button onclick="theProject.incrementMapSizeEvent('row', 'after', -1);">-</button>
<button onclick="theProject.incrementMapSizeEvent('row', 'after', +1);">+</button>
</div>
</div>
</div>

<div class="changeMapSize smartline eq">
<div>
<span>Height: </span>
<span><input id="mapHeight" type="text"></span>
<span>Width: </span>
<span><input id="mapWidth" type="text"></span>
</div>
<button class="eq" onclick="theProject.changeMapSizeEvent();">set size</button>
</div>
<div class="smartline eq">
<button onclick="theProject.clearMapEvent();">Clear</button>
<button onclick="theProject.makeRandomMapEvent();">Generate</button>
</div>
</div><!-- /editor -->

<div class="bgpanel">
<p class="help">If you added a background image to the map in the "resource" tab you can change the opacity of the tile and move the background.</p>

<div class="smartline">
<span class="fixed">Opacity: </span><input oninput="theProject.updateOpacityOfMapEvent(this);" type="range">
</div>

<div class="smartline eq">
<span>Background horizontal offset (px):</span>
<input id="bgxoffset" oninput="theProject.updateBgOffsetEvent();" type="number">
</div>
<div class="smartline eq">
<span>Background vertical offset (px):</span>
<input id="bgyoffset" oninput="theProject.updateBgOffsetEvent();" type="number">
</div>
<div class="smartline eq">
<span>Background zoom (%):</span>
<input id="bgzoom" oninput="theProject.updateBgOffsetEvent();" type="number">
</div>
</div>

</div>
</div>

<div class="localSaves overpanel" style="display:none;">
<div class="panel">
<button class="close" onclick="theInterface.hideLocalSavesPanel();" title="close">×</button>
<button onclick="theProject.localSaveEvent();">Save now</button><br>
<button onclick="theInterface.startLocalSave();">Enable </button> / 
<button onclick="theInterface.stopLocalSave();">Disable</button> auto save
<h1>Local saves</h1>
<ul>
</ul>
</div>
</div>

<div class="panel4 resource overpanel" style="display:none;">
<div class="panel">
<button class="close" onclick="theInterface.hideResourcePanel();" title="close">×</button>

<div class="help">
Here you can upload resources (one by one or multiples at the same time).
<ul>
<li>An image resource can be an image that you will be able to use as terrain or as a background for the map (try the "opacity" feature). The text field is for the background color</li>
<li>A text resource is a map that can be imported.</li>
</ul>
</div>

<div class="panelItem hline">
<button class="double" onclick="document.querySelector('#fileimport').click();">Upload Resources</button>
<input id="fileimport" enctype="multipart/form-data" multiple="multiple" type="file">
<input id="fileimport2" enctype="multipart/form-data" multiple="multiple" type="file">
</div>

<p>Need help to find the code for a background color? <input type="color"></p>

<h2><button class="collapse" onclick="togglePanelItemVisibility(this, document.querySelector('.dataResourceList'));">-</button> Images</h2>
<div class="panelItem resourceList dataResourceList">

</div>

<h2><button class="collapse" onclick="togglePanelItemVisibility(this, document.querySelector('.textResourceList'));">-</button> Others</h2>
<div class="panelItem resourceList textResourceList"></div>

</div>
</div>

<div class="hovermap titleline">
<button onclick="theProject.toggleFullMapMode();"><img src="includes/images/smallscreen.svg" alt="not fullscreen"></button>
</div>

<div class="page">

<div class="header">
<div class="smartLine">
<button class="small ham-menu" onclick="theInterface.toggleHeader();"></button>
<a class="small title logo" href="/"></a>

<div class="small">|</div>

<div class="small">
<button class="langbtn small" title="Change language" onclick="theInterface.clickLocalMenuEvent(event, this.parentNode);"><img src="includes/images/language.svg"></button>

<div class="localMenu langMenu">
<button class="" title="fr" onclick="theInterface.changeLanguage('de-de');">German</button><br>
<button class="" title="fr" onclick="theInterface.changeLanguage('nl-nl');">Dutch</button><br>
<button class="" title="fr" onclick="theInterface.changeLanguage('no-no');">Norwegian</button><br>
<button class="" title="fr" onclick="theInterface.changeLanguage('fr-fr');">French</button><br>
<button class="" title="en" onclick="theInterface.changeLanguage('en-us');">English</button><br>
<button class="" title="en" onclick="theInterface.changeLanguage('i18n');">i18n</button><br>
<a href="/translate.html">Help translation</a>
</div>
</div>

<button class="small primary" onclick="theProject.exportProjectToHTMLEvent()" title="Export">&nbsp;<img alt="export" src="includes/images/export.svg">&nbsp;</button>

<button class="small primary" onclick="document.querySelector('#fileimport2').click();" title="Open">&nbsp;<img alt="open" src="includes/images/open.svg">&nbsp;</button>

<button class="small primary" id="exportToImage2" onclick="theProject.exportCurrentMapToImageEvent()" title="Export to image">&nbsp;<img alt="Image" src="includes/images/image.svg">&nbsp;</button>

<div class="small">|</div>

<button class="small" onclick="theProject.undoEvent();" title="Undo">&nbsp;<img alt="undo" src="includes/images/undo.svg">&nbsp;</button>
<button class="small" onclick="theProject.redoEvent();" title="Redo">&nbsp;<img alt="redo" src="includes/images/redo.svg">&nbsp;</button>


<div class="small">|</div>
<a class="small" href="/tutorial5.html">Tutorial</a>
<div class="small">|</div>
<a class="small" href="/blank.html">Blank</a>
<div class="small">|</div>
<a class="small" href="/templates.html">...</a>

<a class="small title" href="https://www.patreon.com/playest" onclick="logEvent('outlink', 'click', this.href);"><img src="includes/images/patron.png"></a>

<div class="small">|</div>

<span class="small"><span class="saveserver">Saves</span>: <a href="/why.html#neversave">?</a></span>

<table class="small">
<tbody><tr>
<th class="saveserverheader">
<span id="projecturl2">server</span>
<span class="notify"></span>
</th>
<th class="savelocal">
<a class="doLocalSavesButton" href="#" title="Start saving" onclick="theInterface.startLocalSave(); return false;">local</a>
<a style="display: none;" class="showLocalSavesButton" href="#" title="Show saves" onclick="theInterface.showLocalSavesPanel(); return false;">local</a>
<span class="notify"></span>
</th>
</tr>
<tr>
<td>
<div class="small">
<span id="lastServerSave">never</span>
<span id="lastServerSaveAgo">never</span>
</div>
</td>
<td>
<div class="small">
<span id="lastSave">never</span>
<span id="lastSaveAgo">never</span>
</div>
</td>
</tr>
</tbody></table>

<div class="var"></div>

<div class="g-signin2 small" data-onsuccess="onSignIn" data-theme="dark" data-gapiscan="true" data-onload="true"><div style="height:36px;width:120px;" class="abcRioButton abcRioButtonBlue"><div class="abcRioButtonContentWrapper"><div class="abcRioButtonIcon" style="padding:8px"><div style="width:18px;height:18px;" class="abcRioButtonSvgImageWithFallback abcRioButtonIconImage abcRioButtonIconImage18"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="18px" height="18px" viewBox="0 0 48 48" class="abcRioButtonSvg"><g><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path><path fill="none" d="M0 0h48v48H0z"></path></g></svg></div></div><span style="font-size:13px;line-height:34px;" class="abcRioButtonContents"><span id="not_signed_indfgb558k6kg7">Connexion</span><span id="connecteddfgb558k6kg7" style="display:none">Signed in</span></span></div></div></div>

<div id="googleSignoutButton" class="small" style="display: none;">
<div style="height:36px;width:120px;" class="abcRioButton abcRioButtonBlue" onclick="googleSignOut();">
<div class="abcRioButtonContentWrapper">
<div class="abcRioButtonIcon" style="padding:8px">
<div style="width:18px;height:18px;" class="abcRioButtonSvgImageWithFallback abcRioButtonIconImage abcRioButtonIconImage18">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="18px" height="18px" viewBox="0 0 48 48" class="abcRioButtonSvg"><g><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h22.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path><path fill="none" d="M0 0h48v48H0z"></path></g></svg>
</div>
</div>
<span style="font-size:13px;line-height:34px;" class="abcRioButtonContents">
<span style="">Sign out</span>
</span>
</div>
</div>
</div>

</div>

</div><!-- /header -->

<div class="main">

<div class="popup">
<div class="messageBox">
<button onclick="this.parentNode.parentNode.classList.toggle('show'); return false;">×</button>
<div class="message">
</div>
<div class="wait">
<img src="includes/images/loading2.gif" alt="wait">
</div>
</div>
</div>

<div class="left-panel">
<div class="doubleButton">
<button class="b1" title="Collaboration" onclick="enableCollaboration(this);"><img src="includes/images/collaboration.svg"></button><button class="b2" title="Collaboration options" onclick="theInterface.clickLocalMenuEvent(event, this.parentNode);">˅</button>
<div class="localMenu viewersMenu hideText truefow">
<button class="small hexNumberButton" title="Show/hide hex number" onclick="theProject.toggleHexNumberForViewersEvent();"><span style="">#</span></button>

<button class="small hexBorderButton" title="Show/hide hex border" onclick="theProject.toggleHexBorderForViewersEvent();"><img src="includes/images/border.svg"></button>

<button class="small fowButton" title="En/disable fog of war" onclick="theProject.toggleFogOfWarForViewersEvent();"><img src="includes/images/fogeye.svg"></button>

<button class="small hidetextButton" title="Show/hide text and icons" onclick="theProject.toggleTextVisibilityForViewersEvent();"><img src="includes/images/hidetext.svg"></button>

<button class="small viewerModeButton" title="Go into edit mode and put others into viewer mode" onclick="theProject.toggleViewerModeEvent(true);"><img src="includes/images/leading.svg"></button>

<button class="small viewerModeButton" title="Set everybody into edit mode" onclick="theProject.toggleViewerModeEvent(false);"><img src="includes/images/groupwork.svg"></button>
</div>
</div>

<button class="small" title="Sync view" onclick="theProject.scrollToElementEvent();"><img src="includes/images/group-leader.svg"></button>

<hr>

<button class="small ibtn" title="Change orientation of hexagons" onclick="theProject.switchColRowModeEvent();"><img src="includes/images/toggle_colrow2.png"></button>
<button class="small hexNumberButton" title="Show/hide hex number" onclick="theProject.toggleHexNumberEvent();"><img style="width:27px;" src="includes/images/coords.svg"></button>
<button class="small hexBorderButton" title="Show/hide hex border" onclick="theProject.toggleHexBorderEvent();"><img src="includes/images/border.svg"></button>
<button class="small fowButton" title="En/disable fog of war" onclick="theProject.toggleFogOfWarEvent();"><img src="includes/images/fogeye.svg"></button>
<button class="small hidetextButton" title="Show/hide text and icons" onclick="theProject.toggleTextVisibilityEvent();"><img src="includes/images/hidetext.svg"></button>
<button class="small hideNotesButton" title="Show/hide note markers" onclick="theProject.toggleNotesMarkerEvent();"><img src="includes/images/notepad.svg"></button>
<button class="bwbutton small" title="Black and white/color mode" onclick="theProject.toggleBlackWhiteModeEvent();"><img style="width:27px;" src="includes/images/color2wb.png"></button>

<hr>

<button class="small" title="change zoom" onclick="theProject.loopZoom();"><img src="includes/images/zoom_inout.svg"></button>
<button class="small" title="Outline mode" onclick="theProject.toogleOutlineModeEvent();"><img src="includes/images/checklist.svg"></button>

</div>

<div class="hexBlockSample" data-version="1530855544">

<div class="hexBlock">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum"></span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div>

<article class="hexline"></article>

<div class="overmap hexincol">
<section class="map" data-version="1.0" data-height="0" data-width="0" data-title="New map">
</section>
</div>

<div class="oneResource dataresource">
<div class="resource"></div>
<span class="name" style="display: none;"></span>
<label><input class="intoterrain" onchange="theProject.customTerrains.toggle(new Resource(this.parentNode.parentNode));" type="checkbox"> terrain</label>
<label><input class="intoicon" onchange="theProject.icons.toggle(new Resource(this.parentNode.parentNode));" type="checkbox"> icon</label>
<button class="asbackground" onclick="theProject.setBackgroundOfMapEvent(new Resource(this.parentNode));">background</button>
<input class="color half" value="transparent" oninput="theProject.setBgColorOfResourceEvent(this.parentNode, this.value);" type="text">
<button class="auto" onclick="theProject.deleteResource(new Resource(this.parentNode));">×</button>
</div>

<div class="oneResource textresource">
<div class="resource" style="display: none;"></div>
<span class="name"></span>
<button class="double" onclick="theProject.loadSubmapsFromDOM(this.parentNode);">Add into submaps</button>
<button class="double" onclick="theProject.loadProjectFromResourceEvent(this.parentNode);">Override</button>
<button class="auto" onclick="theProject.deleteResource(new Resource(this.parentNode));">×</button>
</div>

<div class="submap">
<button class="up" onclick="">↑</button>
<button class="down" onclick="">↓</button>
<button class="del" onclick="this.parentNode.remove(); document.querySelectorAll('.mapcontainer > .overmap')[parseInt(this.dataset.domNum)].remove();">×</button>
<a class="title" href=""></a>
</div>

<div class="terrainSample">
<button onclick="paintColorSelect(this, 'terrain');" class="beach" title="beach"><img src="includes/terrains/terrains_classic/beach.png"></button>
</div>

</div><!-- /hexBlockSample -->

<div class="announceBox" style="display: none;">
<button onclick="closeAnnounce();" title="close">×</button>
<div class="announce"><p>
    <strong>The interface is <a target="_blank" href="https://www.imdb.com/title/tt2779318/quotes?item=qt2059079">hot!</a></strong> Version 6 is out.
	<br>
	</p><ul>
		<li>You can <strong>drag and drop icon</strong> on the map</li>
		<li>Custom tiles and icons can be directly uploaded from the terrains tab.</li>
	    <li>Collaborative mode is enabled by default.</li>
	    <li><a href="https://www.youtube.com/watch?v=hlVKOah23kQ&amp;list=PLfc0LP0PZlKUhWbZm0My1RY-XalpCzcaO" onclick="logEvent('outlink', 'click', this.href);">I made some tutorial videos</a></li>
	    <li>If you have a problem with your previous maps try <a href="http://old.hextml.playest.net/">here</a></li>
	</ul>
<p></p>
<p>
	<a target="_blank" href="https://www.reddit.com/r/rpg/comments/98676h/making_hexmaps_online_for_the_fifth_time_with/" onclick="logEvent('outlink', 'click', this.href);">Click here</a> to discuss, ask questions and read the changelog. You can also contact me on <a target="_blank" href="https://twitter.com/playest" onclick="logEvent('outlink', 'click', this.href);">twitter</a>.
</p>
</div>
</div>

<div style="display:none;" id="credits">
<p><a href="http://hextml.playest.net">Hextml</a> is an online hex map maker, world building tool, campaign manager and virtual tabletop software for your RPG. Use it in your DnD (or any other tabletop RPG) campaign to build a world for you and your players. It uses the best of HTML5 to let you make beautiful hexagonal maps. You can share a map live with your players by enabling the collaborative mode (with or without fog of war).
</p>

<p>Ask quetions about the software <a href="https://www.reddit.com/r/rpg/comments/77tklz/a_new_version_of_hextml_the_webbased_hexagonal/?ref=share&amp;ref_source=link">here</a>, I visit this post quite often.</p>

<p>Hextml is made by made by <a href="https://twitter.com/playest">playest</a></p>

<p><a href="credits.html">Other credits</a></p>

<p class="creditsToggle"><a href="#" onclick="toggleVisibility(document.querySelector('#credits'));">Hide credits</a></p>


</div>

<div class="project" data-authorid="97f159cd-52db-c5fc-c502-e4b98a79e96d" data-guid="098a851b-4d11-a9a6-ae3d-053971ff476c" data-lastfilesave="2018-10-25T08:36:11.608Z"></div>


<div class="mapcontainer">
<div class="overmap show selected hexincol"><section class="map" data-version="1" data-uid="0" data-height="16" data-width="22" data-title="Map The Blank"><article class="hexline" data-y="0"><div class="hexBlock hex-0-0" data-x="0" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">0, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="1" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">1, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="2" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">2, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="3" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">3, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="4" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">4, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="5" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">5, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="6" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">6, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="7" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">7, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="8" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">8, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="9" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">9, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-1-0" data-x="10" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">10, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-2-0" data-x="11" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">11, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-3-0" data-x="12" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">12, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-4-0" data-x="13" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">13, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-5-0" data-x="14" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">14, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-6-0" data-x="15" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">15, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-7-0" data-x="16" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">16, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-8-0" data-x="17" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">17, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-9-0" data-x="18" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">18, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-10-0" data-x="19" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">19, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-11-0" data-x="20" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">20, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-12-0" data-x="21" data-y="0">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">21, 0</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div></article><article class="hexline" data-y="1"><div class="hexBlock hex-0-1" data-x="0" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">0, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="1" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">1, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="2" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">2, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="3" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">3, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="4" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">4, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="5" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">5, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="6" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">6, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="7" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">7, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-1" data-x="8" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">8, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-0" data-x="9" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">9, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-1-0" data-x="10" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">10, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-2-0" data-x="11" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">11, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-3-0" data-x="12" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">12, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-4-0" data-x="13" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">13, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-5-0" data-x="14" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">14, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-6-0" data-x="15" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">15, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-7-0" data-x="16" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">16, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-8-0" data-x="17" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">17, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-9-0" data-x="18" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">18, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-10-0" data-x="19" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">19, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-11-0" data-x="20" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">20, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-12-0" data-x="21" data-y="1">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">21, 1</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div></article><article class="hexline" data-y="2"><div class="hexBlock hex-0-2" data-x="0" data-y="2">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">0, 2</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-2" data-x="1" data-y="2">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">1, 2</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-2" data-x="2" data-y="2">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">2, 2</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-2" data-x="3" data-y="2">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">3, 2</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-2" data-x="4" data-y="2">
<div class="hexagon hexagon2">
<div class="hexagon-in1">
<div class="hexagon-in2" style="">
<span class="hexnum">4, 2</span>
</div>
</div>
</div>
<div class="icons"></div>
<div class="texts"></div>
<div class="notes"></div>
</div><div class="hexBlock hex-0-2" data-x="5" data-y="2">
<div class="hexagon hexagon2">
<div class="hexagon-in1">


Partager le fichier


Télécharger map.html


Télécharger map.html