<!DOCTYPE html> <html> {% include 'header.html' %} <link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin=""/> {% include 'banner.html' %} {% include 'menu.html' %} <div id="mapid" style="height: 500px;"></div> {% include 'footer.html' %} <script type="text/javascript"> let scriptRoot = {{ request.script_root|tojson|safe }}; // examples document.addEventListener("DOMContentLoaded", function(){ var count = fetch("/api/getCount") .then((resp) => resp.json()) .then(function (data) { count = data["sequences"]; console.log(count); span = document.getElementById("Counter"); txt = document.createTextNode(count); span.appendChild(txt); }); }); </script> <!-- Make sure you put this AFTER Leaflet's CSS --> <script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js" integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew==" crossorigin=""></script> <script> //drawMap drawMap() </script> </body> </html>