Folleto tejas fuera problema

Question

No me gusta hacer este tipo de preguntas, pero yo he estado atrapado durante 2 días ahora:

Yo prestados algunos de los azulejos con mapnik que quiero servir en mi aplicación sin conexión que se va a ejecutar desde un disco portátil, pero a través de navegador. Me cambié openlayers para repartir volantes para este caso particular, debido a su agradable widgets y aparentemente más fácil la instalación.

Sin embargo, me inicializar mi mapa y la capa de mosaico como este:

var map = L.map('map_canvas');
map.setView([50, 10.0], 6);      

var layer = L.tileLayer('./data/map/${z}/${x}/${y}.png', { maxZoom: 16 , tms: true});    
map.addLayer(layer);

Pero lo que veo es un mapa en blanco. Si me inspeccionar lo que pasa con Firebug parece que las baldosas no son ni siquiera que se solicita (sin errores). El mapa está configurado derecho porque puedo ver folleto mapa widgets, sospecho que el tiene algo que ver con la dirección url de la capa. He copiado directamente desde mi otro OpenLayers aplicación que funciona sin problemas. Cualquier idea, o tiene cualquier otra persona topé con esto?

Answer 1

Para dar una respuesta a esta pregunta: se pueden establecer rutas relativas, esto no es problema. Pero la URL debe tener este aspecto (sin los signos de dólar).

var map = L.map('map_canvas');
map.setView([50, 10.0], 6);      

var layer = L.tileLayer('data/map/{z}/{x}/{y}.png', { maxZoom: 16 });    
map.addLayer(layer);

donde data es un subdirectorio del directorio actual, donde se ejecuta el archivo html con código javascript.

Answer 2

No se pueden tener las direcciones URL relativas de línea, es necesario tener un archivo protocolo (file://) dirección url absoluta, puede haga clic derecho sobre una imagen y abrir en un navegador para entrar la ruta url.

var map = L.map('map_canvas');
map.setView([50, 10.0], 6);      

var layer = L.tileLayer('file:///c://path/to/your/data/map/{z}/{x}/{y}.png', { maxZoom: 16 , tms: true});    
map.addLayer(layer);