google maps is one of the very best mapping services available these days. using their api you can embed interactive maps of different types in your web pages. and there are many plugins to make your life easier to embed such maps in your web pages and applications.
to embed interactive google map, you need to include some external javascript files first. now when you are using some hosted solutions like wordpress, they may not allow you to include external javascript files in your blog/pages for different security pre-cautions. this is where google static map api comes handy.
google static maps api takes latitude and longitude of some places as parameter, along with other optional formatting params and delivers a static image in your expected image format (default is gif, but you can choose among gif, png and jpeg). so you dont need to bother about permission of including any other javascript files in your pages and you can embed such static maps by specifying the url as a “src” attribute of <img> tag.
there is still one problem that might knock you down. for example if you want to display “dhaka”, the capital or bangladesh in your static map, you need to know it’s latitude and longitude. so not everyone of us speaks in a language of ‘latitude’ and ‘longitude’ but onle the name of the places. like we all know about “university of berkeley” but only very few can figure out it’s lat-lon or they have to find it out from existing geocoding services.
yesterday night i was studying about this static map api and decided to build a geocoding wrapper so that you can pass only the name of a place and my wrapper class will convert it to latitude and longitude using geociding services and then generate a static map image for you. the whole wrapper will work around two objects – geocoding service and google static map api. for geocoding i prefer to use google because of it’s amazing precision but i must say that yahoo’s geocoding service is also pretty good.
here is my wrapper class and i am sure you can find it useful. now you can use it to embed google map to anywhere you would like to :). this class is released under LGPL.
there is a sample usage file (gmap.php which you will make use of) and a source object “staticgmap.php”. this class became a part of orchid framework and prothom alo blog. if you enjoy/use this class, dont forget to drop a line here in this post. the class and usage file is moderately commented, so you will not face any problem to understand. however the usage file is also pretty fine working.
please download the class from this page
download: http://svnpg.net/gmap/
supported features
1. geocoding service, both yahoo and google (default is yahoo)
2. support of zooming (0-19, default is 12)
3. support of image format (gif, jpeg and png. default is GIF)
4. maptype support (roadmap, satellite, mobile, hybrid and terrain where default is roadmap)
5. support of markers (just as plain location name)
6. variable dimension support (default size is 400×400)
sample maps
locate dhaka and moti jheel
http://svnpg.net/gmap/gmap.php?location=dhaka&markers=dhaka,moti jheel
locate berkeley and emeryvlle
http://svnpg.net/gmap/gmap.php?location=berkeley&markers=berkeley,emeryville&zoom=11
place where i live – uttara 14 with custom zoom level and custom size
http://svnpg.net/gmap/gmap.php?location=uttara 14&zoom=16&size=400×300
Many many thanks for this awesome post! You are great man……..:)
another creation of the legend 😀
Great bole to .. beshi great… 😀
Thanks a lot Hasin bhai..
josh 🙂
Great Post. And this class will make the developers life more easy.
Now that’s what I call a real-world problem solving piece of code. Easy to use, powerful yet so elegantly done !
Very helpful post!
Thanks. Hope I will use this in personal blog. Can I work on it to make as a wordpress plugin and widget ? I don’t know is there any plugin for wordpress.
daroooooooooooooooon
manchu, definitely you can work on it. and if you make it a wordpress plugin that will be really great. i haven’t noticed if there is any such plugins yet.
Excellent work 🙂 . Life become more easy now. Do you do for any of the project ?
@saidur – yeah, it was done to embed google maps easily in our facebook applications (i2we inc) and later i have used it in prothom-aloblog
🙂
wonderful!
very nice idea and a very good implementation.
chomotkar hoyeche dada. chaliye jan.
Coooooooooooool!! thanks for the post. 🙂
gr8 work!!!
Hasin bhai, we want more from you like this post.
Thanks
A very good concept from a sharp thinker. Cheers for Hasin Bhai. All i wanna say: “Jotil GURU Jotil”
bhai, ai kajta ekbosor agai korlai parten!
Like a year ago me n jewel worked on a french project and we hired an intern student to find lon/lat around of 100 cities of France :p
anyways, hope it will help a lot of people.
nice work . Hope to use it in one of my projects.
Its great Hasin bhai 🙂
And, Thanks for not making it few days ago ;). I have just finished a work with Google map. If I found this class that time, I may not learn Google map API 🙂
Still I’d like to see the dynamic one directly from Google. I can do whatever I want with that. But ya, I must know the use of that before I click+hold+drag the map. 🙂
Really awesome boss!
thinking of ways to implement in the jtl… which is yet to learn lol
Great features!!
Thanks.
লোকেশন তো জেনে গেলাম। যে কোন সময় চলে আসতে পারি 🙂
Nice one for me..!! Just got it in right time..!!
I was looking for something like this for my real state project..!!
Will use it in my next real state project..!!
Thanks lot, hasin bhai..!!
nice wrap up with geo coding,
i guess you are keeping cache on your side since image url is fully wrapped by your hosted solution.
i think if you used Location: google-static-map-url-with-parameters on your php script, (which will redirect to the google original static map url) that would have been more controlled from google.
that would also reduce your cache expiry and cache creational related concerns (ie. hard disk usage, bandwidth and so on )
anyway nice work!
best wishes,
Really a very useful wrapper, especially for embedding maps in hosted blogs and facebook apps that are built using FBML. Thanks Hasin bhai for sharing it 🙂
simply wow
Ubiquity তে “map this” বললেই সুন্দর ম্যাপ দিয়ে দেয় যেখানে সেখানে !
ভালো জিনিস বানিয়েছেন হাসিন ভাই !
Wow!! Am impressed Hasin 🙂
Cool wrapper class you made using the API…..
Really amazed!!!
Hi Hasin
G00d work. Do you know how can i embed this map object in VBA forms. I dont want to use object browser.
Cheers
Ana
Hello Hasin,
Thanks for this tutorial. I would also like to know if its possible to generate a staic image of a map with KML overlay. You can see an example of it in my map generator at http://www.29travels.com
If there was a way to create a jpg or gif of it, it would be nice.
Thanks
-ps, thanks for the zip.lib script, i am using that to convert Kml->Kmz. 🙂
testing comment
Simply WoW….
Kothin jinish banaisen hasin vai 🙂
very nice blog
thank you
Nice man thanks. It was cool to find this answer here, I picked up your smarty book a few months back.
thank you a lot, it was just what i was looking for
good job
This is exactly the script that I needed for my wordpress + pods plugin site! You are the best person ever!!!
This is exactly the script that
This is exactly the script that
Good work.
But I need a circle around main location.
And I want custom markers.
How can I do this??
Hi, i think that i saw you visited my web site thus i came to “return the favor”.I’m attempting to find things to improve my site!I suppose its ok to use some of your ideas!!
i`ve been looking for this for a long time , thanks a lot1
Hi, i think that i saw you visited my web site thus i came to “return the favor”.I’m attempting to find things to improve my site!I suppose its ok to use some of your ideas!!