<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Geocoding service</title>
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
#panel {
position: absolute;
top: 5px;
left: 50%;
margin-left: -180px;
z-index: 5;
background-color: #fff;
padding: 5px;
border: 1px solid #999;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var mapOptions = {
zoom: 8,
center: latlng
}
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
}
var address_array =
[
"Shop 3-5, G/F, Po Fung Building, 1-7 Hop Yick Road, Yuen Long ",
"Rm 401, 4/F, Sincere House, 83 Argyle Street, Mong Kok ",
"Shop M001, Long Ping Commercial Complex, Long Ping Estate, Yuen Long ",
"Shop G06, G/F, Spot, 48 Lung Sum Avenue, Shek Wu Hui, Sheung Shui ",
"Unit 3, 2/F, United Success Commercial Centre, 508 Jaffe Road, Causeway
Bay "
];
count = 0
function codeAddress() {
//var address = document.getElementById('address').value;
var address = address_array[count];
if(typeof(address) == 'undefined') {
alert("Map completed.");
clearInterval(intervalID);
return;
}
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
//alert("OVER_QUERY_LIMIT, just press ok to continue :) ");
count--;
} else {
the_index = address.indexOf(',');
if(the_index > 0) {
address_array.push(address.substring(the_index + 1,
address.length));
}
//alert('Geocode was not successful for the following reason: '
+ status);
//var error_messages = $('#messages').html() + status + " --- "
+ address + "<br/>"
//$('#messages').html(error_messages);
}
}
});
count++;
}
google.maps.event.addDomListener(window, 'load', initialize);
$(document).ready(function() {
//var intervalID = window.setInterval(codeAddress(), 1000);
start_map();
});
</script>
<script>
var intervalID;
function start_map() {
intervalID = window.setInterval(function(){codeAddress()}, 1000);
}
</script>
</head>
<body>
<div id="panel">
<!--
<input id="address" type="textbox" value="Sydney, NSW">
<input type="button" value="Geocode" onclick="start_map()">
-->
</div>
<div id="map-canvas" ></div>
<div id="messages" style='font-family:arial;' >The following
addresses cannot be marked: <br/></div>
</body>
</html>
