Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#13 2011-11-20 00:34:28

kvnmcwebn
Member
From: Ireland
Registered: 2007-01-27
Posts: 724
Website

Re: Google Maps v3 API

Hi Phil,
Thanks for that.

http://www.artworksframing.ie/contact-artworks-framing-letterkenny-co-donegal-ireland/


its a bad hen that wont scratch itself.
photogallery

Offline

#14 2011-11-20 03:14:09

Gocom
Developer Emeritus
From: Helsinki, Finland
Registered: 2006-07-14
Posts: 4,533
Website

Re: Google Maps v3 API

Kevin,

You have unclosed script tag in your head. Add </script> after:

<script src="http://maps.google.com/maps/api/js?sensor=false">

As far as the map goes, you are not are not calling googlemap(), just defining it. It won’t do anything if you don’t initialize it. I would replace that current function enclosing with bit of JQuery’s way of loading something on document load, i.e.

$(document).ready(function() {
	/**
		Google Map code here (w/o function enclosures)
	*/
});

Last edited by Gocom (2011-11-20 03:18:58)

Offline

#15 2011-11-20 09:33:06

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

Re: Google Maps v3 API

Sorry Kevin, my bad, I left the call out of my previous instructions (as Jukka pointed out), I’ve updated it and also it’s below. Place it in the bottom of your page code before the </body> tag.

<script>$(document).ready(function(){googlemap();});</script>

Offline

#16 2011-11-20 10:41:50

kvnmcwebn
Member
From: Ireland
Registered: 2007-01-27
Posts: 724
Website

Re: Google Maps v3 API

ahh thanks guys. that was an embarrassing mistake… Ok but I closed the script tag and added the function to the bottom of the page and it’s still not working. Jukka thanks. I’d like to just try Phil’s method for now because it gives a lot of control easily and it’s less code than using gomap as you said earlier. Just need to get it working.
thanks again for the help


its a bad hen that wont scratch itself.
photogallery

Offline

#17 2011-11-20 11:18:41

Gocom
Developer Emeritus
From: Helsinki, Finland
Registered: 2006-07-14
Posts: 4,533
Website

Re: Google Maps v3 API

If you use JQuery to initialize the code, then you will need to include jQuery too. As you are using XHTML, remember to add mandatory type attribute to the <script> tags.

philwareham wrote:

<script>$(document).ready(function(){googlemap();});</script>

As it’s already at the end of the body, the ready method isn’t needed at all. Instead of using jQuery at all, you can just do:

<script type="text/javascript">
	googlemap();
</script>

Ready method should (or has to) only be used when the code is defined in a spot where DOM isn’t fully loaded at that moment, but needs to be executed after it is. At end of the body content, usually no.

Last edited by Gocom (2011-11-20 11:23:59)

Offline

#18 2011-11-20 12:02:12

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

Re: Google Maps v3 API

Gocom wrote:

If you use JQuery to initialize the code, then you will need to include jQuery too.

True, I wrongly assumed that Kevin was using jQuery (I should have looked at his example page). I’ve updated the previous post to keep all the instructions together in one place.

Ready method should (or has to) only be used when the code is defined in a spot where DOM isn’t fully loaded at that moment, but needs to be executed after it is. At end of the body content, usually no.

Ah OK I see, I’d always assumed that always forcing wait until DOM ready was the most robust method, just in case something hasn’t loaded properly yet. I learnt something new today!

Offline

#19 2011-11-20 12:52:54

Gocom
Developer Emeritus
From: Helsinki, Finland
Registered: 2006-07-14
Posts: 4,533
Website

Re: Google Maps v3 API

philwareham wrote:

Ah OK I see, I’d always assumed that always forcing wait until DOM ready was the most robust method, just in case something hasn’t loaded properly yet. I learnt something new today!

Well, as we known, pages are handled from the top to the bottom. What is at the end of the body content is executed the last. Placing script at the bottom does pretty much the same as it’s that last thing already as long as you don’t mix events and executing methods.

Last edited by Gocom (2011-11-20 12:53:55)

Offline

#20 2011-11-20 13:49:01

kvnmcwebn
Member
From: Ireland
Registered: 2007-01-27
Posts: 724
Website

Re: Google Maps v3 API

ahh. i am using jquery on the rest of the site. I just took it out of that page because i didn’t think it needed it. anyway the map is showing up now but the coordinates are way off…


its a bad hen that wont scratch itself.
photogallery

Offline

#21 2011-11-20 14:25:03

kvnmcwebn
Member
From: Ireland
Registered: 2007-01-27
Posts: 724
Website

Re: Google Maps v3 API

ok guys everythings working now, except the address isn’t showing up in the push pin box… thanks a mill for all the help.


its a bad hen that wont scratch itself.
photogallery

Offline

#22 2011-11-20 14:51:24

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

Re: Google Maps v3 API

kvnmcwebn wrote:

ok guys everythings working now, except the address isn’t showing up in the push pin box… thanks a mill for all the help.

That’s because the text in the popup inherits your CSS style from the main page, which is white.

Style it using something like this…

#map-canvas address {
    color: #333;
    background: #fff;
}

Offline

#23 2011-11-20 16:22:03

kvnmcwebn
Member
From: Ireland
Registered: 2007-01-27
Posts: 724
Website

Re: Google Maps v3 API

sigh… thanks phil. that’s great. thanks for all the help.


its a bad hen that wont scratch itself.
photogallery

Offline

Board footer

Powered by FluxBB