javascript - Markers do not show up in googlemap - strange error -
i trying allow markers show in styled googlemap, using google api.
if seek way:
function initialize() { var mapoptions = { zoom: 8, center: new google.maps.latlng(51.49079, -0.10746), maptypeid: google.maps.maptypeid.roadmap }; var map = new gmaps({ div: "#map1", lat: 41.895465, lng: 12.482324, zoom: 1, zoomcontrol : true, zoomcontrolopt: { style : "small", position: "top_left" }, pancontrol : true, streetviewcontrol : false, maptypecontrol: false, overviewmapcontrol: false }); var styles = [ { featuretype: "road", stylers: [ { "hue": "#ff0000" }, { "lightness": -11 }, { "saturation": -5 } ] }, { featuretype: "road", stylers: [ { "saturation": -26 } ] } ]; map.addstyle({ styledmapname:"styled map", styles: styles, maptypeid: "map_style" }); map.setstyle("map_style"); // add together 5 markers map @ random locations var southwest = new google.maps.latlng(-31.203405, 125.244141); var northeast = new google.maps.latlng(-25.363882, 131.044922); //var bounds = new google.maps.latlngbounds(southwest, northeast); //map.fitbounds(bounds); var cities = [ { name: 'london', position: new google.maps.latlng(51.49079,-0.10746), info: 'bewohner: 7,556,900' }, { name: 'paris', position: new google.maps.latlng(48.856667,2.350987), info: 'bewohner: 2,193,031' }, { name: 'berlin', position: new google.maps.latlng(52.523405,13.4114), info: 'bewohner: 3,439,100' } ]; cities.foreach(function(element, index, array) { var marker = new google.maps.marker({ position: element.position, map: map[0], title: element.name }); var infowindow = new google.maps.infowindow({ content: element.info }); google.maps.event.addlistener(marker, 'click', function() { infowindow.open(map, marker); }); }); } google.maps.event.adddomlistener(window, 'load', initialize);
i no errors in firebug, no markers show up.
if alter this:
var marker = new google.maps.marker({ position: element.position, map: map[0],
to
map: map,
i error message, there invalid value property map.
where error in code?
thank you!
instead of gmaps utilize google.maps.map creating maps seek link. may help you.
https://developers.google.com/maps/documentation/javascript/overlays?hl=en#markers
edited code
var marker; var map; function initialize() { var mapoptions = { zoom: 4, center: new google.maps.latlng(51.49079, -0.10746), maptypeid: google.maps.maptypeid.roadmap }; map = new google.maps.map(document.getelementbyid('map_canvas'), mapoptions); var styles = [ { featuretype: "road", stylers: [ { "hue": "#ff0000" }, { "lightness": -11 }, { "saturation": -5 } ] }, { featuretype: "road", stylers: [ { "saturation": -26 } ] } ]; map.setoptions({styles: styles}); var cities = [ { name: 'london', position: new google.maps.latlng(51.49079,-0.10746), info: 'bewohner: 7,556,900' }, { name: 'paris', position: new google.maps.latlng(48.856667,2.350987), info: 'bewohner: 2,193,031' }, { name: 'berlin', position: new google.maps.latlng(52.523405,13.4114), info: 'bewohner: 3,439,100' } ]; for(var i=0;i<cities.length;i++) { var element=cities[i]; var marker = new google.maps.marker({ position: element.position, map: map, title: element.name }); var infowindow = new google.maps.infowindow({ content: element.info }); google.maps.event.addlistener(marker, 'click', function() { infowindow.open(map, marker); }); } }
javascript google-maps maps google-api
No comments:
Post a Comment