Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
83 lines (74 sloc) 3.04 KB
<!DOCTYPE html>
<html lang="en">
<head>
<title>Melbourne Inner-North Asian Restaurants - Google Maps Categorizable Markers</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
<link href="css/restaurants.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="restaurants-map">
<div class="google-map"></div>
<div class="google-map-legend col-sm-2 hidden-xs">
<h2>Cuisines</h2>
<ul class="google-map-categories">
<li class="google-map-category-chinese" data-location-category="chinese">
<div class="google-map-category-toggle"><span class="glyphicon glyphicon-ok"></span></div>
Chinese
</li>
<li class="google-map-category-indian" data-location-category="indian">
<div class="google-map-category-toggle"><span class="glyphicon glyphicon-ok"></span></div>
Indian
</li>
<li class="google-map-category-japanese" data-location-category="japanese">
<div class="google-map-category-toggle"><span class="glyphicon glyphicon-ok"></span></div>
Japanese
</li>
<li class="google-map-category-korean" data-location-category="korean">
<div class="google-map-category-toggle"><span class="glyphicon glyphicon-ok"></span></div>
Korean
</li>
<li class="google-map-category-sri-lankan" data-location-category="sri-lankan">
<div class="google-map-category-toggle"><span class="glyphicon glyphicon-ok"></span></div>
Sri Lankan
</li>
<li class="google-map-category-thai" data-location-category="thai">
<div class="google-map-category-toggle"><span class="glyphicon glyphicon-ok"></span></div>
Thai
</li>
<li class="google-map-category-vietnamese" data-location-category="vietnamese">
<div class="google-map-category-toggle"><span class="glyphicon glyphicon-ok"></span></div>
Vietnamese
</li>
</ul>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Replace AIzaSyBZWROu2McODk1fFeC1BZsiIcQ6T1yLB5o below with your own API key for Google Maps JavaScript API v3 -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBZWROu2McODk1fFeC1BZsiIcQ6T1yLB5o&amp;sensor=false"></script>
<script src="../../dist/categorizable-map.min.js"></script>
<script src="js/RestaurantMap.js"></script>
<script src="js/restaurants.js"></script>
<script>
$(function() {
var restaurantMap = new RestaurantMap('.google-map', 'img/');
// 'markers' declared in restaurants.js
$.each(markers, function(i, marker) {
restaurantMap.addMarker(
marker.category,
marker.lat,
marker.lng,
marker.object
);
});
restaurantMap.finalize();
});
</script>
</body>
</html>