mirror of
https://github.com/consbio/mbtileserver.git
synced 2024-09-11 07:15:24 +03:00
Added compiled assets for #84
This commit is contained in:
parent
fc91bd5a6a
commit
6263c3010a
@ -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
2
go.mod
@ -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
4
go.sum
@ -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=
|
||||
|
File diff suppressed because one or more lines are too long
@ -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 © Esri — 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 © Esri — 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 © Esri — 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 © Esri — 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 © Esri — 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 © Esri — 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 }}
|
||||
|
@ -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 © Esri — 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 © Esri — 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
BIN
mbtiles/testdata/geography-class-png-no-bounds.mbtiles
vendored
Normal file
Binary file not shown.
Loading…
Reference in New Issue
Block a user