UNPKG

ngmap

Version:
60 lines (57 loc) 1.39 kB
<!DOCTYPE html> <html ng-app="myApp"> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <script src="script-tags-for-development.js"></script> <style> div[ng-controller] { position: relative; } #panel { position: absolute; top: 5px; left: 50%; margin-left: -90px; z-index: 5; background-color: #fff; padding: 5px; border: 1px solid #999; } </style> <script> var app = angular.module('myApp', ['ngMap']); app.controller('PolylineRemoveCtrl', function(NgMap) { var vm = this; NgMap.getMap().then(function(map) { vm.map = map; }); vm.addLine = function() { vm.map.shapes.foo.setMap(vm.map); } vm.removeLine = function() { vm.map.shapes.foo.setMap(null); }; }); </script> </head> <body ng-controller="PolylineRemoveCtrl as vm"> <div id="panel"> <input ng-click="vm.removeLine()" type=button value="Remove Line"> <input ng-click="vm.addLine()" type=button value="Restore Line"> </div> <ng-map zoom="3" center="0, -180" map-type-id="TERRAIN"> <shape name="polyline" id="foo" path="[ [37.772323, -122.214897], [21.291982, -157.821856], [-18.142599, 178.431], [-27.46758, 153.027892] ]" geodesic="true" stroke-color="#FF0000" stroke-opacity="1.0" stroke-weight="2"> </shape> </ng-map> </body> </html>