consbio/mbtileserver
1
1
Fork 0
mirror of https://github.com/consbio/mbtileserver.git synced 2024-09-11 07:15:24 +03:00
Code Issues Packages Projects Releases Wiki Activity

Added compiled assets for #84

Browse Source
This commit is contained in:
Brendan C. Ward 2019-11-19 20:40:47 -08:00
parent fc91bd5a6a
commit 6263c3010a
7 changed files with 316 additions and 287 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
README.md
View File

@ -344,7 +344,7 @@ In short, we are planning to:
Dependencies are managed using go modules. Vendored dependencies are stored in `vendor` folder by using `go mod vendor`.
On Windows, it is necessary to install `gcc` in order to compile `mattn/go-sqlite3`.
On Windows, it is necessary to install `gcc` in order to compile `mattn/go-sqlite3`.
MinGW or [TDM-GCC](https://sourceforge.net/projects/tdm-gcc/) should work fine.
If you experience very slow builds each time, it may be that you need to first run
@ -388,7 +388,11 @@ But do not forget to perform it in the end.
## Changes
### 0.5.0 (in progress)
### 0.5.1 (in progress)
- fixed bug in map preview when bounds is not defined for a tileset (#84)
### 0.5.0
- Added Docker support (#74, #75)
- Fix case-sensitive mbtiles URLs (#77)

2
go.mod
View File

@ -10,6 +10,8 @@ require (
github.com/mattn/go-isatty v0.0.7 // indirect
github.com/mattn/go-sqlite3 v1.10.0
github.com/pkg/errors v0.8.1 // indirect
github.com/shurcooL/httpfs v0.0.0-20190707220628-8d4bc4ba7749 // indirect
github.com/shurcooL/vfsgen v0.0.0-20181202132449-6a9ea43bcacd // indirect
github.com/sirupsen/logrus v1.4.0
github.com/spf13/cobra v0.0.3
github.com/spf13/pflag v1.0.3 // indirect

4
go.sum
View File

@ -32,6 +32,10 @@ github.com/pkg/errors v0.8.1 h1:iURUrRGxPUNPdy5/HRSm+Yj6okJ6UtLINN0Q9M4+h3I=
github.com/pkg/errors v0.8.1/go.mod h1:bwawxfHBFNV+L2hUp1rHADufV3IMtnDRdf1r5NINEl0=
github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
github.com/shurcooL/httpfs v0.0.0-20190707220628-8d4bc4ba7749 h1:bUGsEnyNbVPw06Bs80sCeARAlK8lhwqGyi6UT8ymuGk=
github.com/shurcooL/httpfs v0.0.0-20190707220628-8d4bc4ba7749/go.mod h1:ZY1cvUeJuFPAdZ/B6v7RHavJWZn2YPVFQ1OSXhCGOkg=
github.com/shurcooL/vfsgen v0.0.0-20181202132449-6a9ea43bcacd h1:ug7PpSOB5RBPK1Kg6qskGBoP3Vnj/aNYFTznWvlkGo0=
github.com/shurcooL/vfsgen v0.0.0-20181202132449-6a9ea43bcacd/go.mod h1:TrYk7fJVaAttu97ZZKrO9UbRa8izdowaMIZcxYMbVaw=
github.com/sirupsen/logrus v1.4.0 h1:yKenngtzGh+cUSSh6GWbxW2abRqhYUSR/t/6+2QqNvE=
github.com/sirupsen/logrus v1.4.0/go.mod h1:LxeOpSwHxABJmUn/MG1IvRgCAasNZTLOkJPxbbu5VWo=
github.com/spf13/cobra v0.0.3 h1:ZlrZ4XsMRm04Fr5pSFxBgfND2EBVa1nLpiy1stUsX/8=

24
handlers/assets_vfsdata.go
View File

File diff suppressed because one or more lines are too long

318
handlers/templates/map.html
View File

@ -1,168 +1,192 @@
{{ define "map" }}
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>{{.ID}} Preview</title>
<script src="/static/core.min.js"></script>
<link href="/static/core.min.css" rel="stylesheet" />
<style>
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
height: 100%;
}
h4 {
margin: 0;
}
#Map {
position: absolute;
top:0;
left:0;
bottom:0;
right:0;
border-top: 2px solid #AAA;
}
.basemap img {
width: 36px;
}
.info {
padding: 6px 8px;
font: 14px/16px Arial, Helvetica, sans-serif;
background: white;
background: rgba(255,255,255,0.8);
box-shadow: 0 0 15px rgba(0,0,0,0.2);
border-radius: 5px;
position: absolute;
z-index: 2000;
top: 10px;
right: 10px;
}
.info h3 {
margin: 0;
}
</style>
</head>
<body>
<div id="Map"></div>
<script>
var basemaps = [
L.tileLayer('//{s}.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles &copy; Esri &mdash; Esri, DeLorme, NAVTEQ, TomTom, Intermap, iPC, USGS, FAO, NPS, NRCAN, GeoBase, Kadaster NL, Ordnance Survey, Esri Japan, METI, Esri China (Hong Kong), and the GIS User Community',
subdomains: ['server', 'services'],
label: 'ESRI Topo'
}),
L.tileLayer('//server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles &copy; Esri &mdash; Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community',
label: 'ESRI Imagery'
}),
L.tileLayer('//{s}.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles &copy; Esri &mdash; Esri, DeLorme, NAVTEQ',
maxZoom: 16,
subdomains: ['server', 'services'],
label: 'ESRI Gray'
}),
L.tileLayer('//{s}.arcgisonline.com/arcgis/rest/services/Elevation/World_Hillshade/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Esri, USGS, NGA, NASA, CGIAR, N Robinson, NCEAS, NLS, OS, NMA, Geodatastyrelsen, Rijkswaterstaat, GSA, Geoland, FEMA, Intermap and the GIS user community',
maxZoom: 23,
subdomains: ['server', 'services'],
label: 'ESRI Elevation'
})
];
/*var layer = L.mapbox.tileLayer('{{.URL}}')
.on('ready', function() {
var b = this.getTileJSON().bounds; // have to shuffle these to match leaflet format
map.fitBounds([[b[1], b[0]], [b[3], b[2]]]);
});
*/
var map = L.map('Map', {});
var layer = null;
d3.json('./', function(tileJSON) {
if (tileJSON.bounds) {
var b = tileJSON.bounds;
// TODO: optimize and prevent jitter
map.fitBounds([[b[1], b[0]], [b[3], b[2]]]);
<head lang="en">
<meta charset="UTF-8" />
<title>{{.ID}} Preview</title>
<script src="/static/core.min.js"></script>
<link href="/static/core.min.css" rel="stylesheet" />
<style>
html {
height: 100%;
}
if (tileJSON.maxzoom && tileJSON.maxzoom < map.getZoom()){
map.setZoom(tileJSON.maxzoom);
body {
margin: 0;
padding: 0;
height: 100%;
}
h4 {
margin: 0;
}
#Map {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border-top: 2px solid #aaa;
}
.basemap img {
width: 36px;
}
.info {
padding: 6px 8px;
font: 14px/16px Arial, Helvetica, sans-serif;
background: white;
background: rgba(255, 255, 255, 0.8);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
border-radius: 5px;
position: absolute;
z-index: 2000;
top: 10px;
right: 10px;
}
.info h3 {
margin: 0;
}
</style>
</head>
<body>
<div id="Map"></div>
<script>
var basemaps = [
L.tileLayer(
"//{s}.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}",
{
attribution:
"Tiles &copy; Esri &mdash; Esri, DeLorme, NAVTEQ, TomTom, Intermap, iPC, USGS, FAO, NPS, NRCAN, GeoBase, Kadaster NL, Ordnance Survey, Esri Japan, METI, Esri China (Hong Kong), and the GIS User Community",
subdomains: ["server", "services"],
label: "ESRI Topo"
}
),
L.tileLayer(
"//server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
{
attribution:
"Tiles &copy; Esri &mdash; Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community",
label: "ESRI Imagery"
}
),
L.tileLayer(
"//{s}.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer/tile/{z}/{y}/{x}",
{
attribution:
"Tiles &copy; Esri &mdash; Esri, DeLorme, NAVTEQ",
maxZoom: 16,
subdomains: ["server", "services"],
label: "ESRI Gray"
}
),
L.tileLayer(
"//{s}.arcgisonline.com/arcgis/rest/services/Elevation/World_Hillshade/MapServer/tile/{z}/{y}/{x}",
{
attribution:
"Esri, USGS, NGA, NASA, CGIAR, N Robinson, NCEAS, NLS, OS, NMA, Geodatastyrelsen, Rijkswaterstaat, GSA, Geoland, FEMA, Intermap and the GIS user community",
maxZoom: 23,
subdomains: ["server", "services"],
label: "ESRI Elevation"
}
)
];
layer = L.tileLayer(tileJSON.tiles[0], {
minZoom: tileJSON.minzoom || 0,
maxZoom: tileJSON.maxzoom || 23
});
var map = L.map("Map", {});
map.addLayer(layer);
var layer = null;
d3.json("./", function(tileJSON) {
if (tileJSON.bounds) {
var b = tileJSON.bounds;
var legendJSON = tileJSON.legend;
if (legendJSON && legendJSON.search(/\{/) === 0) {
legendJSON = JSON.parse(legendJSON);
// Make sure this is the legend JSON structure we expect
if (legendJSON.length && legendJSON[0].elements) {
map.addControl(L.control.base64legend({
position: 'topright',
legends: legendJSON,
collapseSimple: true,
detectStretched: true
}));
// TODO: optimize and prevent jitter
map.fitBounds([
[b[1], b[0]],
[b[3], b[2]]
]);
} else {
map.fitWorld();
}
}
if (tileJSON.grids && tileJSON.grids.length > 0) {
var gridURL = tileJSON.grids[0];
var utfgrid = L.utfGrid(gridURL, {
resolution: 4,
pointerCursor: true,
mouseInterval: 66 // Delay for mousemove events
if (tileJSON.maxzoom && tileJSON.maxzoom < map.getZoom()) {
map.setZoom(tileJSON.maxzoom);
}
layer = L.tileLayer(tileJSON.tiles[0], {
minZoom: tileJSON.minzoom || 0,
maxZoom: tileJSON.maxzoom || 23
});
utfgrid.addTo(map);
var infoContainer = L.DomUtil.create('div', 'info', L.DomUtil.get('Map'));
var textNode = L.DomUtil.create('h3', '', infoContainer);
textNode.innerHTML = 'This service has UTF-8 Grids; see console for grid data.';
map.addLayer(layer);
var legendJSON = tileJSON.legend;
if (legendJSON && legendJSON.search(/\{/) === 0) {
legendJSON = JSON.parse(legendJSON);
// Make sure this is the legend JSON structure we expect
if (legendJSON.length && legendJSON[0].elements) {
map.addControl(
L.control.base64legend({
position: "topright",
legends: legendJSON,
collapseSimple: true,
detectStretched: true
})
);
}
}
utfgrid.on("mouseover", function(e){
console.log('UTF grid data:', e.data);
});
}
});
if (tileJSON.grids && tileJSON.grids.length > 0) {
var gridURL = tileJSON.grids[0];
var utfgrid = L.utfGrid(gridURL, {
resolution: 4,
pointerCursor: true,
mouseInterval: 66 // Delay for mousemove events
});
utfgrid.addTo(map);
map.zoomControl.setPosition('topleft');
map.addControl(L.control.zoomBox({modal: true, position:'topleft'}));
var infoContainer = L.DomUtil.create(
"div",
"info",
L.DomUtil.get("Map")
);
var textNode = L.DomUtil.create("h3", "", infoContainer);
textNode.innerHTML =
"This service has UTF-8 Grids; see console for grid data.";
var slider = L.control.range({
position: 'topleft',
min: 0,
max: 1,
value: 1,
step: 0.01,
orient: 'vertical',
iconClass: 'leaflet-range-icon'
});
utfgrid.on("mouseover", function(e) {
console.log("UTF grid data:", e.data);
});
}
});
slider.on('input change', function(e) {
layer.setOpacity(e.value);
});
map.zoomControl.setPosition("topleft");
map.addControl(
L.control.zoomBox({ modal: true, position: "topleft" })
);
map.addControl(slider);
var slider = L.control.range({
position: "topleft",
min: 0,
max: 1,
value: 1,
step: 0.01,
orient: "vertical",
iconClass: "leaflet-range-icon"
});
map.addControl(L.control.basemaps({
position: 'bottomright',
basemaps: basemaps,
tileX: 0,
tileY: 0,
tileZ: 1
}));
</script>
</body>
slider.on("input change", function(e) {
layer.setOpacity(e.value);
});
map.addControl(slider);
map.addControl(
L.control.basemaps({
position: "bottomright",
basemaps: basemaps,
tileX: 0,
tileY: 0,
tileZ: 1
})
);
</script>
</body>
</html>
{{ end }}

247
handlers/templates/map_gl.html
View File

@ -1,133 +1,128 @@
{{ define "map_gl" }}
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>{{.ID}} Preview</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.23.0/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.23.0/mapbox-gl.css' rel='stylesheet' />
<style>
body {
margin: 0;
padding: 0;
}
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<div id='map'></div>
<script>
var basemapSource = {
type: 'raster',
tiles: ['http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}'],
tileSize: 256,
attribution: 'Tiles &copy; Esri &mdash; Source: USGS, Esri, TANA, DeLorme, and NPS'
}
var basemapStyle = {
id: 'basemap',
type: 'raster',
source: 'basemap',
minzoom: 0,
maxzoom: 22
}
var map;
mapboxgl.util.getJSON('{{.URL}}', function (e, tilejson) {
var layers = [];
tilejson.vector_layers.forEach(function (srcLyr, i) {
layers.push({
id: 'overlay-poly-' + i,
source: 'overlay',
'source-layer': srcLyr.id,
"filter": [
"==",
"$type",
"Polygon"
],
type: 'fill',
paint: {
'fill-color': 'orange',
'fill-opacity': 0.5,
'fill-outline-color': 'red',
}
});
layers.push({
id: 'overlay-line-' + i,
source: 'overlay',
'source-layer': srcLyr.id,
"filter": [
"==",
"$type",
"LineString"
],
type: 'line',
paint: {
'line-color': 'red',
'line-opacity': 0.75,
'line-width': 2
}
});
layers.push({
id: 'overlay-point-' + i,
source: 'overlay',
'source-layer': srcLyr.id,
"filter": [
"==",
"$type",
"Point"
],
type: 'circle',
paint: {
'circle-radius': 6,
'circle-color': '#F00',
'circle-opacity': 1
}
});
});
map = new mapboxgl.Map({
container: 'map',
style: {
version: 8,
sources: {
basemap: basemapSource,
overlay: {
type: 'vector',
tiles: tilejson.tiles,
minzoom: tilejson.minzoom,
maxzoom: tilejson.maxzoom
}
},
layers: [basemapStyle].concat(layers)
},
maxZoom: basemapStyle.maxzoom,
zoom: (tilejson.bounds) ? 0 : tilejson.center[2],
center: tilejson.center.slice(0, 2)
});
if (tilejson.bounds) {
var bounds = [tilejson.bounds.slice(0, 2), tilejson.bounds.slice(2, tilejson.bounds.length)];
map.fitBounds(bounds);
<head>
<meta charset="utf-8" />
<title>{{.ID}} Preview</title>
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.23.0/mapbox-gl.js"></script>
<link
href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.23.0/mapbox-gl.css"
rel="stylesheet"
/>
<style>
body {
margin: 0;
padding: 0;
}
map.addControl(new mapboxgl.Navigation());
});
</script>
</body>
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var basemapSource = {
type: "raster",
tiles: [
"http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}"
],
tileSize: 256,
attribution:
"Tiles &copy; Esri &mdash; Source: USGS, Esri, TANA, DeLorme, and NPS"
};
var basemapStyle = {
id: "basemap",
type: "raster",
source: "basemap",
minzoom: 0,
maxzoom: 22
};
var map;
mapboxgl.util.getJSON("{{.URL}}", function(e, tilejson) {
var layers = [];
tilejson.vector_layers.forEach(function(srcLyr, i) {
layers.push({
id: "overlay-poly-" + i,
source: "overlay",
"source-layer": srcLyr.id,
filter: ["==", "$type", "Polygon"],
type: "fill",
paint: {
"fill-color": "orange",
"fill-opacity": 0.5,
"fill-outline-color": "red"
}
});
layers.push({
id: "overlay-line-" + i,
source: "overlay",
"source-layer": srcLyr.id,
filter: ["==", "$type", "LineString"],
type: "line",
paint: {
"line-color": "red",
"line-opacity": 0.75,
"line-width": 2
}
});
layers.push({
id: "overlay-point-" + i,
source: "overlay",
"source-layer": srcLyr.id,
filter: ["==", "$type", "Point"],
type: "circle",
paint: {
"circle-radius": 6,
"circle-color": "#F00",
"circle-opacity": 1
}
});
});
map = new mapboxgl.Map({
container: "map",
style: {
version: 8,
sources: {
basemap: basemapSource,
overlay: {
type: "vector",
tiles: tilejson.tiles,
minzoom: tilejson.minzoom,
maxzoom: tilejson.maxzoom
}
},
layers: [basemapStyle].concat(layers)
},
maxZoom: basemapStyle.maxzoom,
zoom: tilejson.bounds ? 0 : tilejson.center[2],
center: tilejson.center.slice(0, 2)
});
if (tilejson.bounds) {
var bounds = [
tilejson.bounds.slice(0, 2),
tilejson.bounds.slice(2, tilejson.bounds.length)
];
map.fitBounds(bounds);
}
map.addControl(new mapboxgl.Navigation());
});
</script>
</body>
</html>
{{ end }}
{{ end }}

BIN
mbtiles/testdata/geography-class-png-no-bounds.mbtiles vendored Normal file
View File

Binary file not shown.