Login  |  Register
HTML5 Icon HTML5 Icon HTML5 Icon
TP on Social Media


Welcome, Guest. Please login or register.
Did you miss your activation email?

August 19, 2022, 04:39:53 AM

Login with username, password and session length
  • Total Members: 3843
  • Latest: Tricky
  • Total Posts: 193479
  • Total Topics: 21088
  • Online today: 51
  • Online ever: 1035
  • (November 26, 2020, 04:45:12 AM)
Users Online
Users: 0
Guests: 43
Total: 43

Author Topic: Google Maps  (Read 28241 times)

0 Members and 1 Guest are viewing this topic.


  • Guest
Google Maps
« on: July 24, 2006, 06:40:21 PM »
Here is the code for a small Google-Maps-Block (javascript/html):

Code: [Select]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<html xmlns="http://www.w3.org/1999/xhtml">
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps JavaScript API Example</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key=HERE-YOUR-KEY"
    <script type="text/javascript">
    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.addControl(new GSmallZoomControl());
        map.setCenter(new GLatLng(50.8,10.0), 5);
  <body onload="load()" onunload="GUnload()">
  <div id="map" style="overflow:hidden; height: 280px"></div>

First you have to sign up with your URL at google.
Here is the link: http://www.google.com/apis/maps/signup.html
After that, you have to replace the part above with: "HERE-YOUR-KEY" with your own key...
That's all ;)

For your own controls look at the API on the google-maps sites.
Edit the coords and the zoom in this line: map.setCenter(new GLatLng(50.8,10.0), 5);

Have fun
Greetz Wan

//EDIT: If you want to see how this works in action have a look at www.kulturwochenende.com/forum but this site is under construction..

« Last Edit: July 24, 2006, 07:53:39 PM by Wantonio »


  • Guest
Re: Google Maps
« Reply #1 on: July 24, 2006, 06:44:18 PM »
nice one ill try using it later with my membermap mod :D

Offline RoarinRow

  • Hero Member
  • *****
  • Posts: 1034
  • Ride my AV!
    • Avalanche Style
Re: Google Maps
« Reply #2 on: July 24, 2006, 07:46:30 PM »
That's cool! A map in a small window like that.

For our site we use Frappr - http://www.frappr.com/avalanchestyle

SMF 2.0 RC3
TP 1.0 beta 5-1
Wordpress 3.0


  • Guest
Re: Google Maps
« Reply #3 on: July 24, 2006, 10:28:26 PM »

thats pretty need.


  • Guest
Re: Google Maps
« Reply #4 on: July 26, 2006, 03:32:16 AM »
Added to block code index under "G" as "Google map block"


  • Guest
Re: Google Maps
« Reply #5 on: August 31, 2006, 05:52:16 PM »

Looks great on your site but I have a silly question.
When I put your code into a block (html type) content area and display the block I get some of the text from the block. No map!

Do you put the code in a separate file and call that file from the block?
If so, what code do you use to call it?


Offline IchBin

  • Friends
  • *
  • Posts: 16231
Re: Google Maps
« Reply #6 on: August 31, 2006, 06:32:14 PM »
Put it in a scriptbox instead.


  • Guest
Re: Google Maps
« Reply #7 on: August 31, 2006, 08:04:15 PM »
Ahhh... works!
Huge thanks.


  • Guest
Re: Google Maps
« Reply #8 on: October 24, 2006, 04:03:57 PM »
anyway to put this in an article?


  • Guest
Re: Google Maps
« Reply #9 on: November 03, 2006, 07:30:17 AM »
I have a google map in a php article, i also have  a data.xml wich the map reads markers from and shows them on the map.

Could someone with the right skills create a form witch sends new markers to the xml file. That way users could add markers to my map :)

The xml file looks like this:

Code: [Select]
<marker lat="65.605349" lng="9.459274"> Text / URL </marker>
<marker lat="67.605349" lng="6.459274"> Text / URL </marker>
<marker lat="69.605349" lng="8.459274"> Text / URL </marker>
<marker lat="61.605349" lng="7.459274"> Text / URL </marker>

I have my map working in the article, and my markers showing up. But i would like this form below my article to adde more markers :)

hope someone will help!