Salesforce, Google Map 3 and jQuery with Clusters

Monday, March 18, 2013 by Aslam - The Alexendra
Hi All,
In past i have posted one blog regarding google map, using jquery and google map version 2. Now since, google have version 3 so i have upgraded my plugin with latest version and also used more featured jquery plugin i found which is gMap3. You can check it here:
http://gmap3.net/en/

I recommend you first refer my earlier version of google map component here:
http://techsahre.blogspot.in/2011/04/sfgmap-salesforce-google-map-jquery.html

I used this jQuery plugin and implemented my own new version of sfGmap, called sfGmap3



 This component has all features like previous component but have one more new feature called Clusters. You can turn On and Off this feature in my component using attribute "useCluster".

Here is a basic usage of this component:
<c:sfgmap3 addressmodel="{!addressmodel}" height="500px" usecluster="true" uselatlng="false" width="100%" zoom="2" />

I used this plugin and created one demo to show historical places in Rajasthan. Thanks to my collegue Rajendar Rathore, who helped me to make database for these places which included lat, long, pictures etc. Here the link for online demo:

http://labsprojects-developer-edition.ap1.force.com/GMapRajasthanPlaces

You can see each cluster is identified by a image, i used Camel image. Once you zoom in, you will keep go inside the cluster and finally you can find the actual place. You can click on each marker and you can find a info window containing image of that place and name like below.



Hope you will like it. Mail me for full code of this demo and let me know suggestions to improve it as always.

Thanks
Aslam Bari
http://www.aslambari.com

25 comments:

Zia Baig said...

Good One

Abdul Vahid said...

Nice :)

Durga said...

Nice one...

Nicole Thomas said...

Hi to all, how is everything, I think every one is getting more from this web page, and your views are fastidious for new users.

Drupal developer London

Nicole Thomas said...

What's up to all, the contents existing at this site are really awesome for people knowledge, well, keep up the good work fellows.

PHP developer London

Somnath Dash said...

Hi What all changes do i need to do in order to update the gmapv2 package in salesforce

Aslam - The Alexendra said...

@Somnath
Send me email, i will send you zip

malem ching said...

Hi @Aslam i have modified the package you send meh but still m not able to see the Map is there any system setting that i need to change

Aslam - The Alexendra said...

@malem
make your page on force.com and provide the url, so other people can help.
I guess you are not using proper api key

malem ching said...

Hi Have shared the code in developer force below is the url

http://boards.developerforce.com/t5/Apex-Code-Development/Google-Map-coming-blank/td-p/611143

Aslam - The Alexendra said...

@malem, not this way
make a force.com site and put your page there and then give us public url of running page. Like i did for demo page.

malem ching said...

hi Aslam below is the Link please check

http://chanucompany-developer-edition.ap1.force.com/

K Arun said...

HI.

I am looking to populate my salesforce data and try to use ESRI mapping service to have clickable functionality in Map..

Please let me know,If this is possible.

Sylvio Avilla said...

Hi @Aslam. I'm need to upgrade sfGMap to sfGMap3 but no clues how to do it. Can you please help me?
Thanks

Aslam - The Alexendra said...

Hi All,
Any body needed code, please email me at
aslam.bari@gmail.com

Thanks

Amit said...

Hi aslam. I have installed the package ..but when i run the mapdemo page nothing came up.. its a blank page only showing section header part....

please suggest me what t do

Sylvio Avilla said...

Hello,

Someone can tell me how to install the package? No clues how to do it! :S

Thanks

Sylvio

Ella Scott said...

Hello, Neat post. There is an issue with your website in web explorer,
could test this? IE nonetheless is the market chief and a large component of folks will miss your fantastic writing due to this problem.
ecommerce software solutions

SpyIndia Ranjeet said...

SpyIndia releases a new POCKET PHONE JAMMER(METAL BODY)

Peter Parker said...

we are the best web design firm and digital marketing agency that offers high end web design and web development service at affordable cost all over the world moreover we provides digital marketing service at optimal cost all over world.

Jhonson Smith said...
This comment has been removed by the author.
Sunil N said...

Hey Aslam, can you send me the code. I emailed you.

dhivya priya said...

This is an awesome post.Really very informative and creative contents. These concept is a good way to enhance the knowledge.I like it and help me to development very well.Thank you for this brief explanation and very nice information.Well, got a good knowledge.
Isoft Innovations Facebook

Sowmiya said...

Really Good blog post.provided a helpful information about salesforce google map.I hope that you will post more updates like this.
MSBI Training in Chennai

lakshmi deepa said...

Thank you for your sharing information..Its very interesting and useful.. awesome article
SAP Training in Chennai
SAP Basis Training in Chennai
SAP SD Training in Chennai
SAP FICO Training in Chennai

Post a Comment