Integrating Google Maps V3 into a VisualForce Page

I recently had a requirement to implement a Google Maps view for an Account and thought I would share the code I wrote to implement this functionality.

Firstly I needed to create a Visual Force Page containing the same structure as the default page, which is easy with just one line of code:

<span class="kwrd">&lt;</span><span class="html">apex:detail</span> <span class="kwrd">/&gt;</span>

The rest of the implementation requires a bit of Javascript to convert the UK Postal code into coordinates and then generate the map.

To convert a Postal code into coordinates you need to use the geocoder object:

<span class="kwrd"> var</span> geocoder = <span class="kwrd">new</span> google.maps.Geocoder();
 geocoder.geocode({
   address: <span class="str">"{!Account.BillingPostalCode}"</span>
   }, <span class="kwrd">function</span>(locResult) {
     <span class="kwrd">var</span> lat1 = locResult[0].geometry.location.lat();
     <span class="kwrd">var</span> lng1 = locResult[0].geometry.location.lng();
     <span class="kwrd">var</span> myLatlng = <span class="kwrd">new</span> google.maps.LatLng(lat1, lng1);
     <span class="kwrd">var</span> myOptions = {
       zoom: 14,
       center: myLatlng,
       mapTypeId: google.maps.MapTypeId.ROADMAP
     }
     <span class="kwrd">var</span> mapComp = document.getElementById(<span class="str">"map_canvas"</span>);
     mapComp.style.width = <span class="str">'900px'</span>;
     mapComp.style.height = <span class="str">'500px'</span>;
     <span class="kwrd">var</span> map = <span class="kwrd">new</span> google.maps.Map(mapComp, myOptions); 
     <span class="kwrd">var</span> marker = <span class="kwrd">new</span> google.maps.Marker(
             {position: myLatlng, map: map, title: address});  
                 
 });

The code above also generates a map object which can be rendered on the page.

The complete code sample can be downloaded here (don’t forget to put your own API key into the code.

image

Button Click Admin Podcast

If you are into Salesforce and Force.com like I am then I highly recommend you listen to the the Button Click Admin Podcast. Mike and Jared to an amazing job talking to people in the Salesforce community

logo

I especially love hearing at the end of each podcast when they ask the interviewee what their favourite Dreamforce moment was.

Hop along to http://buttonclickadmin.com to subscribe to their podcast. I also recommend reading the 5 tips to landing a Salesforce.com Admin job

Salesforce Chatter Triggers

Today I wanted to create an app that would allow me to add my activity so that I can analyse my time at a future date. I started my trusty IDE to start mocking up the idea when I had to step back for a moment and think there must be a simpler way to do this.

I use Salesforce for managing my projects and I usually post chatter messages to myself and others. What if I could post a custom # message that would be intercepted and posted to a custom object.

No problem… I created a custom object called Activity:

image

Then all you need to do is go to Customize > Chatter > Triggers and add a new trigger on the Feed Item.It’s then a matter of looking for a #activity tag in the feed item body, pulling the entry out and inserting it into my Activity custom object.

<span class="lnum">   1:  </span>trigger ActivityPost on FeedItem (after insert) {
<span class="lnum">   2:  </span>    <span class="kwrd">for</span> (FeedItem f : trigger.<span class="kwrd">new</span>)
<span class="lnum">   3:  </span>    {
<span class="lnum">   4:  </span>        <span class="kwrd">if</span> (f.Body.startsWith(<span class="str">'#activity'</span>)) {
<span class="lnum">   5:  </span>            funcoder__Activity__c a = <span class="kwrd">new</span> 
                                 funcoder__Activity__c (
<span class="lnum">   6:  </span>                Name = f.Body.replace(<span class="str">'#activity'</span>,<span class="str">''</span>)
<span class="lnum">   7:  </span>            );
<span class="lnum">   8:  </span>
<span class="lnum">   9:  </span>            insert a;
<span class="lnum">  10:  </span>        }
<span class="lnum">  11:  </span>    }
<span class="lnum">  12:  </span>}

Now just go and enter a chatter message, for example #activity Developed an activity application in Salesforce.

Copyright FUNCODER – DEVELOPER & TECHNOLOGY ENTHUSIAST 2017
Shale theme by Siteturner