Closed soolengtan closed 9 years ago
hi saw ur contribution on l.map.sync. Tried it. i encounter a problem that my map is not able to sync. possible to advise. thanks. here is my code using requirejs
requirejs.config({ 'baseUrl': '../lib', 'paths': { 'leaflet.wms': '../leaflet.wms' ,//.js' 'L.Map.Sync': '../L.Map.Sync' //.js' } });
define(['leaflet', 'leaflet.wms','L.Map.Sync'], function(L,wms,sync) {
var BaseMapd = basecreateMap('base-map'); var overlayMap = createMap('overlay-map', true,'2007'); var tiledMap = createMap('tiled-map', true,'1988');
overlayMap._initSync(tiledMap); tiledMap._initSync(overlayMap); BaseMapd._initSync(overlayMap); BaseMapd._initSync(tiledMap); overlayMap._initSync(BaseMapd); tiledMap._initSync(BaseMapd);
overlayMap.sync(tiledMap); tiledMap.sync(overlayMap); BaseMapd.sync(overlayMap); BaseMapd.sync(tiledMap); overlayMap.sync(BaseMapd); tiledMap.sync(BaseMapd);
function basecreateMap(div) { // Map configuration var map1 = L.map(div);
map1.setView([1.3, 103.7],14); var basemaps = { 'Basemap': basemap(), }; basemaps['Basemap'].addTo(map1);
// L.control.layers(basemaps).addTo(map);
return map1;
}
function createMap(div, tiled,name) { // Map configuration var map = L.map(div,{maxZoom: 17, minZoom: 12,});
map.setView([1.3, 103.7],14); // Add WMS source/layers var source = wms.source( "http://52.74.150.232:8080/geoserver/gwc/service/wms", { "format": "image/png", "transparent": "true", "srs":"EPSG:4326", "attribution": "<a href='http://www.onemap.sg'>www.onemap.sg SLA::GEOSPATIAL DIVISION</a>", "tiled": tiled } ); var layers = { '2007': source.getLayer("historymap:2007wgs84"), '1998': source.getLayer("historymap:1998wgs84"), '1988': source.getLayer("historymap:1988wgs84"), '1975': source.getLayer("historymap:1975wgs84"), '1969': source.getLayer("historymap:1969wgs84"), '1955': source.getLayer("historymap:1955wgs84"), }; layers[name].addTo(map); L.control.layers(layers).addTo(map); return map;
function basemap() {
var mqcdn = "http://e1.onemap.sg/arcgis/rest/services/SM256WGS84/MapServer/tile/{z}/{y}/{x}"; return L.tileLayer(mqcdn, { 'type': 'map', 'attribution': "<a href='http://www.onemap.sg'>www.onemap.sg SLA::GEOSPATIAL DIVISION</a>", });
function blank() { var layer = new L.Layer(); layer.onAdd = layer.onRemove = function() {}; return layer; }
// Export maps for console experimentation return { 'maps': { 'base': BaseMapd, 'overlay': overlayMap, 'tile': tiledMap }
};
});
Please use triple backticks around your code to format it and setup a minimal example in jsfiddle to demonstrate the problem....
hi saw ur contribution on l.map.sync. Tried it. i encounter a problem that my map is not able to sync. possible to advise. thanks. here is my code using requirejs
requirejs.config({ 'baseUrl': '../lib', 'paths': { 'leaflet.wms': '../leaflet.wms' ,//.js' 'L.Map.Sync': '../L.Map.Sync' //.js' } });
define(['leaflet', 'leaflet.wms','L.Map.Sync'], function(L,wms,sync) {
var BaseMapd = basecreateMap('base-map'); var overlayMap = createMap('overlay-map', true,'2007'); var tiledMap = createMap('tiled-map', true,'1988');
overlayMap._initSync(tiledMap); tiledMap._initSync(overlayMap); BaseMapd._initSync(overlayMap); BaseMapd._initSync(tiledMap); overlayMap._initSync(BaseMapd); tiledMap._initSync(BaseMapd);
overlayMap.sync(tiledMap); tiledMap.sync(overlayMap); BaseMapd.sync(overlayMap); BaseMapd.sync(tiledMap); overlayMap.sync(BaseMapd); tiledMap.sync(BaseMapd);
function basecreateMap(div) { // Map configuration var map1 = L.map(div);
// L.control.layers(basemaps).addTo(map);
}
function createMap(div, tiled,name) { // Map configuration var map = L.map(div,{maxZoom: 17, minZoom: 12,});
}
function basemap() {
}
function blank() { var layer = new L.Layer(); layer.onAdd = layer.onRemove = function() {}; return layer; }
// Export maps for console experimentation return { 'maps': { 'base': BaseMapd, 'overlay': overlayMap, 'tile': tiledMap }
};
});