<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Show/Add multiple markers to Google Maps in asp.net website</title>
</head>
<body>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript" src = "https://maps.googleapis.com/maps/api/js?key=AIzaSyC6v5-2uaq_wusHDktM9ILcqIrlPtnZgEk&sensor=false">
</script>
<script type="text/javascript">
var markers;
var mobilecookievalue;
function hotl(){
document.cookie = "mobileCookie=iphone";
markers = [
{
"lat": 1.278079,
"lng": 103.847848,
},
{
"lat": 1.319451,
"lng": 103.82734,
},
];
initialize() ;
}
function Res(){
document.cookie = "mobileCookie=iphone";
markers = [
{
"lat": 1.319451,
"lng": 103.82734,
},
{
"lat": 1.389377,
"lng": 103.854271,
},
];
initialize() ;
}
function restaurants(){
document.cookie = "mobileCookie=iphone";
markers = [
{
"lat": 1.319451,
"lng": 103.82734,
},
{
"lat": 1.288743,
"lng": 103.805412,
},
{
"lat": 1.299816,
"lng": 103.855924,
},
];
initialize() ;
}
function initialize() {
if (getCookie('mobileCookie') == '') {
// document.cookie = "mobileCookie=";
document.cookie = "mobileCookie=android";
markers = [
{
"lat": 17.3752800,
"lng": 78.4744400,
},
{
"lat": 1.319451,
"lng": 103.82734,
}
];
}
mobilecookievalue = getCookie('mobileCookie');
function getCookie(cookiename) {
var cookiestring = RegExp("" + cookiename + "[^;]+").exec(document.cookie);
return unescape(!!cookiestring ? cookiestring.toString().replace(/^[^=]+/, "").replace("=", "") : "");
}
var a;
var b;
for (i = 0; i < markers.length; i++) {
if(i==0){
a=markers[0].lat;
b=markers[0].lng;
break;
}
}
var mapOptions = {
center: new google.maps.LatLng(a, b),
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP
// marker:true
};
var infoWindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
if(mobilecookievalue!="")
{
for (i = 0; i < markers.length; i++) {
var data = markers[i]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var marker = new google.maps.Marker({
position: myLatlng,
// position1:new google.maps.LatLng(1.319451, 103.82734),
map: map,
title: data.title
});
(function (marker, data) {
// Attaching a click event to the current marker
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent(data.description);
infoWindow.open(map, marker);
});
})(marker, data);
}
}
}
</script>
</head>
<body onload="initialize()">
<form id="form1" runat="server">
<div id="btns">
<input type="button" value="Restaurants" onclick="restaurants()" />
<input type="button" value="Hotels" onclick="hotl()" />
<input type="button" value="Resort" onclick="Res()" />
</div>
<div id="map_canvas" style="width: 100%; height: 600px"> </div>
</form>
</body>
</html>