Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Harshad Kokate 13Harshad Kokate 13 

I need To show google maps into the vf page in which it auto matically detects yhe country and state by detecting clients adress city and pincode It should also shows customer location

I have written the following code Kindly help me in this


<apex:page>
<apex:page standardController="Customer_Information__c">
<apex:pageBlock >
<head>
 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
 
$(document).ready(function() {
 
  var myOptions = {
    zoom: 20,
    mapTypeId: google.maps.MapTypeId.HYBRID,
    mapTypeControl: true
  }
 
  var map;
  var marker;
 
  var geocoder = new google.maps.Geocoder();
  var address = "{!Customer_Information__c.Address_Line__c}, " + "{!Customer_Information__c.City__c}, ";
 
  var infowindow = new google.maps.InfoWindow({
    content: "<b>{!Customer_Information__c.Name}</b>"
  });
 
  geocoder.geocode( { address: address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK && results.length) {
      if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
      
        //create map
        map = new google.maps.Map(document.getElementById("map"), myOptions);
      
        //center map
        map.setCenter(results[0].geometry.location);
        
        //create marker
        marker = new google.maps.Marker({
            position: results[0].geometry.location,
            map: map,
            title: "{!Customer_Information__c.Name}"
        });
        
        //add listeners
        google.maps.event.addListener(marker, 'click', function() {
          infowindow.open(map,marker);
        });
        google.maps.event.addListener(infowindow, 'closeclick', function() {
          map.setCenter(marker.getPosition());
        });
        
      }
      
    } else {
      $('#map').css({'height' : '15px'});
      $('#map').html("Oops! {!Customer_Information__c.Name}'s address could not be found, please make sure the address is correct.");
      resizeIframe();
    }
  });
 
  function resizeIframe() {
    var me = window.name;
    if (me) {
      var iframes = parent.document.getElementsByName(me);
      if (iframes && iframes.length == 1) {
        height = document.body.offsetHeight;
        iframes[0].style.height = height + "px";
      }
    }
  }
 
});
</script>
 
<style>
#map {
  font-family: Arial;
  font-size:12px;
  line-height:normal !important;
  height:500px;
  background:transparent;
}
</style>
 
</head>
 
<body>
<div id="map"></div>
</body>
</apex:pageBlock>
</apex:page>

 
Best Answer chosen by Harshad Kokate 13
Rahul BorgaonkarRahul Borgaonkar
Hi,

Remove first line, this is causing error
<apex:page>

You need to add id of Customer_Information__c record to get record values in page, suppose your page name is 'GoogleMap' then URL string should be
https://c.ap1.visual.force.com/apex/GoogleMap?id=<id of Customer_Information__c record>.

Best Regards

All Answers

Harshad Kokate 13Harshad Kokate 13
It is also giving the arror at last line that
XML document structures must start and end within the same entity.
Rahul BorgaonkarRahul Borgaonkar
Hi,

Remove first line, this is causing error
<apex:page>

You need to add id of Customer_Information__c record to get record values in page, suppose your page name is 'GoogleMap' then URL string should be
https://c.ap1.visual.force.com/apex/GoogleMap?id=<id of Customer_Information__c record>.

Best Regards
This was selected as the best answer
Harshad Kokate 13Harshad Kokate 13
thanks Dear
it helps me alott
I also wanna show in that map the nearest hotel ,resturant,golf courses and bowling alleysgolf
near by the customers location