=============VFPage============
<apex:page standardController="Account">
<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: 40,
mapTypeId: google.maps.MapTypeId.HYBRID,
mapTypeControl: true
}
var map;
var marker;
var geocoder = new google.maps.Geocoder();
//var address = "{!Account.ShippingStreet}, " + "{!Account.ShippingCity}, " + "{!Account.ShippingPostalCode}";
var address = "{!Account.BillingStreet}, " + "{!Account.BillingCity}, " + "{!Account.BillingPostalCode}, " + "{!Account.BillingCountry}";
var infowindow = new google.maps.InfoWindow({
content: "<b>{!Account.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: "{!Account.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' : '150px'});
$('#map').html("Oops! {!Account.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:5000px;
background:transparent;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
</apex:pageBlock>
</apex:page>
==========After===========
1.Go to
Customize in Account Page layout
2.Select Account pagelayout click on Edit button
3.In page Layout Drop one selection header
4.Click on vfpages in the select your vfpage name drop into above section and save it
<apex:page standardController="Account">
<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: 40,
mapTypeId: google.maps.MapTypeId.HYBRID,
mapTypeControl: true
}
var map;
var marker;
var geocoder = new google.maps.Geocoder();
//var address = "{!Account.ShippingStreet}, " + "{!Account.ShippingCity}, " + "{!Account.ShippingPostalCode}";
var address = "{!Account.BillingStreet}, " + "{!Account.BillingCity}, " + "{!Account.BillingPostalCode}, " + "{!Account.BillingCountry}";
var infowindow = new google.maps.InfoWindow({
content: "<b>{!Account.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: "{!Account.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' : '150px'});
$('#map').html("Oops! {!Account.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:5000px;
background:transparent;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
</apex:pageBlock>
</apex:page>
==========After===========
1.Go to
Customize in Account Page layout2.Select Account pagelayout click on Edit button
3.In page Layout Drop one selection header
4.Click on vfpages in the select your vfpage name drop into above section and save it
No comments:
Post a Comment