Hola como estais,
Vereis tengo este codigo de google maps para pintar las marcas que recojo de una base de datos, la cosa es que necesito añadir tambien un campo para poder poner tambien la direecion y mostrarla con las marcas:
Código PHP:
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="http://maps.google.com/maps?file=api&v=2.x&key=AIzaSyB6aZ5WHW3WiTHExADSYls_fal7ez3o504" type="text/javascript"></script>
<!--<link id="ContentPlaceHolder1_busquedaEmpresa_gvEmpresas_lnkEstilos" href="~/css/estiloDLC2.css" type="text/css" rel="stylesheet"></link>
<link rel="Stylesheet" media="screen" type="text/css" href="/css/estiloDLC2.css" />-->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var infowindow;
var bound;
var map;
(function () {
google.maps.Map.prototype.markers = new Array();
google.maps.Map.prototype.addMarker = function (marker) {
this.markers[this.markers.length] = marker;
};
google.maps.Map.prototype.getMarkers = function () {
return this.markers
};
google.maps.Map.prototype.clearMarkers = function () {
if (infowindow) {
infowindow.close();
}
for (var i = 0; i < this.markers.length; i++) {
this.markers[i].set_map(null);
}
};
})();
function pintarDirecciones(puntos, latitudCliente, longitudCliente) {
bound = new google.maps.LatLngBounds(null);
//var latlng = new google.maps.LatLng(37.88909, -4.76125);
var latlng = new google.maps.LatLng(0, 0);
var myOptions = {
zoom: 2,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
//mapTypeId: google.maps.MapTypeId.SATELLITE
};
map = new google.maps.Map(document.getElementById("map"), myOptions);
// function createMarker(point, nombre) {
// var iconoMarca = new GIcon(G_DEFAULT_ICON);
// iconoMarca.image = "http://dlc.testdominios.com/img/monos/monoMapa.png";
// var tamanoIcono = new GSize(35, 35);
// iconoMarca.iconSize = tamanoIcono;
// iconoMarca.shadow = "http://dlc.testdominios.com/img/monos/monoMapaSombra.png";
// var tamanoSombra = new GSize(35, 35);
// iconoMarca.shadowSize = tamanoSombra;
// //iconoMarca.iconAnchor = new GPoint(11, 16);
// //var marker = new GMarker(point);
// var marker = new GMarker(point, iconoMarca);
// GEvent.addListener(marker, 'click', function () {
// marker.openInfoWindowHtml(nombre);
// });
// return marker;
// }
function createMarker(name, latlng) {
var image = "http://www.dondelocompro.es/img/nuevas/home/ico_pincho.png";
var marker = new google.maps.Marker({ position: latlng, map: map, icon: image });
google.maps.event.addListener(marker, "click", function () {
if (infowindow) infowindow.close();
infowindow = new google.maps.InfoWindow({ content: name, width: 10, height: 50, maxWidth: 300 });
infowindow.set("isdomready", false);
infowindow.open(map, marker);
});
return marker;
}
function createMarker2(name, latlng) {
var marker = new google.maps.Marker({ position: latlng, map: map });
infowindow = new google.maps.InfoWindow({ content: name, width: 100, height: 100, maxWidth: 100 });
infowindow.set("isdomready", false);
infowindow.open(map, marker);
google.maps.event.addListener(marker, "click", function () {
//if (infowindow) infowindow.close();
infowindow = new google.maps.InfoWindow({ content: name, width: 100, height: 50, maxWidth: 100 });
infowindow.set("isdomready", false);
infowindow.open(map, marker);
});
return marker;
}
// function createMarker2(point, nombre) {
// var iconoMarca = new GIcon(G_DEFAULT_ICON);
//// iconoMarca.image = "http://dlc.testdominios.com/img/monos/monoMapa.png";
//// var tamanoIcono = new GSize(35, 35);
//// iconoMarca.iconSize = tamanoIcono;
//// iconoMarca.shadow = "http://dlc.testdominios.com/img/monos/monoMapaSombra.png";
//// var tamanoSombra = new GSize(35, 35);
//// iconoMarca.shadowSize = tamanoSombra;
// //iconoMarca.iconAnchor = new GPoint(11, 16);
// //var marker = new GMarker(point);
// var marker = new GMarker(point, iconoMarca);
// //infoWindow = new google.maps.InfoWindow({ content: 'Hola Baticola' });
// //infoWindow.setPosition(point);
// //infoWindow.open(map);
// marker.openInfoWindowHtml(nombre);
// GEvent.addListener(marker, 'click', function () {
// // infoWindow = new google.maps.InfoWindow({ content: nombre });
// //infoWindow.setPosition(point);
// //infoWindow.open(map);
// marker.openInfoWindowHtml(nombre);
// });
//
// return marker;
// }
var arrayPuntos = puntos.split("#");
var marca;
for (i = 0; i < arrayPuntos.length; i++) {
var punto = arrayPuntos[i].toString();
var punto1 = punto.split("$");
if (punto1.length > 2) {
var lat = punto1[1].replace(",", ".");
var lon = punto1[2].replace(",", ".");
//var point = new GPoint(lon, lat);
var latlng = new google.maps.LatLng(lat, lon);
var nombre = punto1[0].toString();
marca = map.addMarker(createMarker(nombre, latlng));
//var marker = createMarker(point, nombre);
bound.extend(latlng);
//bounds.extend(marker.getPoint());
//map.addOverlay(marker);
//map.centerAndZoom(point, 0);
}
//map.setCenter(point, 13);
}
if (latitudCliente != "" && longitudCliente != "") {
var latlngCliente = new google.maps.LatLng(latitudCliente.replace(",", "."), longitudCliente.replace(",", "."));
var nombreCliente = "Tu estás aquí.";
var marcaCliente = map.addMarker(createMarker2(nombreCliente, latlngCliente));
bound.extend(latlngCliente);
}
//alert("Hola0");
//map.setZoom(20);
if (arrayPuntos.length > 1) {
//alert(arrayPuntos.length.toString());
map.fitBounds(bound);
}
else {
//alert("Hola2");
//map.setZoom(10);
}
//Ajustar el zoom según los límites
//map.setZoom(map.getBoundsZoomLevel(bounds));
//Centrar el mapa de acuerdo a los límites
//map.setCenter(bounds.getCenter());
}
</script>
<script type='text/javascript'> pintarDirecciones("<?php echo $ubicacion_comcerio1;?>","","");</script>
A ver si alguien sabe como sepodria añadir esto.
Fran