Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 26 additions & 0 deletions .github/workflows/deploy-tileserver.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
name: Deploy Tile Server Static Site
on:
push:
branches:
- main
workflow_dispatch:
permissions:
contents: read
id-token: write
jobs:
deploy-preview:
runs-on: ubuntu-latest
if: >
github.event.workflow_run.event == 'pull_request' &&
github.event.workflow_run.conclusion == 'success'
steps:
- name: Deploy via S3
uses: jakejarvis/s3-sync-action@master
with:
args: --acl public-read --follow-symlinks --delete --exclude '.git/*' --exclude '.github/*'
env:
AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}
AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
AWS_REGION: ${{ secrets.AWS_REGION }}
SOURCE_DIR: "./dist"
Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copied from Americana but not yet fully implemented here.

1 change: 1 addition & 0 deletions static/data/v3.json

Large diffs are not rendered by default.

Binary file added static/favicon.ico
Binary file not shown.
210 changes: 210 additions & 0 deletions static/index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,210 @@
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans-Regular.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans-Italic.ttf');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans-Bold.ttf');
font-weight: bold;
font-style: normal;
}

body{
background-color: #fff;
color: #212121;
font-family:'OpenSans', sans-serif, Arial;
font-size: 14px;
margin:0;
background-repeat:no-repeat !important;
background-size: contain !important;
background-image: url(/images/header-map-1280px.png);
}
a{
color: #499DCE;
transition: color .2s;
}
a:hover {
color: #395D73;
}
.title {
font-weight: bold;
font-size: 32px;
text-align:center;
margin:20px 0 0 0;
position:relative;
}
.title.light:after {
content: "light";
display: block;
position: absolute;
left: 50%;
bottom: -5px;
color: #499DCE;
font-size:.8em;
}
section {
margin: 15px auto;
width: 930px;
padding: 30px 0;
}
.title img {
width: 290px;
}
.subtitle {
font-size: 20px;
font-style: italic;
font-weight:normal;
text-align:center;
margin:10px 0 10px 0;
}
.box-header {
text-align:left;
text-transform:uppercase;
border:1px solid #ededed;
margin:25px 0 0 0;
padding:12px 30px;
font-size:20px;
background:#fff;
}
.item {
background:#fff;
height: 191px;
border: 1px solid #ededed;
border-top:none;
}
.item:nth-child(odd) {
background-color:#fbfbfb;
}
.item img {
position: absolute;
display: block;
margin: 30px;
width: 128px;
height: 128px;
border: 1px solid #ccc;
}
.icon img {
position: relative;
width: 16px;
height: 16px;
display: inline;
margin: 0 3px -3px 0;
border: 0;
padding: 0;
}
.details {
float:left;
height: 128px;
padding: 20px 30px 20px 188px;
}
.details h3 {
font-size:18px;
margin-top: 25px;
}
.details p {
padding:0;
margin:18px 0;
}
.viewers {
float:right;
text-align:center;
width: 120px;
margin-top: 25px;
padding-right: 30px;
}
.btn {
display:block;
margin: 0;
line-height: 36px;
}
.btn:first-child {
position: relative;
padding: 0;
overflow: hidden;
border-radius:4px;
background-color: #499DCE;
background: linear-gradient(90deg, #5aaad8, #4a9ecf);
color: #fff;
text-decoration: none;
font-weight: bold;
}
.btn:first-child:hover {
background: #395D73;
}
footer {
width:100%;
border-top:1px solid #ededed;
text-align:center;
color:#b3b3b3;
padding-top:10px;
font-size:12px;
}
footer img {
width: 113px;
height: 31px;
}
footer .t {
display:none;
}
footer p {
margin-top:0;
}
footer a {
text-decoration: none;
}
.details h3, .identifier {
max-width: 550px;
word-break: break-all;
}

/* Responsive */
@media (max-width: 950px) {
section{
margin: 0;
width: 96%;
padding: 2%;
}
}
@media (max-width: 600px) {
.title{
margin: 25px 0 0 0;
}
.title.light:after {
font-size:.6em;
}
.title img {
width: 200px;
}
.subtitle {
font-size: 20px;
margin: 0 0 35px 0;
}
.item {
height: 245px;
}
.viewers {
float: left;
text-align: left;
width: 100%;
margin-left: 30px;
margin-top: 15px;
}
.viewers a {
display: inline-block;
vertical-align: middle;
}
.btn {
margin: 0 20px 0 0;
}
.btn:first-child {
padding: 0 20px;
}
}
59 changes: 59 additions & 0 deletions static/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>OpenMapTiles Community Vector Tile Server</title>
<link rel="stylesheet" type="text/css" href="index.css" />
<link rel="alternate" type="application/rss+xml" title="Build status" href="rss.xml" />
<script>
function toggle_xyz(id) {
var el = document.getElementById(id);
var s = el.style;
s.display = s.display == 'none' ? 'inline-block' : 'none';
el.setSelectionRange(0, el.value.length);
return false;
}
</script>
</head>
<body>
<section>
<h1 class="title">
<a href="https://github.com/ZeLonewolf/openstreetmap-americana"><img src="osm-americana-logo.png" alt="OSM Americana Logo" /></a><br/>
Community Vector Tile Server
</h1>
<h2 class="subtitle">Part of the OSM Americana project</h2>
<div style="text-align:center; margin-bottom:70px"><a href="usage.html">Usage policy and CORS white list</a></div>
<h2 class="box-header">OpenMapTiles</h2>
<div class="box">
<div class="item">
<img src="openmaptiles-logo.png" alt=" preview" />
<div class="details">
<h3></h3>
<p class="identifier">OpenMapTiles vector tiles as used by OSM Americana.
<br>Rendered on servers provided by <a href="https://openstreetmap.us/">OSMUS</a>.
<br>Zoom 13 building merge is disabled, additional languages from <a href="https://wikidata.org/">Wikidata</a>.
<br>Schema <a href="https://openmaptiles.org/">&copy; OpenMapTiles</a>, map data <a href="https://openstreetmap.org/copyright">&copy; OpenStreetMap contributors</a>.</p>
<p class="services">
services: <a href="https://dwuxtsziek7cf.cloudfront.net/planet.json">TileJSON</a> | <a href="rss.xml" class="icon"><img src="rss.png" description="RSS icon" />Build Status</a>
</p>
</div>
<div class="viewers">
<a class="btn" href="/inspect.html">Inspect</a>
</div>
</div>
</div>
</section>
<footer>
<p>
Rendering by <a href="https://github.com/onthegomap/planetiler" target="_blank">Planetiler</a>, an open-source product by <a href="https://twitter.com/msb5014" target="_blank">Mike Barry</a>.
</p>
<p>
Tiles are stored in <a href="https://protomaps.com/docs/pmtiles" target="_blank">PMTiles</a> format, a vector tile format for server-less hosting, by <a href="https://protomaps.com/" target="_blank">Protomaps</a> creator <a href="https://twitter.com/bdon" target="_blank">Brandon Liu</a>.
</p>
<p>
This page is derived from <a href="https://github.com/maptiler/tileserver-gl" target="_blank">TileServer GL (tileserver-gl-light v4.4.0)</a> – an open-source project from <a href="https://www.maptiler.com/" target="_blank">MapTiler</a>.
</p>
</footer>
</body>
</html>
62 changes: 62 additions & 0 deletions static/inspect.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Raw Vector Tile Data View</title>
<link rel="stylesheet" type="text/css" href="/maplibre-gl.css" />
<link rel="stylesheet" type="text/css" href="/maplibre-gl-inspect.css" />
<script>if (typeof Symbol !== 'undefined') { document.write('<script src="https://unpkg.com/maplibre-gl@latest/dist/maplibre-gl.js"><\/script>'); } else { document.write('<script src="/maplibre-gl-compat.js"><\/script>'); }</script>
<script>if (typeof Symbol !== 'undefined') { document.write('<script src="https://github.com/acalcutt/maplibre-gl-inspect/releases/download/v1.4.6/maplibre-gl-inspect.min.js"><\/script>'); } else { document.write('<script src="/maplibre-gl-inspect-compat.min.js"><\/script>'); }</script>
<style>
body {background:#fff;color:#333;font-family:Arial, sans-serif;}
#map {position:absolute;top:0;left:0;right:250px;bottom:0;}
h1 {position:absolute;top:5px;right:0;width:240px;margin:0;line-height:20px;font-size:20px;}
#layerList {position:absolute;top:35px;right:0;bottom:0;width:240px;overflow:auto;}
#layerList div div {width:15px;height:15px;display:inline-block;}
</style>
</head>
<body>
<h1></h1>
<div id="map"></div>
<div id="layerList"></div>
<pre id="propertyList"></pre>
<script>
var map = new maplibregl.Map({
container: 'map',
hash: true,
maplibreLogo: true,
style: {
version: 8,
sources: {
'vector_layer_': {
type: 'vector',
url: 'https://dwuxtsziek7cf.cloudfront.net/planet.json'
}
},
layers: []
}
});
map.addControl(new maplibregl.NavigationControl());
var inspect = new MaplibreInspect({
showInspectMap: true,
showInspectButton: false
});
map.addControl(inspect);
map.on('styledata', function() {
var layerList = document.getElementById('layerList');
layerList.innerHTML = '';
Object.keys(inspect.sources).forEach(function(sourceId) {
var layerIds = inspect.sources[sourceId];
layerIds.forEach(function(layerId) {
var item = document.createElement('div');
item.innerHTML = '<div style="' +
'background:' + inspect.assignLayerColor(layerId) + ';' +
'"></div> ' + layerId;
layerList.appendChild(item);
});
})
});
</script>
</body>
</html>
45 changes: 45 additions & 0 deletions static/maplibre-gl-compat.js

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions static/maplibre-gl-inspect-compat.min.js

Large diffs are not rendered by default.

Loading