leaflet-contextmenu
Version:
A context menu for Leaflet
44 lines (40 loc) • 1.53 kB
HTML
<html ng-app="angulardemo">
<head>
<title>Angular Leaflet Context Menu</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"/>
<link rel="stylesheet" href="../dist/leaflet.contextmenu.css"/>
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="../dist/leaflet.contextmenu.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script src="js/angular-leaflet-directive.min.js"></script>
<script>
var app = angular.module('angulardemo', ['leaflet-directive']);
app.controller('BasicCenterController', ['$scope', function ($scope) {
angular.extend($scope, {
auckland: {
lat: -36.852668,
lng: 174.762675,
zoom: 15
},
defaults: {
map: {
contextmenu: true,
contextmenuWidth: 140,
contextmenuItems: [{
text: 'Show coordinates',
callback: showCoordinates
}]
}
}
});
}]);
function showCoordinates (e) {
alert(e.latlng);
}
</script>
</head>
<body ng-controller="BasicCenterController">
<leaflet lf-center="auckland" defaults="defaults" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%"></leaflet>
</body>
</html>