You need to sign in to do that
Don't have an account?
Why I received error when try integrate the google map into vf page and then use it in salesforce Task
Hi,
I have made my code for the vf page to be this way:
<apex:page standardController="Task">
<!-- This will import Necessary Jquery js File and StyleSheets, maybe I should declare the website to another 3rd party API instead of google map-->
<apex:includeScript value="https://maps.googleapis.com/maps/api/js?key=AIzaSyDMX_jQIEOUZKyrthQdQwRPZA-e1hXlGGE&sensor=false"/>
<apex:includeScript value="{!URLFOR($Resource.jQuery_BlogForce9_162, 'js/jquery-1.6.2.min.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jQuery_BlogForce9_162, 'js/jquery-ui-1.8.16.custom.min.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jqPlugin, '/jquery.blockUI.js')}"/>
<apex:stylesheet value="{!URLFOR($Resource.jQuery_BlogForce9_162, 'css/ui-lightness/jquery-ui-1.8.16.custom.css')}"/>
<script>
var map,geocoder,infowindow;
var latLngs = [];
$j = jQuery.noConflict();
$j(document).ready(function(){
initialize();
});
function initialize() {
geocoder = new google.maps.Geocoder();
//initial cordinates for map init based on Tokyo
var latlng = new google.maps.LatLng(35.6895, 139.6917);
var myOptions = {
zoom: 4,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
//This will load the map and print information
map = new google.maps.Map($j('#map')[0], myOptions);
codeAddress();
}
/*This function codes the address using the Billing Address in the Acoount*/
function codeAddress(){
//prepare a string for geocoding
var address = '{!Task.Site_Street__c},{!Task.Site_City__c},{!Task.Site_State__c},{!Task.Site_Zip__c}';
console.log(address);
//geocode the address
geocoder.geocode( { 'address': address }, function(results, status) {
//if it is a success
if (status == google.maps.GeocoderStatus.OK) {
var location = results[0].geometry.location;
var marker=addMarker(location );
//attach info window to the marker
attachInfoWindow(marker,results[0]);
}
else {
alert(status);
}
});
}
/*
*This method adds a marker to the provided location
**/
function addMarker(location) {
marker = new google.maps.Marker({
position: location,
map: map
});
//set the bounds and initial zoom
var latlngbounds = new google.maps.LatLngBounds();
latlngbounds.extend(marker.getPosition());
map.fitBounds(latlngbounds);
map.setZoom(14);
return marker;
}
//this function shows the address of a marker when it is clicked
function attachInfoWindow(marker,address){
google.maps.event.addListener(marker, 'click', function() {
if(infowindow!=null)
{
infowindow.close();
}
//HTML formated string that is used to dispaly info window over the map markers currently showing the formated address
var contentString = '<div class=" ui-state-active ui-corner-top" style="font-size: 1em; padding: 5px;">Address</div>'
+'<div class="ui-widget-content ui-corner-bottom" style="font-size: .9em; padding: 15px;">'+address.formatted_address+'</div>';
infowindow = new google.maps.InfoWindow({
content: contentString
});
infowindow.open(map,marker);
});
}
</script>
<style>
#map {
width:100%;
height:200px;
margin-left:1.5%;
}
</style>
<div id="map" class="ui-widget-content ui-corner-all ui-state-default"></div>
</apex:page>
However, I received an error such as
[c.ap0.visual.force.com
REQUEST_DENIED]
I do not know why it doesnt take the address in the task whenever I already specified the everything from address, city, state and zipcode. Please someone help me.
I went through the query of yours and found some posts related to the kind of the same problem. Please refer to the following links as they may be helpful in solving your problem:
-https://developer.salesforce.com/forums/?id=9060G000000I6AaQAK
-https://developer.salesforce.com/forums/?id=9060G000000I6CvQAK
I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.
Thanks and Regards,
Deepali Kulshrestha