API tools faq
paste
Advertisement
Guest User

Styled and Un-Styled

a guest
Mar 6th, 2012
163
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5.67 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <body>
  3. <div class="mymap">
  4.     <div id="map_map1" class="map_large_2"></div>
  5.     <!-- Google Map Includes -->
  6.     <script src="http://maps.googleapis.com/maps/api/js?v=3.6&sensor=true&language=en-us"></script>
  7.     <script src="/site_media/js/google_maps/StyledMarker.js"></script>
  8.  
  9.    
  10.     <script src="/site_media/js/google_maps/keydragzoom_packed.js"></script>
  11.     <!-- Google Map Script -->
  12.     <script type="text/javascript">
  13.         // ######### Maps Method #########
  14.         function map1() {
  15.             var mapOptions = {
  16.                 center                  :   new google.maps.LatLng(22.0, 77.0),
  17.                 zoom                    :   6,
  18.                 mapTypeId               :   google.maps.MapTypeId.ROADMAP,
  19.                 scrollwheel             :   true,
  20.                 mapTypeControl          :   false,
  21.                 panControl              :   false,
  22.                 mapTypeControlOptions   :   { style: google.maps.MapTypeControlStyle.DROPDOWN_MENU },
  23.                 streetViewControl       :   false,
  24.                 zoomControl             :   false,
  25.                 zoomControlOptions      :   { style: google.maps.ZoomControlStyle.SMALL }
  26.             }
  27.             var map = new google.maps.Map(document.getElementById("map_map1"), mapOptions);
  28.            
  29.             var plot = [{'lat': 22.0, 'msg': '"map1_marker"', 'long': 77.0}]
  30.             add_markers_map1(plot,map);
  31.            
  32.             map.enableKeyDragZoom();
  33.         };
  34.        
  35.         // ######### Markers Method #########
  36.         function add_markers_map1(plot, map) {
  37.             var bounds = new google.maps.LatLngBounds();
  38.            
  39.             for (var i = 0; i < plot.length; i++) {
  40.                point = new google.maps.LatLng(plot[i].lat,plot[i].long,true)
  41.                
  42.                StyleIcon = new StyledIcon(StyledIconTypes.MARKER,{color:"ff6666",text:(i+1).toString()});
  43.                var marker = new StyledMarker({styleIcon:StyleIcon,position:point,title:eval(plot[i].msg),map:map});
  44.                
  45.                if (plot[i].event){
  46.                    var event = plot[i].event
  47.                    var args = event.args
  48.                    if(args==undefined)
  49.                        google.maps.event.addListener(marker, event.action, window[event.callback]())
  50.                    else{
  51.                        function callback(v) { return function() { window[event.callback](v) } } // Work-around method for js closure.
  52.                        google.maps.event.addListener(marker, event.action, callback.apply(this,args))
  53.                    }
  54.  
  55.                }
  56.                bounds.extend(point);
  57.                
  58.            }
  59.            if(plot.length>1)
  60.                 map.fitBounds(bounds);
  61.            
  62.         }
  63.        
  64.         // ######### Add to DOM Listener #########
  65.         google.maps.event.addDomListener(window, 'load', map1);
  66.     </script>
  67. </div>
  68.  
  69.  
  70. <br/>
  71. <div class="mymap2">
  72.     <div id="map_map2" class="map_large_2"></div>
  73.     <!-- Google Map Includes -->
  74.  
  75.     <script src="http://maps.googleapis.com/maps/api/js?v=3.6&sensor=true&language=en-us"></script>
  76.    
  77.    
  78.     <script src="/site_media/js/google_maps/keydragzoom_packed.js"></script>
  79.     <!-- Google Map Script -->
  80.     <script type="text/javascript">
  81.         // ######### Maps Method #########
  82.         function map2() {
  83.             var mapOptions = {
  84.                 center                  :   new google.maps.LatLng(22.0, 77.0),
  85.                 zoom                    :   6,
  86.                 mapTypeId               :   google.maps.MapTypeId.ROADMAP,
  87.                 scrollwheel             :   true,
  88.                 mapTypeControl          :   false,
  89.                 panControl              :   false,
  90.                 mapTypeControlOptions   :   { style: google.maps.MapTypeControlStyle.DROPDOWN_MENU },
  91.                 streetViewControl       :   false,
  92.                 zoomControl             :   false,
  93.                 zoomControlOptions      :   { style: google.maps.ZoomControlStyle.SMALL }
  94.             }
  95.             var map = new google.maps.Map(document.getElementById("map_map2"), mapOptions);
  96.            
  97.             var plot = [{'lat': 22.0, 'msg': '"map2_marker"', 'long': 77.0}]
  98.             add_markers_map2(plot,map);
  99.            
  100.             map.enableKeyDragZoom();
  101.         };
  102.        
  103.         // ######### Markers Method #########
  104.         function add_markers_map2(plot, map) {
  105.             var bounds = new google.maps.LatLngBounds();
  106.            
  107.             for (var i = 0; i < plot.length; i++) {
  108.                point = new google.maps.LatLng(plot[i].lat,plot[i].long,true)
  109.                
  110.                var marker = new google.maps.Marker({position:point,title:eval(plot[i].msg),map:map});
  111.                
  112.                if (plot[i].event){
  113.                    var event = plot[i].event
  114.                    var args = event.args
  115.                    if(args==undefined)
  116.                        google.maps.event.addListener(marker, event.action, window[event.callback]())
  117.                    else{
  118.                        function callback(v) { return function() { window[event.callback](v) } } // Work-around method for js closure.
  119.                        google.maps.event.addListener(marker, event.action, callback.apply(this,args))
  120.                    }
  121.  
  122.                }
  123.                bounds.extend(point);
  124.                
  125.            }
  126.            if(plot.length>1)
  127.                 map.fitBounds(bounds);
  128.            
  129.         }
  130.        
  131.         // ######### Add to DOM Listener #########
  132.         google.maps.event.addDomListener(window, 'load', map2);
  133.     </script>
  134. </div>
  135.  
  136.  
  137. </body>
  138. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!