Мой вопрос заключается в том, как настроить кнопки таким образом, чтобы при касании одной из них меня перенаправляли и центрировали карту по адресу выставления счета, а другую - по адресу доставки.
Это кажется немного легким, но я не могу настроить кнопку, чтобы сфокусировать меня на карте по этому адресу.
<apex:page standardController="Account">
<apex:form >
<apex:pageBlock title="Redireccionar a la Direccion seleccionada" mode="edit">
<apex:commandButton value="Billing Address" onClick=";"/>
</apex:pageBlock>
</apex:form>
<div id="map"></div>
<script type="text/javascript" src="scripts/index.js"></script>
<script async='async'
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCxcLhv-Ih2eBWuEWN0o0sEES9LToCpzz0&callback=geocodeAddress">
</script>
<script>
var locations = [
["{!Account.BillingStreet}","{!Account.BillingCity}", "{!Account.BillingState}","{!Account.BillingCountry}"],
["{!Account.ShippingStreet}","{!Account.ShippingCity}","{!Account.ShippingState}","{!Account.ShippingCountry}"]
];
function geocodeAddress() {
var center = {lat: -34.397,
lng: 150.644};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: center
});
;
let geocoder = new google.maps.Geocoder();
for(let i = 0; i < locations.length; i++){
geocoder.geocode({
'address': locations[i].join()
}, function(results, status) {
if (status === 'OK') {
let marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map,
title: "una dir "+i
});
let infowindow = new google.maps.InfoWindow({
content: locations[i].join()
})
infowindow.setContent(locations[i]);
infowindow.open(map, marker)
} else {
console.log('Geocode was not successful for the following reason: ' + status);
}
});
}
}
</script>
<style>
#map {font-family: Arial;
font-size:12px;
line-height:normal !important;
height:300px;
background:transparent;}
</style>
</apex:page>