seimin
/
itsm-whlg


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
							<!doctype html>
<html ng-app="myapp">
  <head>
<script src="https://code.angularjs.org/1.2.25/angular.js"></script>
<script src="http://maps.google.com/maps/api/js"></script>
<!-- build:js scripts/ng-map.min.js -->
<script src="../app/scripts/app.js"></script>
<script src="../app/scripts/directives/map_controller.js"></script>
<script src="../app/scripts/directives/map.js"></script>
<script src="../app/scripts/directives/marker.js"></script>
<script src="../app/scripts/directives/shape.js"></script>
<script src="../app/scripts/directives/info-window.js"></script>
<script src="../app/scripts/directives/map-lazy-load.js"></script>
<script src="../app/scripts/services/geo_coder.js"></script>
<script src="../app/scripts/services/navigator_geolocation.js"></script>
<script src="../app/scripts/services/attr2_options.js"></script>
<!-- endbuild -->
<script>
var app = app || angular.module('myapp', ['ngMap']);
app.controller('MyCtrl', function($scope, $compile) {
  $scope.stores = {
    foo: { position:[41, -87], items: [1,2,3,4]},
    bar:{ position:[41, -83], items: [5,6,7,8]}
  };
  $scope.showStore = function(evt, id) {
    $scope.store = $scope.stores[id];
    $scope.showInfoWindow.apply(this, [evt, 'foo']);
  };
});  
</script>
  </head>
  <body>

    <div ng-controller="MyCtrl">
      <map center="41,-87" zoom="3">
      
        <info-window id="foo">
          <div ng-non-bindable="">
            Lat/Lng: {{this.getPosition()}}<br/>
            <ul>
              <li ng-repeat='item in store.items'>{{item}}</li>
            </ul>
          </div>
        </info-window>
        
        <marker ng-repeat="(id, store) in stores" id="{{id}}"
          position="{{store.position}}"
          on-click="showStore(event, id)"
        ></marker>
        
        <info-window id="bar">
          <div ng-non-bindable="">
            Lat: {{this.getPosition().lat()}}<br/>
            Lng: {{this.getPosition().lng()}}<br/>
          </div>
        </info-window>

        <marker position="41, -79" on-click="showInfoWindow('bar')" />
      </map>
    </div>
  
  </body>
</html>