?
Solved

Google Map with markers not displaying

Posted on 2014-10-23
2
Medium Priority
?
162 Views
Last Modified: 2014-10-24
Hi, I have the following code that should display a map with the markers on it of 5 local businesses.

I've played around for a while but nothing is appearing at all, even alerts()?

Anyone able to take a look and correct any squiffy code please?

Regards
Neil
        
        <script type="text/javascript" src="//maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">
        
		var infowindow = null;
			
    
		var centerMap = new google.maps.LatLng(51.421196,0.392989);

		var myOptions = {
			zoom: 7,
			center: centerMap,
			mapTypeId: google.maps.MapTypeId.ROADMAP
		}

		var map = new google.maps.Map(document.getElementById("map_canvas_local_businesses"), myOptions);
	
		setMarkers(map, sites);
		
		infowindow = new google.maps.InfoWindow({
			content: "loading..."
		});						      
		
		var sites = [["Dok Electrical","51.373516","0.576815","Elmfield, Gillingham, Kent"], ["Bee Bright Tuition","51.430527","0.399807","Rochester Road, Gravesend, Kent"], ["M and D Plasterers","51.315117","0.393089","Chapel Close, Ryarsh, West Malling, Kent"], ["Halloween Goodies Bags","51.422668","0.376006","Gloucester Road, Gravesend, Kent"], ["Mike's Kitchens","51.440453","0.342623","Plane Avenue, Northfleet, Gravesend, Kent"]];		
        function setMarkers(map, markers) {
			    
            for (var i = 0; i < markers.length; i++) {
                var sites = markers[i];
                var siteLatLng = new google.maps.LatLng(sites[1], sites[2]);
				 
                var marker = new google.maps.Marker({
                    position: siteLatLng,
                    map: map,
                    title: sites[0],
                    zIndex: i,
                    html: '<div style="min-height:90px;min-width:180px;text-align:right;"><h3>test</p><div>'
                });
				
				
                var contentString = "Some content";
    
                google.maps.event.addListener(marker, "click", function () {
                    infowindow.setContent(this.html);
                    infowindow.open(map, this);
                });
            }
        }
		
		 
 

    </script>
    

	<div id="map_canvas_local_businesses" style="width:600px;height:400px;"></div>

Open in new window

0
Comment
Question by:Neil Thompson
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 58

Accepted Solution

by:
Gary earned 2000 total points
ID: 40400460
Move your script/s after the map div - you are trying to initiate the map before it exists

As for the markers - nothing is defined for sites
0
 
LVL 3

Author Closing Comment

by:Neil Thompson
ID: 40401278
Annoyingly simple. Thanks Gary :)
0

Featured Post

Optimize your web performance

What's in the eBook?
- Full list of reasons for poor performance
- Ultimate measures to speed things up
- Primary web monitoring types
- KPIs you should be monitoring in order to increase your ROI

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question