Apex Code Development You need to sign in to do that
Don't have an account?
Harshad 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>
<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>
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
XML document structures must start and end within the same entity.
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
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