- ARCHIVES
- » [b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
Pages: 1
[b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
- cip6192
- » FTalkAddict
377
0
1969-12-31
[b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
[b][i]Production: Class-S[/i][/b] 
[b]Credits:[/b]
-Google API-
-Google Maps-
-Gmapez-
[b]Preview:[/b]
[url]http://profiles.friendster.com/cip6192[/url]
_________________Start_________________
[b]Step one:[/b]
create a file in your [url=http://www.ripway.com]ripway[/url] account by clicking the "create text file" button [img]http://img76.imageshack.us/img76/9739/createtextfilebuttonwg0.gif[/img]
in the "filename" form create a name [b]googlemaps.html[/b], just leave the rest of it then click "save file" button.
copy the direct link of your ripway account, as you can see below pic:
[img]http://img55.imageshack.us/img55/272/urlripwayua9.jpg[/img]
[b]Step two:[/b]
you supposed to have an api key from google to have an access in google maps, visit the url below to sign up:
[url=http://code.google.com/apis/maps/signup.html]Sign Up Here!!![/url]
[img]http://img174.imageshack.us/img174/8711/apivj8.jpg[/img]
put the direct link of your ripway account into the form, click the check box then press "Generate API Key"
if you can't generate the key, you must register or log into google to see your generated api key, when you successfully generate your api key, you will saw something like this:
[url=http://img55.imageshack.us/my.php?image=generatedai4.jpg][img]http://img55.imageshack.us/img55/1350/generatedai4.th.jpg[/img][/url]
[b]Step three:[/b]
edit the created file [b]googlemaps.html[/b] by clicking "Edit Text", then add this code inside:
[quote]<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>My GMapEZ Maps</title>
<meta name="gmapkey" content="[i][b]API KEY HERE[/b][/i]" />
<script
src="http://n01se.net/gmapez/gmapez-2.4.js"
type="text/javascript"></script>
<script type="text/javascript">
function nrcIE(){
if (document.all){return false;}}
function nrcNS(e){
if(document.layers||(document.getElementById&&!document.all)){
if (e.which==2||e.which=
){
return false;}}}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=nrcNS;
}else{document.onmouseup=nrcNS;document.oncontextmenu=nrcIE;}
document.oncontextmenu=new Function("return false");
</script>
</head>
<body>
<div class="GMapEZ" style="width: [color=#fd0101]300[/color]px; height: [color=#fd0101]300[/color]px;position:absolute;top:0px;left:0px;">
</div>
</body>
</html>[/quote]
put the generated api key at the bolded text above code, you can also edit the red parts then save it!
[b]Step Four:[/b]
now we will gonna put the google map in your friendster profile, in many different ways of adding it, so its for you to decide where:
[quote]<center><iframe src=\"[i][b]googlemaps.html[/b][/i]\" frameborder=\"0\" scrolling=\"no\" style=\"overflow:hidden; background-color:#6699ff; width:300px; height:300px\"></iframe></center>[/quote]
just edit the bolded part with the url of your created file "[b]googlemaps.html[/b]"
_________________end_________________
[b]How to trick it??[/b]
to add a trick for this map you must really have patient to find what place you need or finding the place you know about ... where it was, you must visit [url]http://maps.google.com[/url] and login your account to access your own map.
i will take an example... let say i want to find out where is "tokyo disney land"
click the link below to locate it:
[url]http://maps.google.com/maps/ms?ie=UTF8&hl=en&msa=0&msid=116902296642120814155.00044b88a121204323919&ll=35.632553,139.880762&spn=0.00743,0.014505&t=h&z=16[/url]
i got the url in "Link to this page" link, they will give you the url for that exact location.
in the url, it has some parts that we need to have an exact location on that particular place to put it in your own google map:
<">in the part of the url, all we need are this parts:
[color=#0000fe][b]hl=en[/b][/color]
[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]
[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]
_____________Google Map Tricks_____________
[u][b]Add Markers[/b][/u]
make an <a> tag like this:
[quote]<a href="http://maps.google.com/maps?[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]&[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]&t=k&[color=#0000fe][b]hl=en[/b][/color]"></a>[/quote]
edit your googlemaps.html locate the line <div class="GMapEZ".......></div> then put the <a> tag enclosed to that <div> tag as this below:
[quote][b]<div class="GMapEZ" style="width: 300px; height: 300px;position:absolute;top:0px;left:0px;">[/b]
[i]<a href="http://maps.google.com/maps?[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]&[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]&t=k&[color=#0000fe][b]hl=en[/b][/color]"></a>[/i]
[b]</div>[/b][/quote]
save it! then refresh your page... you are now enable to see that location with a mark in your google map.
if you want to add more marker... just repeat the process.
[u][b]Change The Map Type[/b][/u]
To change the map type, add [b]G_MAP_TYPE[/b], [b]G_SATELLITE_TYPE[/b], or [b]G_HYBRID_TYPE[/b] to your [i]class[/i] attribute. edit your "googlemaps.html" and locate again this part and it will show how to add the type, let say [b]G_HYBRID_TYPE[/b]:
[quote]<div class="GMapEZ [b]G_HYBRID_TYPE[/b]" style="width: 300px; height: 300px;position:absolute;top:0px;left:0px;">
</div>[/quote]
as simple as that.
[u][b]Marker Types[/b][/u]
All the markers we've seen so far have used Google's default dot icon in the default orange color.
Besides "dot" you can also specify it, colors, letters and symbols:
[quote]Letters: [b]A , B , C , D , E , F[/b] ......so far so on
Colors: [b]ORANGE, PURPLE, YELLOW, GREEN, BLUE, RED, AQUA, WHITE, or GRAY.[/b]
Symbols: [b]MINI , END , START[/b][/quote]
you can also combined it with colors(only!) like [b]YELLOW MINI[/b] or [b]AQUA B[/b] just remember that only colors can combine, you cannot combined letter and symbols.
add the following type inside the <a> tag you created, as showed below:
[quote]<a href="http://maps.google.com/maps?[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]&[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]&t=k&[color=#0000fe][b]hl=en[/b][/color]">
[b]YELLOW MINI[/b]
</a>[/quote]
as simple as that too.
[u][b]Map Controls/Buttons[/b][/u]
it has three types:
Big Map Controls
<">_________
Small Map Controls
<">_________
Mini Map Controls
<">chooose which one then locate again this line([i]let say i will choose "Big Map Controls"[/i]):
[quote]<div class="GMapEZ G_HYBRID_TYPE [b]GLargeMapControl GMapTypeControl GScaleControl GOverviewMapControl[/b]" style="width: 300px; height: 300px;position:absolute;top:0px;left:0px;">
</div>[/quote]
okey thats it hehe...
for more advance option visit the link below:
[url]http://n01se.net/gmapez/infowindows.html[/url] ([i]more tricks to find here[/i])
done 
[b]Credits:[/b]
-Google API-
-Google Maps-
-Gmapez-
[b]Preview:[/b]
[url]http://profiles.friendster.com/cip6192[/url]
_________________Start_________________
[b]Step one:[/b]
create a file in your [url=http://www.ripway.com]ripway[/url] account by clicking the "create text file" button [img]http://img76.imageshack.us/img76/9739/createtextfilebuttonwg0.gif[/img]
in the "filename" form create a name [b]googlemaps.html[/b], just leave the rest of it then click "save file" button.
copy the direct link of your ripway account, as you can see below pic:
[img]http://img55.imageshack.us/img55/272/urlripwayua9.jpg[/img]
[b]Step two:[/b]
you supposed to have an api key from google to have an access in google maps, visit the url below to sign up:
[url=http://code.google.com/apis/maps/signup.html]Sign Up Here!!![/url]
[img]http://img174.imageshack.us/img174/8711/apivj8.jpg[/img]
put the direct link of your ripway account into the form, click the check box then press "Generate API Key"
if you can't generate the key, you must register or log into google to see your generated api key, when you successfully generate your api key, you will saw something like this:
[url=http://img55.imageshack.us/my.php?image=generatedai4.jpg][img]http://img55.imageshack.us/img55/1350/generatedai4.th.jpg[/img][/url]
[b]Step three:[/b]
edit the created file [b]googlemaps.html[/b] by clicking "Edit Text", then add this code inside:
[quote]<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>My GMapEZ Maps</title>
<meta name="gmapkey" content="[i][b]API KEY HERE[/b][/i]" />
<script
src="http://n01se.net/gmapez/gmapez-2.4.js"
type="text/javascript"></script>
<script type="text/javascript">
function nrcIE(){
if (document.all){return false;}}
function nrcNS(e){
if(document.layers||(document.getElementById&&!document.all)){
if (e.which==2||e.which=){
return false;}}}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=nrcNS;
}else{document.onmouseup=nrcNS;document.oncontextmenu=nrcIE;}
document.oncontextmenu=new Function("return false");
</script>
</head>
<body>
<div class="GMapEZ" style="width: [color=#fd0101]300[/color]px; height: [color=#fd0101]300[/color]px;position:absolute;top:0px;left:0px;">
</div>
</body>
</html>[/quote]
put the generated api key at the bolded text above code, you can also edit the red parts then save it!
[b]Step Four:[/b]
now we will gonna put the google map in your friendster profile, in many different ways of adding it, so its for you to decide where:
[quote]<center><iframe src=\"[i][b]googlemaps.html[/b][/i]\" frameborder=\"0\" scrolling=\"no\" style=\"overflow:hidden; background-color:#6699ff; width:300px; height:300px\"></iframe></center>[/quote]
just edit the bolded part with the url of your created file "[b]googlemaps.html[/b]"
_________________end_________________
[b]How to trick it??[/b]
to add a trick for this map you must really have patient to find what place you need or finding the place you know about ... where it was, you must visit [url]http://maps.google.com[/url] and login your account to access your own map.
i will take an example... let say i want to find out where is "tokyo disney land"
click the link below to locate it:
[url]http://maps.google.com/maps/ms?ie=UTF8&hl=en&msa=0&msid=116902296642120814155.00044b88a121204323919&ll=35.632553,139.880762&spn=0.00743,0.014505&t=h&z=16[/url]
i got the url in "Link to this page" link, they will give you the url for that exact location.
in the url, it has some parts that we need to have an exact location on that particular place to put it in your own google map:
<">in the part of the url, all we need are this parts:
[color=#0000fe][b]hl=en[/b][/color]
[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]
[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]
_____________Google Map Tricks_____________
[u][b]Add Markers[/b][/u]
make an <a> tag like this:
[quote]<a href="http://maps.google.com/maps?[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]&[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]&t=k&[color=#0000fe][b]hl=en[/b][/color]"></a>[/quote]
edit your googlemaps.html locate the line <div class="GMapEZ".......></div> then put the <a> tag enclosed to that <div> tag as this below:
[quote][b]<div class="GMapEZ" style="width: 300px; height: 300px;position:absolute;top:0px;left:0px;">[/b]
[i]<a href="http://maps.google.com/maps?[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]&[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]&t=k&[color=#0000fe][b]hl=en[/b][/color]"></a>[/i]
[b]</div>[/b][/quote]
save it! then refresh your page... you are now enable to see that location with a mark in your google map.
if you want to add more marker... just repeat the process.
[u][b]Change The Map Type[/b][/u]
To change the map type, add [b]G_MAP_TYPE[/b], [b]G_SATELLITE_TYPE[/b], or [b]G_HYBRID_TYPE[/b] to your [i]class[/i] attribute. edit your "googlemaps.html" and locate again this part and it will show how to add the type, let say [b]G_HYBRID_TYPE[/b]:
[quote]<div class="GMapEZ [b]G_HYBRID_TYPE[/b]" style="width: 300px; height: 300px;position:absolute;top:0px;left:0px;">
</div>[/quote]
as simple as that.
[u][b]Marker Types[/b][/u]
All the markers we've seen so far have used Google's default dot icon in the default orange color.
Besides "dot" you can also specify it, colors, letters and symbols:
[quote]Letters: [b]A , B , C , D , E , F[/b] ......so far so on
Colors: [b]ORANGE, PURPLE, YELLOW, GREEN, BLUE, RED, AQUA, WHITE, or GRAY.[/b]
Symbols: [b]MINI , END , START[/b][/quote]
you can also combined it with colors(only!) like [b]YELLOW MINI[/b] or [b]AQUA B[/b] just remember that only colors can combine, you cannot combined letter and symbols.
add the following type inside the <a> tag you created, as showed below:
[quote]<a href="http://maps.google.com/maps?[color=#0000fe][b]ll=35.632553,139.880762[/b][/color]&[color=#0000fe][b]spn=0.00743,0.014505[/b][/color]&t=k&[color=#0000fe][b]hl=en[/b][/color]">
[b]YELLOW MINI[/b]
</a>[/quote]
as simple as that too.
[u][b]Map Controls/Buttons[/b][/u]
it has three types:
Big Map Controls
<">_________
Small Map Controls
<">_________
Mini Map Controls
<">chooose which one then locate again this line([i]let say i will choose "Big Map Controls"[/i]):
[quote]<div class="GMapEZ G_HYBRID_TYPE [b]GLargeMapControl GMapTypeControl GScaleControl GOverviewMapControl[/b]" style="width: 300px; height: 300px;position:absolute;top:0px;left:0px;">
</div>[/quote]
okey thats it hehe...
for more advance option visit the link below:
[url]http://n01se.net/gmapez/infowindows.html[/url] ([i]more tricks to find here[/i])
done
 |
- BwizetT
- » FTalkGeek
- 1015
- 0
- 1969-12-31
Re: [b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
[b]Just Great Cip, Keep 'em Rollin those trick ei...[/b] 
|
- cklahrckiey
- » FTalkFreak
- 1891
- 0
- 1969-12-31
Re: [b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
well it's a little confusing....hehehe
but ill try this one....go Class S 
|
- mudpoet
- » FTalkAddict
- 393
- 0
- 1969-12-31
Re: [b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
yah it's a litte bit confusing... i think this is a nice trick
im gonna try this... thanks for sharing!
Last edited by mudpoet (2008-05-26 20:27:27)
|
- niceblue00
- » FTalker
- 186
- 0
- 1969-12-31
Re: [b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
cool.. nice one... thanks for sharing!
Last edited by niceblue00 (2008-05-27 16:25:19)
|
- ezekielclarion
- » FTalker
- 296
- 0
- 1969-12-31
Re: [b][i]Production: Class-S[/i][/b] =D [b]Credits:[/b] -Google API- -Google Maps- -Gmapez- [b]Preview:[/b] [url]http://profiles.friendster.com/cip6192[/url] _________________Start_________________ [
another great from cip!! haha..
thanks for sharin cip..
|