assets.js.config.tileLayers.js Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of graphhopper-web Show documentation
Use the GraphHopper routing engine as a web-service
There is a newer version: 9.1
var ghenv = require("./options.js").options;
var tfAddition = '';
if (ghenv.thunderforest.api_key)
    tfAddition = '?apikey=' + ghenv.thunderforest.api_key;

var mapilionAddition = '';
if (ghenv.mapilion.api_key)
    mapilionAddition = '?key=' + ghenv.mapilion.api_key;

var osAPIKey = 'mapsgraph-bf48cc0b';
if (ghenv.omniscale.api_key)
    osAPIKey = ghenv.omniscale.api_key;

var osmAttr = '© OpenStreetMap contributors';

// Automatically enable high-DPI tiles if provider and browser support it.
var retinaTiles = L.Browser.retina;

var lyrk = L.tileLayer('https://tiles.lyrk.org/' + (retinaTiles ? 'lr' : 'ls') + '/{z}/{x}/{y}?apikey=6e8cfef737a140e2a58c8122aaa26077', {
    attribution: osmAttr + ', Lyrk'
});

var omniscale = L.tileLayer('https://maps.omniscale.net/v2/' +osAPIKey + '/style.default/{z}/{x}/{y}.png' + (retinaTiles ? '?hq=true' : ''), {
    layers: 'osm',
    attribution: osmAttr + ', © Omniscale'
});

// Not an option as too fast over limit.
// var mapbox= L.tileLayer('https://{s}.tiles.mapbox.com/v4/peterk.map-vkt0kusv/{z}/{x}/{y}' + (retinaTiles ? '@2x' : '') + '.png?access_token=pk.eyJ1IjoicGV0ZXJrIiwiYSI6IkdFc2FJd2MifQ.YUd7dS_gOpT3xrQnB8_K-w', {
//     attribution: osmAttr + ', © MapBox'
// });

var sorbianLang = L.tileLayer('http://a.tile.openstreetmap.de/tiles/osmhrb/{z}/{x}/{y}.png', {
    attribution: osmAttr + ', © Alberding GmbH, CC-BY-SA'
});

var thunderTransport = L.tileLayer('https://{s}.tile.thunderforest.com/transport/{z}/{x}/{y}.png' + tfAddition, {
    attribution: osmAttr + ', Thunderforest Transport'
});

var thunderCycle = L.tileLayer('https://{s}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png' + tfAddition, {
    attribution: osmAttr + ', Thunderforest Cycle'
});

var thunderOutdoors = L.tileLayer('https://{s}.tile.thunderforest.com/outdoors/{z}/{x}/{y}.png' + tfAddition, {
    attribution: osmAttr + ', Thunderforest Outdoors'
});

var thunderNeighbourhood = L.tileLayer('https://{s}.tile.thunderforest.com/neighbourhood/{z}/{x}/{y}.png' + tfAddition, {
    attribution: osmAttr + ', Thunderforest Neighbourhood'
});

var kurvigerLiberty = L.tileLayer('https://{s}-tiles.mapilion.com/raster/styles/kurviger-liberty/{z}/{x}/{y}{r}.png'+mapilionAddition, {
    subdomains: ['a', 'b', 'c', 'd', 'e'],
    attribution: osmAttr + ',© Kurviger © Mapilion © OpenMapTiles'
});

var wrk = L.tileLayer('http://{s}.wanderreitkarte.de/topo/{z}/{x}/{y}.png', {
    attribution: osmAttr + ', WanderReitKarte',
    subdomains: ['topo4', 'topo', 'topo2', 'topo3']
});

var osm = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: osmAttr
});

var osmde = L.tileLayer('http://{s}.tile.openstreetmap.de/tiles/osmde/{z}/{x}/{y}.png', {
    attribution: osmAttr
});

var mapLink = 'Esri';
var wholink = 'i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community';
var esriAerial = L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
    attribution: '© ' + mapLink + ', ' + wholink,
    maxZoom: 18
});

var availableTileLayers = {
    "Omniscale": omniscale,
    "OpenStreetMap": osm,
    "Esri Aerial": esriAerial,
    "TF Transport": thunderTransport,
    "TF Cycle": thunderCycle,
    "TF Outdoors": thunderOutdoors,
    "TF Neighbourhood": thunderNeighbourhood,
    "Kurviger Liberty": kurvigerLiberty,
    "Lyrk": lyrk,
    "WanderReitKarte": wrk,
    "Sorbian Language": sorbianLang,
    "OpenStreetMap.de": osmde
};

var overlays;
module.exports.enableVectorTiles = function () {
    var omniscaleGray = L.tileLayer('https://maps.omniscale.net/v2/' +osAPIKey + '/style.grayscale/layers.world,buildings,landusages,labels/{z}/{x}/{y}.png?' + (retinaTiles ? '&hq=true' : ''), {
        layers: 'osm',
        attribution: osmAttr + ', © Omniscale'
    });
    availableTileLayers["Omniscale Dev"] = omniscaleGray;

    require('leaflet.vectorgrid');
    var vtLayer = L.vectorGrid.protobuf("/mvt/{z}/{x}/{y}.mvt?details=max_speed&details=road_class&details=road_environment", {
      rendererFactory: L.canvas.tile,
      maxZoom: 20,
      minZoom: 10,
      interactive: true,
      vectorTileLayerStyles: {
        'roads': function(properties, zoom) {
            // weight == line width
            var color, opacity = 1, weight = 1, rc = properties.road_class;
            // if(properties.speed < 30) console.log(properties)
            if(rc == "motorway") {
                color = '#dd504b'; // red
                weight = 3;
            } else if(rc == "primary" || rc == "trunk") {
                color = '#e2a012'; // orange
                weight = 2;
            } else if(rc == "secondary") {
                weight = 2;
                color = '#f7c913'; // yellow
            } else {
                color = "#aaa5a7"; // grey
            }
            if(zoom > 16)
               weight += 3;
            else if(zoom > 15)
               weight += 2;
            else if(zoom > 13)
               weight += 1;

            return {
                weight: weight,
                color: color,
                opacity: opacity
            }
        },
      },
    })
    .on('click', function(e) {
    })
    .on('mouseover', function(e) {
        console.log(e.layer.properties);
        // remove route info
        $("#info").children("div").remove();
        // remove last vector tile info
        $("#info").children("ul").remove();

        var list = "";
        $.each(e.layer.properties, function (key, value) {
            list += "" + key + ": " + value + "";
        });
        $("#info").append(""+list+"");
        $("#info").show();
    }).on('mouseout', function (e) {
//        $("#info").html("");
    });
    overlays = { "Local MVT": vtLayer };
}

module.exports.activeLayerName = "Omniscale";
module.exports.defaultLayer = omniscale;

module.exports.getAvailableTileLayers = function () {
    return availableTileLayers;
};

module.exports.getOverlays = function () {
    return overlays;
};

module.exports.selectLayer = function (layerName) {
    var defaultLayer = availableTileLayers[layerName];
    if (!defaultLayer)
        defaultLayer = module.exports.defaultLayer;

    return defaultLayer;
};