Knowledgebase
View categorized listing of all common frequently asked questions.
Video Tutorials (jReviews 2.0)
Create a Movie & TV Show review website.
Customize the jReviews themes.
Review user profiles with the Everywhere addon.
Forum
Community forum
Submit a Ticket
Use your client area email to access the ticket system.
Downloads
Guides, modules and more...
CSV Import for Joomla and jReviews
 
Welcome, Guest. Please login or register.
Did you miss your activation email?
December 01, 2008, 09:11:32 PM
21661 Posts in 4948 Topics by 2838 Members
Latest Member: davidkan
News: Do not post any jReviews files or large amounts of code in the forums please. Only template files and code are allowed.
 
jReviews Support Forum  |  jReviews 1.x  |  Tips & tricks  |  Google Map - Showing Locations from jReviews listings « previous next »
Pages: [1]
Author Topic: Google Map - Showing Locations from jReviews listings  (Read 3886 times)
mrscripto
Jr. Member
**
Offline Offline

Posts: 35


« on: January 28, 2008, 12:36:59 AM »

Finally, my contribution to the forum... hopefully someone will find this useful.

I wanted a world map showing all of the locations of Tequila Bars in my reviews section and this is what I came up with. You will need to modify the code based on your category ID, and jr fields. And I added a new field for a GPS coordinate, as I didn't have much luck using a longitude and latitude entry.

http://bars.tequila.net (example)



Code:
<html>
<head>
<STYLE>
   body {
      font-family:arial;
   }
</STYLE>
<title>Page Title</title>
<meta name="description" contents="meta_description">
<meta name="keywords" contents="meta_keywords">
</head>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=enter_really_long_google_api_key_here" type="text/javascript"></script>
<script type="text/javascript">
var map;
function load() {
        if (GBrowserIsCompatible()) {
               map = new GMap2(document.getElementById("map"));
               map.addControl(new GMapTypeControl());
               map.addControl(new GLargeMapControl());
               map.addControl(new GScaleControl());
               map.setCenter(new GLatLng(21.943046, -51.328125), 2, G_HYBRID_MAP);

                      // Create a custom map pointer icon

           var barIcon = new GIcon(G_DEFAULT_ICON);
           barIcon.image = "http://www.yoursite.com/image.png";

    // Set up custom GMarkerOptions icon
markerOption2 = { icon:barIcon };

<?php
//connect to the database
$db "your_database_name";
$hostname "localhost";
$password "database_password";
$user "database_user";

$open mysql_connect($hostname,$user,$password);
mysql_select_db("$db",$open);

//query for bars, enter appropriate category id below, catid, and field names

$bars_sql "SELECT jos_content.id, jos_content.catid, jos_content.title, jos_jreviews_content.jr_bargps, jos_jreviews_content.jr_baraddress, jos_jreviews_content.jr_barcity, jos_jreviews_content.jr_barstate
FROM jos_content, jos_jreviews_content
WHERE jos_content.catid = '39'
AND jos_jreviews_content.contentid = jos_content.id
AND jos_content.state = '1'
AND jos_jreviews_content.jr_bargps != 'NULL'"
;

$result_bars mysql_query("$bars_sql");
$barscount mysql_numrows($result_bars);

   for($i=0$i<$barscount$i++)
   {
$page .= 'var marker'.($i+1).' = new GMarker(new GLatLng('.mysql_result($result_bars,$i,"jos_jreviews_content.jr_bargps").'), markerOption2);
GEvent.addListener(marker'
.($i+1).', \'click\', function() { marker'.($i+1).'.openInfoWindowHtml("<div style=\'width: 150px; height: 55px;\'><div style=\'float: left; width: 150px; height: 55px;\'><table width=\'100%\'><tr><td align=\'center\' valign=\'middle\'><font size=\'-2\'><a href=\'http://www.yoursite.com/'.str_replace(" ""_"strtolower(mysql_result($result_bars,$i,"jos_content.title"))).'.html\' target=\'_blank\'>'.mysql_result($result_bars,$i,"jos_content.title").'<br>'.mysql_result($result_bars,$i,"jos_jreviews_content.jr_baraddress").'<br>'.mysql_result($result_bars,$i,"jos_jreviews_content.jr_barcity").', '.str_replace("*"""mysql_result($result_bars,$i,"jos_jreviews_content.jr_barstate")).'</font></a></td></tr></table></div></div>"); });
map.addOverlay(marker'
.($i+1).');';
$page .= "\n";
   }

echo 
$page;

?>

        }
}
</script>
<body bgcolor='#FFFFFF' text='#000000' link='#FF0000' alink='#FF0000' vlink='#FF0000' onload="load()" onunload="GUnload()">
<table style="width: 100%; height: 100%;">
<tr><td><a href="http://www.yoursite.net"><img src="http://www.yoursite.com/logo.jpg" border="0"></a></td><td align='center' style="height: 70px;"><font color='#000000' size='-1'>
<b>Map options:</b><br>Click to Zoom Areas:
<span style='cursor: pointer;' onclick='map.setCenter(new GLatLng(39.504153, -94.928521), 4);'><u>United States</u></span> -
<span style='cursor: pointer;' onclick='map.setCenter(new GLatLng(22.877440,-101.777344), 5);'><u>Mexico</u></span> -
<span style='cursor: pointer;' onclick='map.setCenter(new GLatLng(21.943046, -51.328125), 2);'><u>World</u></span><br>
</font></td></tr>
<tr><td style="height: 100%" colspan="2">
<div align='center' id="map"  style="width: 100%; height: 100%"></div>
</td></tr><tr><td colspan="2"><font color='#000000' size='-1'>Instructions: Click on the pointer location to view the name and address, then click on the text to view the listing for that location.</font>
</td></tr></table>
</body>
</html>

Logged
andreasa
Hero Member
*****
Offline Offline

Posts: 271



WWW
« Reply #1 on: February 05, 2008, 08:54:05 AM »

Great work!
Thank you very much for shared it.
Logged
bryanjer
Newbie
*
Offline Offline

Posts: 4


« Reply #2 on: March 05, 2008, 10:15:57 AM »

Ok, so I tried working with the code recommendations you have here... so far i can get the map to load up ok, but i cant get any markers to be displayed at all.

What I did was create a text field in jreviews to represent a comma delimited lat/lon for the coordinates.  And then I tweaked the variable names, etc.  If it makes a difference,  I just created a separate menu link to an html file... just in case that may limit my access to the mysql db.

Would you have any suggestions for why I wouldn't be getting markers created?  I only have one entry in the db right now for testing, but I can say that Ive verified the data in the sql tables themselves.

Im new to playing with php and google maps at the code level, so any thoughts would be very helpful.  Thanks in advance!

Code:

<html>
<head>
<STYLE>
   body {
      font-family:arial;
   }
</STYLE>
<title>Page Title</title>
<meta name="description" contents="meta_description">
<meta name="keywords" contents="meta_keywords">
</head>
<script

src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=myKey

TA" type="text/javascript"></script>
<script type="text/javascript">
var map;
function load() {
        if (GBrowserIsCompatible()) {
               map = new GMap2(document.getElementById("map"));
               map.addControl(new GMapTypeControl());
               map.addControl(new GLargeMapControl());
               map.addControl(new GScaleControl());
               map.setCenter(new GLatLng(21.943046, -51.328125), 2, G_HYBRID_MAP);

                // Create a custom map pointer icon

var barIcon = new GIcon(G_DEFAULT_ICON);
barIcon.image = "http://www.travltrails.com/image.png";

// Set up custom GMarkerOptions icon
markerOption2 = { icon:barIcon };

<?php
//connect to the database

$db "my_database_name";
$hostname "localhost";
$password "my_password";
$user "my_username";

$open mysql_connect($hostname,$user,$password);

mysql_select_db("$db",$open);


//query for bars, enter appropriate category id below, catid, and field names

$trails_sql "SELECT jos_content.id, jos_content.catid, jos_content.title, jos_jreviews_content.jr_traillatlon, 

jos_jreviews_content.jr_state"

FROM jos_contentjos_jreviews_content

WHERE jos_content
.catid '14'
AND jos_jreviews_content.contentid jos_content.id
AND jos_content.state '1'
AND jos_jreviews_content.jr_traillatlon != 'NULL'";
$result_trails = mysql_query("
$trails_sql");
$trailscount = mysql_numrows($result_trails);

   for($i=0; $i<$trailscount; $i++)
$page .= 'var marker'.($i+1).' = new GMarker(new 

GLatLng('.mysql_result($result_trails,$i,"
jos_jreviews_content.jr_traillatlon".)', markerOption2);

GEvent.addListener(marker'.($i+1).', \'click\', function() { marker'.($i+1).'.openInfoWindowHtml("
<div style='width: 150px; 

height: 55px;\'>

<div style=\'float: left; width: 150px; height: 55px;\'>

<table width=\'100%\'>
<tr>
<td align=\'center\' valign=\'middle\'><font size=\'-2\'>

<a href=\'http://www.travltrails.com/'
.str_replace(" ""_"

strtolower(mysql_result($result_trails,$i,"jos_content.title"))).'.html\' 

target=\'_blank\'>'
.mysql_result($result_trails,$i,"jos_content.title").'<br>'.', '.str_replace("*"""

mysql_result($result_trails,$i,"jos_content.state")).'</font></a>

</td>
</tr>
</table>
</div>
</div>"); });
map.addOverlay(marker'
.($i+1).');';
$page .= "\n";
   }

echo 
$page;

?>

        }
}
</script>
<body bgcolor='#FFFFFF' text='#000000' link='#FF0000' alink='#FF0000' vlink='#FF0000' onload="load()" onunload="GUnload()">

<table style="width: 690px; height: 500px;">
<tr>
<td></td>
<td align='center' style="height: 70px;"><font color='#000000' size='-1'>
<b>Map options:</b><br>Click to Zoom Areas:
<span style='cursor: pointer;' onclick='map.setCenter(new GLatLng(39.504153, -94.928521), 4);'><u>United States</u></span> -
<span style='cursor: pointer;' onclick='map.setCenter(new GLatLng(22.877440,-101.777344), 5);'><u>Mexico</u></span> -
<span style='cursor: pointer;' onclick='map.setCenter(new GLatLng(21.943046, -51.328125), 2);'><u>World</u></span><br>
</font>
</td>
</tr>
<tr>
<td style="height: 100%" colspan="2">
<div align='center' id="map"  style="width: 100%; height: 100%"></div>
</td>
</tr>
<tr>
<td colspan="2"><font color='#000000' size='-1'>Instructions: Click on the pointer location to view the name and address, then click on the

text to view the listing for that location.</font>
</td>
</tr>
</table>

</body>
</html>
Logged
tsr
Jr. Member
**
Offline Offline

Posts: 46



« Reply #3 on: April 16, 2008, 01:12:56 AM »

in my humble opinion , its not safe to leave your db information there.
potential security risk. Shocked
Logged
gokrew
Jr. Member
**
Offline Offline

Posts: 37


« Reply #4 on: May 13, 2008, 08:34:22 AM »

Hello, is it  possible to make to choose who inserts an article the map to visualize?
In my site the articles are about travels around the world. Sections correspond to continents and categories to states.
Is it possible to insert in template  "com_content.html"  a link to google maps so that the user ( a user regual register in my site and Logged in)  insert a new travel, for example in Spain, there will appear a map of Spain in an article and under the form with photos and reviews?
Or if the user insert a new travel in London there will appear a map of London.
Otherwise if it is possible to make something of similar.
Thanks  Smiley
Logged
nicolas.boseret
Newbie
*
Offline Offline

Posts: 7


« Reply #5 on: May 23, 2008, 11:27:25 AM »

Hi there,
I love the concept and I' like to use it.

I've created a php page on my joomla directory but calling the page gives me HTTP ERROR 500 ...
is there anything I'd need to do to let this page be executed ?

Cheers,

Nicolas.
Logged
sko
Newbie
*
Offline Offline

Posts: 24


« Reply #6 on: September 16, 2008, 06:27:56 AM »

Great Idee, a single map showing all listings is really a top idea!

hope this will get further development..  Smiley
Logged
greenericka
Newbie
*
Offline Offline

Posts: 8


« Reply #7 on: September 16, 2008, 12:57:09 PM »

FYI, I'm using YooMaps with jReviews to do the same thing. The user submits a new listing through jReviews for the location and it appears on the YooMaps map. I tested it and it works.

There are two issues: one, the user has to enter the address/location for the title and two, the YooMaps module doesn't allow for the "Read More" link to work - so even though a user may submit a whole article with lots of information about the location, there is no way to access the whole article from the marker bubble (unless someone adds a hardcoded link to the marker bubble manually).
Logged
Adam
Newbie
*
Offline Offline

Posts: 10


« Reply #8 on: September 21, 2008, 02:21:38 AM »

That 500 error in browser, can by from charset in joomla.
When I use ISO version i got error too.
Now I use utf languages and got no error.
( now I only use google map plugin to show map in details review, is not
map for all review in site - but i try soon that hack too Smiley )
Logged

joomla 1.0.15
full jReview
mrscripto
Jr. Member
**
Offline Offline

Posts: 35


« Reply #9 on: September 23, 2008, 01:16:08 AM »

I have not experienced any errors on mine, the only pain is getting the coordinates for each listing, as sometimes google maps can't find all addresses.

Send a PM if you need help, I'll do my best...
Logged
Adam
Newbie
*
Offline Offline

Posts: 10


« Reply #10 on: September 23, 2008, 09:05:19 AM »

There is posibilty to use that map only with adress, city, province, country fileds, without Lat long data ?

Logged

joomla 1.0.15
full jReview
Pages: [1]
« previous next »
    Jump to: