Advertisement
Guest User

yolo

a guest
Apr 17th, 2014
68
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5.47 KB | None | 0 0
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2.     <head>
  3.         <title>OpenLayers Map</title>
  4.  
  5.         <!-- The gmaps script -->
  6.         <script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&amp;sensor=false"></script>
  7.         <!-- OpenLayers base script -->
  8.         <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
  9.         <script type="text/javascript">
  10.     //<![CDATA[
  11.  
  12.        var map;
  13.     var mercator = new OpenLayers.Projection("EPSG:900913");
  14.     var geographic = new OpenLayers.Projection("EPSG:4326");
  15.     var directionsService;
  16.     var markers;
  17.     var routes;
  18.     var fromAddress;
  19.     var toAddress;
  20.     var numClicks=0;
  21.  
  22.     var line_style = {
  23.                strokeColor: "#0000EE",
  24.                strokeOpacity: 0.7,
  25.                strokeWidth: 4,
  26.                pointRadius: 6,
  27.                pointerEvents: "visiblePainted"
  28.            };
  29.  
  30.     OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
  31.     defaultHandlerOptions: {
  32.         'single': true,
  33.         'double': false,
  34.         'pixelTolerance': 0,
  35.         'stopSingle': false,
  36.         'stopDouble': false
  37.     },
  38.     initialize: function(options) {
  39.         this.handlerOptions = OpenLayers.Util.extend({}, this.defaultHandlerOptions);
  40.         OpenLayers.Control.prototype.initialize.apply(this, arguments);
  41.         this.handler = new OpenLayers.Handler.Click(this, {'click': this.trigger}, this.handlerOptions);
  42.     },
  43.     trigger: function(e) {
  44.         var lonlat = map.getLonLatFromViewPortPx(e.xy);
  45.         numClicks++;
  46.         lonlat.transform(mercator, geographic);
  47.         getLocationData(lonlat.lon, lonlat.lat);
  48.     }
  49.     });
  50.            
  51.     function addMarker(position, name)
  52.     {
  53.         // Marker:
  54.         var feature = new OpenLayers.Feature(markers, position);
  55.         feature.closeBox = true;
  56.         feature.popupClass = OpenLayers.Popup.FramedCloud;
  57.         feature.data.popupContentHTML = name;
  58.         feature.data.overflow = "auto";
  59.  
  60.         var marker = feature.createMarker();
  61.  
  62.         var markerClick = function (evt) {
  63.                    if (this.popup == null) {
  64.                        this.popup = this.createPopup(this.closeBox);
  65.                        map.addPopup(this.popup);
  66.                        this.popup.show();
  67.                    } else {
  68.                        this.popup.toggle();
  69.                    }
  70.                    currentPopup = this.popup;
  71.                    OpenLayers.Event.stop(evt);
  72.         };
  73.         marker.events.register("mousedown", feature, markerClick);
  74.         markers.addMarker(marker);
  75.     }
  76.  
  77.     function getLocationData(glon, glat)
  78.     {
  79.         geocoder = new google.maps.Geocoder();
  80.         latlng = new google.maps.LatLng(glat, glon, true);
  81.         geocoder.geocode({'latLng': latlng}, function(results, status)
  82.         {
  83.             if (status == google.maps.GeocoderStatus.OK)
  84.             {
  85.                 ///* Obsługa */
  86.                 alert(results[0].formatted_address);
  87.                 if (numClicks==1) {
  88.                     fromAddress = results[0].formatted_address;
  89.                     markers.clearMarkers();
  90.                     addMarker(new OpenLayers.LonLat(glon, glat).transform(geographic, mercator), results[0].formatted_address);
  91.                 }
  92.                 else if (numClicks==2) {
  93.                     /* Marker końcowy */
  94.                     toAddress = results[0].formatted_address;
  95.                     addMarker(new OpenLayers.LonLat(glon, glat).transform(geographic, mercator), results[0].formatted_address);
  96.                     numClicks=0;
  97.                     directionsService.route( {origin: fromAddress,destination: toAddress,travelMode: google.maps.TravelMode.DRIVING},
  98.                     function(response, status){if (status == google.maps.DirectionsStatus.OK){getRoutePolyline(response);}});
  99.                     //
  100.                 } else {
  101.                     numClicks=0;
  102.                 }
  103.                
  104.             }
  105.             else
  106.             {
  107.                 alert('Geocode failure because of ' + status);
  108.             }
  109.         });
  110.     }
  111.    
  112.     function getRoutePolyline(result)
  113.     {
  114.         var pointList = [];
  115.         var vectorLayer=map.getLayersByName("Routes")[0];
  116.         vectorLayer.removeAllFeatures();
  117.         /* Konstrukcja polilinii */
  118.         var i = 0;
  119.         for(i=0;i<result.routes[0].legs[0].steps.length;i++)
  120.         {
  121.             var A = result.routes[0].legs[0].steps[i].end_point.A;
  122.             var k = result.routes[0].legs[0].steps[i].end_point.k;
  123.             var olpoint = new OpenLayers.Geometry.Point(A, k);
  124.             olpoint.transform(geographic, mercator);
  125.             pointList.push(olpoint);
  126.         }
  127.         lineFeature = new OpenLayers.Feature.Vector( new OpenLayers.Geometry.LineString(pointList), null, line_style );
  128.         vectorLayer.addFeatures(lineFeature);
  129.     }
  130.    
  131.     function init()
  132.     {
  133.         var options = {
  134.             projection: mercator,
  135.             displayProjection: geographic,
  136.             units: "m",
  137.             maxResolution: 156543.0339,
  138.             maxExtent: new OpenLayers.Bounds(-20037508.34, -20037508.34,
  139.                                                 20037508.34, 20037508.34)
  140.         };
  141.         map = new OpenLayers.Map('map', options);
  142.         var osm = new OpenLayers.Layer.OSM();
  143.         var gmap = new OpenLayers.Layer.Google("Google", {sphericalMercator:true});
  144.         markers = new OpenLayers.Layer.Markers("points");
  145.         routes = new OpenLayers.Layer.Vector("Routes");
  146.  
  147.         map.addLayers([osm, gmap]);        
  148.         map.addLayer(routes);
  149.         map.addLayer(markers);
  150.  
  151.         directionsService = new google.maps.DirectionsService();
  152.         map.addControl(new OpenLayers.Control.LayerSwitcher());
  153.         map.addControl(new OpenLayers.Control.MousePosition());
  154.  
  155.         map.setCenter(new OpenLayers.LonLat(10.2, 48.9).transform(geographic, mercator), 5);
  156.  
  157.  
  158. // End Marker
  159.         addMarker(new OpenLayers.LonLat(20, 50).transform(geographic, mercator), "Jestem Markerem.");
  160.        
  161.         var click = new OpenLayers.Control.Click();
  162.         map.addControl(click);
  163.         click.activate();
  164.                
  165.    }
  166.  
  167.    
  168.  
  169.     //]]>
  170.         </script>
  171.     </head>
  172.     <body onload="init()">
  173.             <div id="map"></div>
  174.     </body>
  175. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement