1

我正在使用这个http://blog.carte-libre.fr/index.php?post/2012/02/12/Serve-all-MBTtile-features-with-PHP-script创建一个托管 mbtiles 的 web 地图在我的服务器上。

我想使用存储在不同服务器（serv1、serv2、serv3）上的几个 mbtile（mb1、mb2、mb3）创建可选层。

脚本是

wax.tilejson(
    'mbtiles-server.php?db=mb1.mbtiles',
    function(tilejson) {

        var omq = new L.TileLayer(
            'http://otile2.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png', {
                maxZoom: 14,
                attribution: 'OpenStreetMap - MapQuest',
                opacity: 0.4,
        });//modify to call mb2 from serv3

        var power = new L.TileLayer(
            "mbtiles-server.php?db=mb1.mbtiles&z={z}&x={x}&y={y}", {
                maxZoom: 14,
                attribution: 'OpenStreetMap - CL 2012-02-05',
        });

        var map = new L.Map('map', {
            center: new L.LatLng(46, 0),
            zoom: 6,
            layers: [omq, power]
        });

        map.addControl( new L.Control.Layers( { "OpenMapQuest": omq }, { "Power": power }));

        wax.leaf.interaction(map, tilejson);
        document.getElementById("legend").innerHTML = tilejson.legend;
});

假设每个 mbtiles 文件夹中有一个 php 脚本文件，我如何修改脚本以能够从 serv3 调用 mb2，以便我在 2 个服务器上托管 2 个 mbtiles 的 2 层？

欢迎任何建议！

4

1 回答 1

1

更新...

问题是尝试加载多个 mbtile，同时为每个图层具有相应的弹出交互（每个 mbtile 包含交互，在 TileMill 中创建）。

我选择使用以下方法将 mbtiles 加载到地图中：

var base1 = L.tileLayer("http://ms1.mysite.com/folder1/mbtiles-server.php?db=base1layer.mbtiles&z={z}&x={x}&y={y}.png"
var base2 = L.tileLayer("http://ms2.mysite.com/folder2/mbtiles-server.php?db=base2layer.mbtiles&z={z}&x={x}&y={y}.png"

然后从单独的 geojson 文件添加交互。

var onEachFeature_Polygon = function (feature, layer) {
    //polygon geojson file contains center points
    var centerLat = feature.properties.y;
    var centerLon = feature.properties.x;
    var centLatLon = new L.LatLng(centerLat, centerLon); //this is used to place the popup in the "mouseover" function
    layer.setStyle(tooltip_default_style);
    if (feature.properties && feature.properties.Name) {//fields Name, Population, RI10K
        var list = "<b>" + feature.properties.Name + "</b>" + "<br>" + "<i>" + "Population: " + feature.properties.Population + "</i>" + "<br>" + "<i>" + "Income 10,000+: " + feature.properties.RI10K + "</i>" + "<br>";//end of tooltip list
    layer.bindPopup(list);
    }
    layer.on("mouseover", function (e) {
        layer.setStyle(tooltip_hover_style);              
        layer.openPopup(centLatLon);
    });
    layer.on("mouseout", function (e) { layer.setStyle(tooltip_default_style) });         
}

//this is the onEachFeature function called when the statsJSON layer is added to the map 
var statsinteractive = new L.GeoJSON(statsgeo, { onEachFeature: onEachFeature_Polygon }); 
statsinteractive.addTo(map);

仍然想了解或被引导到一个明确概述的方法来从 mbtile 文件“调用”交互。

同时，我希望这对有类似问题的人有所帮助。

于 2014-03-28T08:18:58.397 回答