<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Map showing Wikidata items linked to OSM</title> <link rel="stylesheet" href="{{ url_for('static', filename='fork-awesome/css/fork-awesome.css')}}"> <link rel="stylesheet" href="{{ url_for('static', filename='css/map.css') }}?time={{time}}" type="text/css" media="all" /> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"> <link rel="stylesheet" href="{{ url_for('static', filename='Leaflet.ExtraMarkers/leaflet.extra-markers.min.css') }}" type="text/css" media="all" /> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous"> </head> <body> <div id="map"> </div> <button id="load-btn" type="button" class="btn btn-primary btn-lg"> <span id="loading" class="d-none"> <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Loading ... </span> <span id="load-text"> Load Wikidata items </span> </button> <div id="sidebar"> <div id="search-and-isa"> <div class="card m-2" id="search-card"> <div class="card-body"> <form id="search-form"> <div> <input id="search-text" placeholder="place"> <button type="submit" id="search-btn" class="btn btn-primary">search</button> </div> </form> <div id="search-results"> </div> </div> </div> <div class="card d-none m-2" id="link-status-card"> <div class="card-body"> <div class="h5 card-title">OSM/Wikidata link status</div> <div> <input type="checkbox" id="linked" checked> <label for="linked">Wikidata items tagged in OSM: <span id="linked-count"></span></label><br> <input type="checkbox" id="not-linked" checked> <label for="not-linked">Wikidata items not tagged in OSM: <span id="not-linked-count"></span></label> </div> </div> </div> <div class="card d-none m-2" id="isa-card"> <div class="card-body"> <div class="h5 card-title">item types</div> <div><a href="#" id="show-all-isa">show all</a></div> <div id="isa-list"> </div> </div> </div> </div> <div class="card d-none m-2" id="detail-card"> <div class="card-body"> <div class="h4 card-title"> <span id="detail-header">item detail</span> <button type="button" class="btn-close float-end" id="close-detail"></button> </div> <div id="detail"></div> <div id="candidates"></div> </div> </div> </div> </div> <script> var start_lat = {{ lat | tojson }}; var start_lng = {{ lng | tojson }}; var zoom = {{ zoom | tojson }}; </script> <script src="https://unpkg.com/axios@latest"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script> <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" crossorigin="anonymous"></script> <script type="text/javascript" src="{{ url_for('static', filename='Leaflet.ExtraMarkers/leaflet.extra-markers.min.js') }}"></script> <script type="text/javascript" src="{{ url_for('static', filename='js/map.js') }}?time={{time}}"></script> </body> </html>