PDA

View Full Version : How to embed Google maps within Mosets Tree listings


billguy
07-29-2006, 09:54 AM
1. Sign up for a Google Maps API key, if you don’t already have one. http://www.google.com/apis/maps/signup.htm

2. Edit the sub_listingDetails.tpl.php file you are using around line 102 and add the following (Don’t forget to add your Google Maps API key):


<?php
$key = "YourGoogleKeyGoesHere";

$me = ($this->link->title);
$myaddress = ($this->link->address);
$mycity = ($this->link->city);
$mystate = ($this->link->state);
$myzip = ($this->link->postcode);

$address= urlencode("$myaddress,$mycity,$mystate,$myzip");
$lines = file ('http://maps.google.com/maps/geo?key='.$key.'&q='.$address.'&output=xml');// necessite AllowURLOpen ON
$lines=implode( " ",$lines);
if (ereg (".*<coordinates>([-]?[0-9\.]{7,11}),[-]?([0-9\.]{7,11}).*", $lines, $regs))
{
$lat=$regs[2];
$long= $regs[1];
//echo "lat: $lat long: $long"; //format: <coordinates>2.395988,48.819813,0</coordinates>
}
else
{
echo "Invalid Lat/Long Format";
}

/* Create link to Google Maps to allow users to get driving directions */
//$GoogleBase="http://maps.google.com/maps?q=";
//$Search = $GoogleBase.urlencode($address);

/* Assemble code to generate map via the Google Maps API */
//$content = '<h3><a href="'.$Search.'" target=_blank>'._PAGESETTER_CLICK_GOOGLE.'</a></h3><br />';

$content = '<BR><BR><script src="http://maps.google.com/maps?file=api&v=1&key='.$key.'" type="text/javascript"></script> ';
$content = $content.'<div id="map" style="width: 500px; height: 400px"></div> ';
$content = $content.'<script type="text/javascript"> ';
$content = $content.'setTimeout("ShowGoogleMap()", 100);';
$content = $content.'window.unonload = "GUnload()";';
$content = $content.'function createMarker(point, number){ var marker = new GMarker(point);var html = "<b>" + number + "</b>";GEvent.addListener(marker, "mouseover", function() {marker.openInfoWindowHtml(html); }); return marker;}';
$content = $content.'function ShowGoogleMap(){';
$content = $content.'var map = new GMap(document.getElementById("map")); ';
$content = $content.'map.addControl(new GSmallMapControl()); ';
$content = $content.'map.addControl(new GMapTypeControl()); ';
$content = $content.'var point = new GPoint('.$long.', '.$lat.');';
$content = $content.'map.centerAndZoom(point, 4);';
$content = $content.'var marker = createMarker(point,"'.$me.'");';
$content = $content.'map.addOverlay(marker);';
$content = $content.'}';
$content = $content.'</script>';
echo $content;
?>



3. Feel free to embellish. Don’t forget to share.


Credits: unnilennium
http://pagesetter.net/index.php?module=pagesetter&func=viewpub&tid=4&pid=83

Edited on 29 July 2006 by Billguy
Edited on 9 August 2006 by Billguy (-5 spelling)

north
08-09-2006, 05:51 AM
This would be amazing Bill... problem is I don't have the file titled "sub_listingsDetails.tpl.php" in my Moset Tree directory?!

Where is this file?

iidx036
08-09-2006, 09:29 PM
North - You can find that file under the: components / com_mtree / templates / bluetree_business /

Just pick the template directory you are using for mtree and it will be there.

Billguy - Just to let you know you have a typo here:

$lines = file ('http://maps.google.com/maps/geo?key='.$key.'&q='.$adress.'&output=xml');// necessite AllowURLOpen ON

Also this doesn't seem to work for UK addresses due to the geocoding issues we have in this country. The geo returns a 603 this means according to google docs that "The geocode for the given address cannot be returned due to legal or contractual reasons." I suspect this is due to the postcodes being owned by the Royal Mail and Ordnance Survey they are protected by Crown Copyright and huge fees are required to use them.

I suspect you can still do a simple search with this code but not geocode in the UK i.e. get an exact result. If anyone knows different then please let me know.

Cheers

JK

billguy
08-10-2006, 01:35 AM
Billguy - Just to let you know you have a typo here...

Thanks.

As far as UK addresses go, you could use NuSOAP and http://www.nearby.org.uk/api/convert-help.php
to get you close. Shouldn't be too hard.

firstcom
08-10-2006, 09:23 PM
i cant get it to work in norway. I just get invalid LAT ? Anybody got this to work in norway or anywhere for that matter!

billguy
08-10-2006, 10:30 PM
i cant get it to work in norway. I just get invalid LAT ? Anybody got this to work in norway or anywhere for that matter!

I couldnít get http://maps.google.com to work for a Norway address. I tried plugging in a couple different addresses to no avail until I found this:
http://maps.google.com/support/bin/answer.py?answer=16634

I could search a city in Norway with success but not an exact address.

You might be able to geocode the city to get you close.

billguy
08-17-2006, 04:29 AM
Hereís my first attempt at a Yahoo! Traffic/Google Maps mashup. Traffic data isnít available in all cities so donít be surprised if nothing shows on your map. I got the itch to do this after seeing http://traffic.poly9.com. I tested this with Beverly Hills, CA so if you live around there and use MT then youíre in luck.

You will need lastRSS.php, freely available from http://lastrss.webdot.cz. Drop that somewhere in your path (edit script to suite).

Youíll also need webticker_lib.js available from http://www.mioplanet.com/rsc/newsticker_javascript.htm. The author asks to include a link to their web site in lieu of a small fee. Of course, you can come up with something yourself if you so choose. I used the ticker to display xml weather news feeds from Yahoo! Below the map.

You can really go crazy customizing this mashup with custom icons, etc. if you choose.

Without further adieu, hereís the script (installation is similar to original post above). Enjoy!


<?php
include 'lastrss.php';
$rss = new lastRSS;
$rss->cache_dir = './././cache';
$rss->cache_time = 3600; // one hour
$key = "your_google_key_goes_here";

$me = ($this->link->title);
$myaddress = ($this->link->address);
$mycity = ($this->link->city);
$mystate = ($this->link->state);
$myzip = ($this->link->postcode);
$useweather = "1"; //0 to disable, 1 to enable Weather marquee
$usetraffic = "1"; //0 to disable, 1 to enable Traffic mashup
$adress= urlencode("$myaddress,$mycity,$mystate,$myzip");
$lines = file ('http://maps.google.com/maps/geo?key='.$key.'&q='.$adress.'&output=xml');// necessite AllowURLOpen ON
$lines=implode( " ",$lines);
if (ereg (".*<coordinates>([-]?[0-9\.]{7,11}),([-]?[0-9\.]{7,11}).*", $lines, $regs))
{
$lat=$regs[2];
$long= $regs[1];
//echo "lat: $lat long: $long"; //format: <coordinates>2.395988,48.819813,0</coordinates>
}
else
{
echo "Invalid Lat/Long Format lat: $lat long: $long";
}

/* Create link to Google Maps to allow users to get driving directions */
//$GoogleBase="http://maps.google.com/maps?q=";
//$Search = $GoogleBase.urlencode($address);

/* Assemble code to generate map via the Google Maps API */
//$content = '<h3><a href="'.$Search.'" target=_blank>'._PAGESETTER_CLICK_GOOGLE.'</a></h3><br />';
$content = '<BR><BR><script src="http://maps.google.com/maps?file=api&v=2&key='.$key.'" type="text/javascript"></script> ';
$content = $content.'<div id="map" style="width: 600px; height: 300px"></div> ';
$content = $content.'<script type="text/javascript"> ';
$content = $content.'var icon = new GIcon();icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";icon.iconSize = new GSize(12, 20);icon.shadowSize = new GSize(22, 20);icon.iconAnchor = new GPoint(6, 20);icon.infoWindowAnchor = new GPoint(5, 1); ';
$content = $content.'setTimeout("ShowGoogleMap()", 100);';
$content = $content.'window.unonload = "GUnload()";';
$content = $content.'var infoTabs = [' ;
$content = $content.'new GInfoWindowTab("About", "'.$me.'<BR \>'.$myaddress.'<BR \>'.$mycity.', '.$mystate.' '.$myzip.'"),' ;
$content = $content.'new GInfoWindowTab("Directions", "<div><form action=\"http://maps.google.com/maps\" method=\"get\"><p><label for=\"saddr\">From</label><input type=\"text\" name=\"saddr\" id=\"saddr\" value=\"\" /><p><label for=\"daddr\">To</label><input type=\"text\" name=\"daddr\" id=\"daddr\" value=\"'.$myaddress.' '.$mycity.', '.$mystate.' '.$myzip.'\" /><input type=\"submit\" value=\"Go\" /></p></form></div>")' ;
$content = $content.'];' ;
$content = $content.'function createMarker(point, number){ var marker = new GMarker(point);GEvent.addListener(marker, "mouseover", function() {marker.openInfoWindowTabsHtml(infoTabs); }); return marker;}';
$content = $content.'function createsmMarker(point, number){ var marker = new GMarker(point,icon);var html = "<b>" + number + "</b>";GEvent.addListener(marker, "mouseover", function() {marker.openInfoWindowHtml(html); }); return marker;}';
$content = $content.'function ShowGoogleMap(){';
$content = $content.'var map = new GMap(document.getElementById("map")); ';
$content = $content.'map.addControl(new GSmallMapControl()); ';
$content = $content.'map.addControl(new GMapTypeControl()); ';
$content = $content.'map.addControl(new GScaleControl()); ';
$content = $content.'var point = new GPoint('.$long.', '.$lat.');';
$content = $content.'map.centerAndZoom(point, 4);';
$content = $content.'var marker = createMarker(point);';
$content = $content.'map.addOverlay(marker);';
$content = $content.'marker.openInfoWindowTabsHtml(infoTabs); ';
$content = $content.'map.addControl(new GOverviewMapControl()); ';

//
//This gets traffic from Yahoo!
//
if ($usetraffic == 1) {
if ($rs = $rss->get('http://api.local.yahoo.com/MapsService/rss/trafficData.xml?appid=YahooDemo&city='.$mycity.'&state='.$mystate.'')) {
foreach($rs['items'] as $item) {
$content = $content.'var point = new GPoint('.($item['geo:long']).', '.($item['geo:lat']).');';
$content = $content.'var marker = createsmMarker(point,"'.($item['title']).'");';
$content = $content.'map.addOverlay(marker);';
}
}
}
$content = $content.'}';
$content = $content.'</script>';

//
//This gets the weather from Yahoo!
//
if ($useweather == 1) {
if ($weather = $rss->get('http://xml.weather.yahoo.com/forecastrss?p='.$myzip.'')) {
$content = $content.'<DIV ID="TICKER" STYLE="overflow:hidden; width:600px"onmouseover="TICKER_PAUSED=true" onmouseout="TICKER_PAUSED=false">';
foreach($weather['items'] as $item) {
$content = $content.'<a target="new" href="'.$item[link].'">"'.$item['title'].''.$item['description'].'</a>"';
}
$content = $content.'</DIV><script src="webticker_lib.js"></script>';
}
}
echo $content;
?>

Dionysus
11-01-2006, 06:45 AM
How can you get moset directory to show a map like this.

http://www.atlspecials.com/index.php?&sname=Globe&open=1

I want to create a map with differnent icons for different types of business.

Dining, Shopping, Banking etc

columbusgeek
09-11-2007, 11:54 AM
This method still works in Mtree 2.0.xx with a bit of fiddling.

I ended up putting the code at line 171 just after

</div>
<span class="componentheading">

Props for the initial code.
I changed the default view by adding this code.

$content = $content.'map.setMapType(G_HYBRID_MAP);';

I made a separate forum thread about it here (http://forum.mosets.com/showthread.php?t=5746).

Colonel P
09-18-2007, 02:36 AM
Marked in red.

Change api&v=1 to api&v=2.

For the dutch guys, change maps.google.com to maps.google.nl ( 2 times).
I think this will work for most of the europian countries.

<?php
$key = "YourGoogleKeyGoesHere";

$me = ($this->link->title);
$myaddress = ($this->link->address);
$mycity = ($this->link->city);
$mystate = ($this->link->state);
$myzip = ($this->link->postcode);

$address= urlencode("$myaddress,$mycity,$mystate,$myzip");
$lines = file ('http://maps.google.com/maps/geo?key='.$key.'&q='.$address.'&output=xml');// necessite AllowURLOpen ON
$lines=implode( " ",$lines);
if (ereg (".*<coordinates>([-]?[0-9\.]{7,11}),[-]?([0-9\.]{7,11}).*", $lines, $regs))
{
$lat=$regs[2];
$long= $regs[1];
//echo "lat: $lat long: $long"; //format: <coordinates>2.395988,48.819813,0</coordinates>
}
else
{
echo "Invalid Lat/Long Format";
}

/* Create link to Google Maps to allow users to get driving directions */
//$GoogleBase="http://maps.google.com/maps?q=";
//$Search = $GoogleBase.urlencode($address);

/* Assemble code to generate map via the Google Maps API */
//$content = '<h3><a href="'.$Search.'" target=_blank>'._PAGESETTER_CLICK_GOOGLE.'</a></h3><br />';

$content = '<BR><BR><script src="http://maps.google.com/maps?file=api&v=1&key='.$key.'" type="text/javascript"></script> ';
$content = $content.'<div id="map" style="width: 500px; height: 400px"></div> ';
$content = $content.'<script type="text/javascript"> ';
$content = $content.'setTimeout("ShowGoogleMap()", 100);';
$content = $content.'window.unonload = "GUnload()";';
$content = $content.'function createMarker(point, number){ var marker = new GMarker(point);var html = "<b>" + number + "</b>";GEvent.addListener(marker, "mouseover", function() {marker.openInfoWindowHtml(html); }); return marker;}';
$content = $content.'function ShowGoogleMap(){';
$content = $content.'var map = new GMap(document.getElementById("map")); ';
$content = $content.'map.addControl(new GSmallMapControl()); ';
$content = $content.'map.addControl(new GMapTypeControl()); ';
$content = $content.'var point = new GPoint('.$long.', '.$lat.');';
$content = $content.'map.centerAndZoom(point, 4);';
$content = $content.'var marker = createMarker(point,"'.$me.'");';
$content = $content.'map.addOverlay(marker);';
$content = $content.'}';
$content = $content.'</script>';
echo $content;
?>3. Feel free to embellish. Donít

meme
09-18-2007, 10:22 PM
Anyone know how to implement this into Hot Property for each listing?

meme

lifeform
09-23-2007, 11:30 PM
Excellent feature this one! Thanks a lot.

Is it possible to make a GOogle map in the same way and show all the listings in the specific subcategories?

Would also be nice to have ALL the listings marked off on a bigger map for the whole mtree-catalogue.

lifeform
09-24-2007, 02:04 AM
BTW: I had some problems with norwegian street addresses as well on this one, but setting up maps.google.no solved everything.

woonydanny
10-22-2007, 02:34 PM
ok, i cant seem to get this to work for Australian addresses.

First i tried the code posted above with maps.google.com and then with maps.google.com.au but still no luck. the co-ordinates for an address that should be in brisbane are out in the pacific ocean off japan.

why would this be happening? i dont see why it wouldnt be geocoding it correctly as google maps in australia works fine.

any help much appreciated

Muaz
10-31-2007, 07:02 PM
Hi, This post of mine is very knowledgable and may enhance the information of the viewers , however I would like some specific information for myself. If someone can help me then please send me a private message. Best Regards,

woonydanny
11-07-2007, 11:17 AM
any luck with australian google maps integration?

Aussie777
11-15-2007, 10:01 AM
I think I have worked out why Australia isnt working but im not sure how to remedy it.

I think its do do with the negative latitude. Basically Au is the reverse of USA and i think this has something to do with it.

A USA geo is Lat 34.xxxx Long -86.xxxx
A AU one is Lat -38.xxxx Long 144.xxxx

Its the only fundamental diff I can find as AU works with all other Google mapping solutions and works from Mtree from the Map link.

Anyone have any thoughts as to why and if this could be the problem?

(Update) I found it.. and yes its sorta what I was thinking .. If you comment out the // on this line

//echo "lat: $lat long: $long"; //format: <coordinates>2.395988,48.819813,0</coordinates>

You will see the Lat and Long at the top of the map. When you test with a US listing it works fine but the Au one DOESNT bring up the - (negative) value in the echo result. Hence it wont work..

I had similar problem with field formatting in excel once and I will try and work a solution now but I am pretty sure once the field format is correctly picked up it should work anywhere on the planet. Without the - result in AU we are basically off Japan in the ocean :)

(UPDATE2 WORKING!!!)


Change line

if (ereg (".*<coordinates>([-]?[0-9\.]{7,11}),[-]?([0-9\.]{7,11}).*", $lines, $regs))

To

if (ereg (".*<coordinates>([-]?[0-9\.]{7,11}),([-]?[0-9\.]{7,11}).*", $lines, $regs))

And it works in AU now :) It should now work on any negaitve Latitude!

Cheers,
Matt

woonydanny
11-15-2007, 01:18 PM
thankyou thankyou thankyou.

cheers mate, makes sense and now works perfectly.

thanks again for your help

tlearyus
01-08-2008, 02:12 PM
thanks heaps for everyone's help to get this working..all is good in Mosets tree 2.0.3 under Firefox, Mozilla but the map position is up near the top right hand corner of the screen in IE 6.0 ????

ANY HELP TO SOLVE THIS WOULD BE REAL GOOD !!

regards - glen

auswireless
01-19-2008, 10:11 PM
Just getting into playing with Joomla 1.5 will this work with mosets and 1.5?

redzer
02-11-2008, 03:44 PM
Great Thank. one question, how do I control the possition of the map?

3bweb
02-26-2008, 01:52 AM
I just enabled mambots in the Description and used the GoogleMaps Plugin mambot - no probs!

tlearyus
03-05-2008, 07:26 AM
so how do you link this to each listing automatically without having to manualy enter the address co-ordinates for that listing ?

dknight
03-18-2008, 01:17 PM
FYI, a new field type for Mosets Tree 2.0 is available to embed Google Maps to your listing details. No code hacking required:

http://forum.mosets.com/showthread.php?p=23977#post23977