<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Create Map Sample | Longdo Map</title>
<style type="text/css">
html{
height:100%;
}
body{
margin:0px;
height:100%;
}
#map {
height: 100%;
}
</style>
<script type="text/javascript" src="https://api.longdo.com/map/?key=ba5a26cc196cf7355275b339cead4fa3"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
function init() {
map = new longdo.Map({
placeholder: document.getElementById('map')
});
rerverseGeocoding();
var Marker = new longdo.Marker(
{ lon: 103.0818127412709, lat: 18.035710148664354 },
{ title: '<?php echo $school_name?>', detail: '' }
); // Create Marker Overlay
map.Route.add(Marker);
map.Route.add({ lon: 103.0818127412709, lat: 18.035710148664354 });
map.Route.search();
map.Route.mode(longdo.RouteMode.Cost);
}
function rerverseGeocoding() {
$.ajax({
url: "https://api.longdo.com/map/services/address?",
dataType: "json",
type: "GET",
contentType: "application/json",
data: {
key: "ba5a26cc196cf7355275b339cead4fa3",
lon: 103.08182230755075,
lat: 18.035541542829137
},
success: function (results)
{
console.log(results);
},
error: function (response)
{
console.log(response);
}
});
}
</script>
</head>
<body onload="init();">
<div id="map"></div>
</body>
</html>