Grey Box where Google Map should be

This topic contains 20 replies, has 4 voices, and was last updated by  Paolo 7 years, 6 months ago.

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket

Tagged: , , , ,

  • Author
    Posts
  • October 20, 2016 at 7:19 pm #288685

    Andrew Wilkins
    Free User
    Post count: 10

    Hello,

    I’ve been wrestling with this for a while.

    The page is here http://seattlebookreview.com/local/local-bookstores/

    I’ve tried adding a bunch of
    #map, div, #gd_home_map, etc etc {
    overflow: visible;
    }

    I’ve tried adding this function call to the document.ready function of the JS as well

    google.maps.event.trigger(map_id, ‘resize’); but that hasn’t worked, yet, either.

    WordPress 4.5.2 running BeboStore Child Theme theme.

    I’ve only been able to display the map pins, and not the map itself. Please advise at your earliest.

    Cheers

    October 20, 2016 at 9:54 pm #288738

    Guust
    Moderator
    Post count: 29970

    You can achieve that when using Google Maps, with the Custom Google Map addon. You will be able to turn off/hide all map elements except the markers.
    https://wpgeodirectory.com/downloads/custom-google-maps/

    October 21, 2016 at 3:37 pm #289255

    Paolo
    Site Admin
    Post count: 31206

    Hi Andrew,

    I think Guust misunderstood your question. Please provide admin credentials in a private reply (only moderators can read them) and we will have a look at your settings.

    It could be a conflict with another plugin’s script.

    Let us know,

    Thanks

    October 24, 2016 at 6:17 pm #291044

    Andrew Wilkins
    Free User
    Post count: 10
    This reply has been marked as private.
    October 24, 2016 at 6:50 pm #291057

    Andrew Wilkins
    Free User
    Post count: 10
    This reply has been marked as private.
    October 25, 2016 at 2:57 pm #291532

    Paolo
    Site Admin
    Post count: 31206

    Hi Andrew,

    the map appears to be working, where is it that appears as a grey box only?

    Let us know,

    Thanks

    October 25, 2016 at 5:17 pm #291625

    Andrew Wilkins
    Free User
    Post count: 10

    Hi Paolo,

    It only doesn’t work on this page http://seattlebookreview.com/local/local-bookstores/ using the [homepage_map] shortcode. When you click the full screen icon, the full screen map works just fine. It’s only when the map is sitting there as part of the page that it displays as grey box with pins only.

    Thanks Paolo

    October 25, 2016 at 6:13 pm #291719

    Paolo
    Site Admin
    Post count: 31206

    Ok I see the problem now. There is a JS error:

    TypeError: a is null
    https://maps.google.com/maps/api/js?&language=en&key=AIzaSyD7t12abpGCdxfQCrTfnrLz1f6ODS0mrAU
    Line 86

    I asked to the developers to follow up.

    Thanks for your patience,

    October 26, 2016 at 9:33 am #292040

    Stiofan O’Connor
    Site Admin
    Post count: 22956

    Hi Andrew,

    It seems to be a JavaScript error but its not throwing a specific error on the page.
    If you can provide FTP details i will be able to track it down quicker.

    Thanks,

    Stiofan

    October 31, 2016 at 4:28 pm #295139

    Andrew Wilkins
    Free User
    Post count: 10
    This reply has been marked as private.
    November 1, 2016 at 12:28 pm #295656

    Stiofan O’Connor
    Site Admin
    Post count: 22956

    Hi Andrew,

    The problem actually lies in a CSS rule in the theme.

    

    .entry-content div {
    max-width: 100%!important;
}
    

    That should really be:
    

    

    .entry-content > div {
    max-width: 100%!important;
}
    

    I have added a css rule to compensate for this, please check.
    

    Thanks,
    

    Stiofan
    

		
	
    


    

			
				

    

	
    

		November 1, 2016 at 3:49 pm

		
		#295949

		
		
		
	
    


    


    

	
    

		
		
    Andrew Wilkins
    Free User
    
		
		
     Post count: 10
    
	
    

	
    

		
		
    Hi Stiofan,
    

    That didn’t seem to do the trick. I’ve attached a screenshot.
    

    Looks like we now have the zoom in/out buttons, but the rendering is strange. That, and the map is still grey with no streets/topography yet.
    

    Why did the CSS rule cause an issue?
    

    Thank you,
    
Andrew
    

		
	
    


    

			
				

    

	
    

		November 1, 2016 at 10:54 pm

		
		#296409

		
		
		
	
    


    


    

	
    

		
		
    Paolo
    Site Admin
    
		
		
     Post count: 31206
    
	
    

	
    

		
		
    I still see the grey map too on Firefox too. I alerted Stiofan again.
    

    Thanks for your patience,
    

		
	
    


    

			
				

    

	
    

		November 3, 2016 at 10:58 am

		
		#297346

		
		
		
	
    


    


    

	
    

		
		
    Stiofan O’Connor
    Site Admin
    
		
		
     Post count: 22956
    
	
    

	
    

		
		
    You have something (i assuem the events plugin) trying to add a map on the page but the element id does not exist: 
    

    window.map = new google.maps.Map(document.getElementById("em_search_wrapper"));
    

    Stiofan
    

		
	
    


    

			
				

    

	
    

		November 3, 2016 at 8:59 pm

		
		#297632

		
		
		
	
    


    


    

	
    

		
		
    Andrew Wilkins
    Free User
    
		
		
     Post count: 10
    
	
    

	
    

		
		
    Hey Stiofan,
    

    Thanks for clarifying. This issue was happening prior to the events plugin being activated. Did you deactivate it and see if the map began to work?
    

    When I deactivated the events plugin, I saw no change in the homepage_map widget.
    

    Please advise,
    
Andrew
    

		
	
    


    

			
		
	
    • 

	
  • 

		
    Author
    

		
    

			
				Posts
			
		
    

	
    • 





			



	


		Viewing 15 posts - 1 through 15 (of 21 total)
	


	


		

	

	





		
				

			

				

					
We have moved to a support ticketing system and our forums are now closed.

					Open Support Ticket