Hola a todos,
Tal como anuncié cuando me presenté en sociedad, estoy haciendo un programa que funciona como incubadora de Proyectos.
Este programa corre usando la API del Internet Explorer 7, y, en teoría, funciona en cualquier versión de windows posterior a Win2000.
El propósito de este programa es poder testear cualquier archivo HTML local o remoto, e “inyectarle” código Javascript para poder testear su comportamiento.
Hasta ahora, todo funciona bien.
El tema es que estoy usando una API de OpenStreetMaps, que, en realidad, es una suerte de Frankenstein, porque la fui armando con partes extraidas de distintos ejemplos.
Si bien el resultado es el esperado, me gustaría que la vista de los servicios disponibles en los layers, tenga mas que ver con los avances que están produciendo en este foro.
Mi código HTML es el siguiente
<!DOCTYPE html>
<html>
<head>
<title>Leaflet Quick Start Guide Example</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://leafletjs.com/dist/leaflet.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="http://leafletjs.com/dist/leaflet.ie.css" /><![endif]-->
<style>
body {
padding: 0;
margin: 0;
}
html, body, #map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script src="http://leafletjs.com/dist/leaflet.js"></script>
<script>
var i = 0;
var mlat = -34.6553960609;
var mlng = -59.42188975;
var map = L.map('map').setView([mlat, mlng], 14);
L.tileLayer('http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>'
}).addTo(map);
var popup = L.popup();
var myIconRed = L.icon({
iconUrl: 'marker-icon_red.png',
iconSize: [26, 41],
iconAnchor: [26, 41],
popupAnchor: [-13, -33],
shadowUrl: '',
shadowSize: [0, 0],
shadowAnchor: [0, 0]
});
var myIconBlue = L.icon({
iconUrl: 'marker-icon_blue.png',
iconSize: [26, 41],
iconAnchor: [26, 41],
popupAnchor: [-12, -33],
shadowUrl: '',
shadowSize: [0, 0],
shadowAnchor: [0, 0]
});
var myIconGreen = L.icon({
iconUrl: 'marker-icon_green.png',
iconSize: [26, 41],
iconAnchor: [26, 41],
popupAnchor: [-12, -33],
shadowUrl: '',
shadowSize: [0, 0],
shadowAnchor: [0, 0]
});
var NoIcon = L.icon({
iconUrl: 'marker-icon_noicon.png',
iconSize: [1, 1],
iconAnchor: [0, 0],
popupAnchor: [0, 0],
shadowUrl: '',
shadowSize: [0, 0],
shadowAnchor: [0, 0]
});
function onMapClick(e) {
window.external.nbSetVar('[Coord_X]', e.latlng.lat);
window.external.nbSetVar('[Coord_Y]', e.latlng.lng);
}
map.on('click', onMapClick);
// esto crea un popup
// popup
// .setLatLng(e.latlng)
// .setContent("You clicked the map at " + e.latlng.toString())
// .openOn(map);
// crea un marker
// L.marker([mlat, mlng]).addTo(map)
// .bindPopup("<b>Hola Mundo!</b><br />Aca estoy !").openPopup();
</script>
</body>
</html>
Como todavía no manejo muy claramente que función cumple cada librería .js, es que no se bien cual es la que tengo que reemplazar para que la vista sea mas actualizada.
Alguien podría decirme o sugerirme que cambios hacer ?
No se preocupen por el contenido de la función onMapClick(), esto es por compatibilidad con el compilador. Funciona bien.
Infinitas gracias !
David