Complete basic web implementation
This commit is contained in:
parent
a93283d236
commit
f6d3536200
30
static/map.js
Normal file
30
static/map.js
Normal file
|
@ -0,0 +1,30 @@
|
||||||
|
function update_map()
|
||||||
|
{
|
||||||
|
var request = new XMLHttpRequest();
|
||||||
|
request.open("GET","/render/45/11.svg");
|
||||||
|
|
||||||
|
request.addEventListener('load', function(event) {
|
||||||
|
if (request.status >= 200 && request.status < 300) {
|
||||||
|
var svgblob = new Blob([request.responseText], { type: "image/svg+xml" });
|
||||||
|
|
||||||
|
document.getElementById("svgcontainer").innerHTML = request.responseText;
|
||||||
|
|
||||||
|
link_container = document.getElementById("downloadlink");
|
||||||
|
link_container.innerHTML = '';
|
||||||
|
|
||||||
|
var blobUrl = URL.createObjectURL(svgblob);
|
||||||
|
|
||||||
|
var link = document.createElement("a"); // Or maybe get it from the current document
|
||||||
|
link.href = blobUrl;
|
||||||
|
link.download = "map.svg";
|
||||||
|
link.innerHTML = "Download this map.";
|
||||||
|
link_container.appendChild(link); // Or append it whereever you want
|
||||||
|
|
||||||
|
URL.revokeObjectURL(blobUrl);
|
||||||
|
} else {
|
||||||
|
console.warn(request.statusText, request.responseText);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
request.send();
|
||||||
|
}
|
28
views/index.tpl
Normal file
28
views/index.tpl
Normal file
|
@ -0,0 +1,28 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="description" content="Azimuthal-equidistant map generator.">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="me" href="https://chaos.social/@cfr34k">
|
||||||
|
<title>QSOMap: Azimuthal-equidistant SVG map generator</title>
|
||||||
|
|
||||||
|
<!--link rel="stylesheet" href="https://www.tkolb.de/main.css"-->
|
||||||
|
<script defer src="static/map.js" type="text/javascript"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>QSOMap: Azimuthal-equidistant SVG map generator</h1>
|
||||||
|
<p>Here you can generate a map in azimuthal-equidistant projections for any point on Earth. You get a map where the specified coordinate is in the center, and all other locations are projected such that locations with the same physical distance from the given coordinate are also the same distance from the center on the map.</p>
|
||||||
|
<p>The generated output is a Scalable Vector Graphics (SVG) image that can be edited as needed. I recommend <a href="https://inkscape.org">Inkscape</a> as an SVG editor.</p>
|
||||||
|
<p><strong>Please note:</strong> It may take a few seconds to generate the map. Please give it some time. The map will appear below the form.</p>
|
||||||
|
<form action="#" onsubmit="update_map();">
|
||||||
|
<label for="lat">Map center latitude:</label>
|
||||||
|
<input type="text" id="lat" name="lat" value="49.585"><br>
|
||||||
|
<label for="lon">Map center longitude:</label>
|
||||||
|
<input type="text" id="lon" name="lon" value="11.015"><br>
|
||||||
|
<input type="submit" value="Generate!">
|
||||||
|
</form>
|
||||||
|
<div id="downloadlink"></div>
|
||||||
|
<div id="svgcontainer"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
15
web.py
15
web.py
|
@ -1,14 +1,25 @@
|
||||||
#!/usr/bin/env python3
|
#!/usr/bin/env python3
|
||||||
|
|
||||||
from bottle import response, route, run, template
|
from bottle import response, route, run, template, static_file
|
||||||
from io import StringIO
|
from io import StringIO
|
||||||
import qsomap
|
import qsomap
|
||||||
|
|
||||||
@route('/render/<lat>/<lon>')
|
@route('/render/<lat>/<lon>.svg')
|
||||||
def render(lat, lon):
|
def render(lat, lon):
|
||||||
svg_stream = StringIO()
|
svg_stream = StringIO()
|
||||||
qsomap.render(float(lat), float(lon), svg_stream, None)
|
qsomap.render(float(lat), float(lon), svg_stream, None)
|
||||||
response.content_type = 'image/svg+xml'
|
response.content_type = 'image/svg+xml'
|
||||||
return svg_stream.getvalue()
|
return svg_stream.getvalue()
|
||||||
|
|
||||||
|
|
||||||
|
@route('/')
|
||||||
|
@route('/index.html')
|
||||||
|
def index():
|
||||||
|
return template('index')
|
||||||
|
|
||||||
|
|
||||||
|
@route('/static/<filename:path>')
|
||||||
|
def send_static(filename):
|
||||||
|
return static_file(filename, root='./static')
|
||||||
|
|
||||||
run(host='localhost', port=8080)
|
run(host='localhost', port=8080)
|
||||||
|
|
Loading…
Reference in a new issue