If you are looking for a method that translates addresses into coordinates with the help of the powerful Google Maps API and don't want to use the APEX webservices for whatever reason, you have found the right article. 

First of all you need to create a Region containing the map. For that, just add a simple HTML Region with following Source:

<div id="map-canvas" style="height:500px;"></div>

After that, set following Javascript-Attributes for the Page itself:

File URL's:


Function Declaration

function initialize() {
  var myLatlng = new google.maps.LatLng(0,0);
  var mapOptions = {
    zoom: 4,
    center: myLatlng
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
google.maps.event.addDomListener(window, 'load', initialize);


For this to work properly you have to create a page containing the following 3 Page Items.

P81_ADDRESS    (as input for the address)
P81_LATITUDE   (output of latitude)
P81_LONGITUDE  (output of longitude)

Then place a button somewhere and create a dynamic action for it.

Use following Source as JavaScript Code that has to be Executed. Don't forget to set P81_LATITUDE and P81_LONGITUDE as affected Items. Otherwise the values won't be properly set.

var geocoder = new google.maps.Geocoder();
var address = apex.item('P81_ADDRESS').getValue();
geocoder.geocode( { 'address': address}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
  } else {
    alert('Geocode was not successful for the following reason: ' + status);
Thats it. You now have the possibility to do all kinds of stuff with these additional information. E.g. display all your customer locations on the map.
Use the GoogleMaps API Reference if you want to show markers. They have great examples and many features available that might come handy.
Otherwise have a look on my example-page here.