<div class="map" id="map_canvas"></div>
<div class="map" id="map_canvas2"></div>
.map {
height: 300px;
width: 300px;
margin: 0px;
padding: 0px
}
function initialize() {
var map = new google.maps.Map(
document.getElementById("map_canvas"), {
center: new google.maps.LatLng(47.356755, 8.553866),
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
/*document.getElementById("map_canvas2"), {
center: new google.maps.LatLng(47.356755, 8.553866),
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
*/
// Define custom marker object
var image = {
url: crosshair,
anchor: new google.maps.Point(25, 25),
scaledSize: new google.maps.Size(50, 50)
};
// Create the marker
var marker = new google.maps.Marker({
position: map.getCenter(),
map: map,
icon: image
});
}
google.maps.event.addDomListener(window, "load", initialize);
var crosshair = "http://icons.iconarchive.com/icons/icons-land/vista-map-markers/32/Map-Marker-Marker-Outside-Chartreuse-icon.png";
This Pen doesn't use any external CSS resources.