1<!DOCTYPE html> 2<html> 3 <head> 4 <link rel="canonical" href="https://www.coordenadas-gps.com/como-llegar" /> <link href='https://fonts.googleapis.com/css?family=Roboto:300,400,500' rel='stylesheet' type='text/css'> 5 <meta charset="utf-8" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 7 <meta name="description" content="Como llegar - Obtener direcciones de Google Maps entre 2 puntos GPS identificados por sus direcciones o por sus coordenadas GPS. Maps y indicaciones de Google."> 8 <title>Maps - Como llegar</title> 9 <link rel="stylesheet" href="/css/maps.css" type="text/css" /> 10 <link rel="stylesheet" href="/css/bootstrap.css" type="text/css" /> 11 <link rel="stylesheet" href="/css/gps-coordinates.css" type="text/css" /> 12 <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png?v1"> 13 <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> 14 <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> 15 <link rel="manifest" href="/site.webmanifest"> 16 <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#0180f5"> 17 <meta name="msapplication-TileColor" content="#0180f5"> 18 <meta name="theme-color" content="#0180f5"> 19 20
20<script>var loaderUrl = "/images/loader.gif";var appeared = 0;</script>
20 21
21<script> 22if ( window.self !== window.top ) { 23 window.top.location.href=window.location.href; 24} </script>
24 25 <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> 26 <!--[if lt IE 9]> 27
27<script src="/js/html5shiv.js"></script>
27 28
28<script src="/js/respond.min.js"></script>
28 29 <![endif]--> 30 31 <link rel="stylesheet" type="text/css" href="https://js.api.here.com/v3/3.1/mapsjs-ui.css" />
32<script type="text/javascript" src="https://js.api.here.com/v3/3.1/mapsjs-core.js"></script>
vendor: 1 bytes, line 32
32
33<script type="text/javascript" src="https://js.api.here.com/v3/3.1/mapsjs-service.js"></script>
vendor: 1 bytes, line 33
33
34<script type="text/javascript" src="https://js.api.here.com/v3/3.1/mapsjs-ui.js"></script>
vendor: 1 bytes, line 34
34
35<script type="text/javascript" src="https://js.api.here.com/v3/3.1/mapsjs-mapevents.js"></script>
35 36<style type="text/css"> 37.directions li span.arrow { 38 display:inline-block; 39 min-width:28px; 40 min-height:28px; 41 background-position:0px; 42 background-image: url("/images/arrows.png"); 43 position:relative; 44 top:8px; 45} 46.directions li span.depart { 47 background-position:-28px; 48} 49.directions li span.rightUTurn { 50 background-position:-56px; 51} 52.directions li span.leftUTurn { 53 background-position:-84px; 54} 55.directions li span.rightFork { 56 background-position:-112px; 57} 58.directions li span.leftFork { 59 background-position:-140px; 60} 61.directions li span.rightMerge { 62 background-position:-112px; 63} 64.directions li span.leftMerge { 65 background-position:-140px; 66} 67.directions li span.slightRightTurn { 68 background-position:-168px; 69} 70.directions li span.slightLeftTurn{ 71 background-position:-196px; 72} 73.directions li span.rightTurn { 74 background-position:-224px; 75} 76.directions li span.leftTurn{ 77 background-position:-252px; 78} 79.directions li span.sharpRightTurn { 80 background-position:-280px; 81} 82.directions li span.sharpLeftTurn{ 83 background-position:-308px; 84} 85.directions li span.rightRoundaboutExit1 { 86 background-position:-616px; 87} 88.directions li span.rightRoundaboutExit2 { 89 background-position:-644px; 90} 91 92.directions li span.rightRoundaboutExit3 { 93 background-position:-672px; 94} 95 96.directions li span.rightRoundaboutExit4 { 97 background-position:-700px; 98} 99 100.directions li span.rightRoundaboutPass { 101 background-position:-700px; 102} 103 104.directions li span.rightRoundaboutExit5 { 105 background-position:-728px; 106} 107.directions li span.rightRoundaboutExit6 { 108 background-position:-756px; 109} 110.directions li span.rightRoundaboutExit7 { 111 background-position:-784px; 112} 113.directions li span.rightRoundaboutExit8 { 114 background-position:-812px; 115} 116.directions li span.rightRoundaboutExit9 { 117 background-position:-840px; 118} 119.directions li span.rightRoundaboutExit10 { 120 background-position:-868px; 121} 122.directions li span.rightRoundaboutExit11 { 123 background-position:896px; 124} 125.directions li span.rightRoundaboutExit12 { 126 background-position:924px; 127} 128.directions li span.leftRoundaboutExit1 { 129 background-position:-952px; 130} 131.directions li span.leftRoundaboutExit2 { 132 background-position:-980px; 133} 134.directions li span.leftRoundaboutExit3 { 135 background-position:-1008px; 136} 137.directions li span.leftRoundaboutExit4 { 138 background-position:-1036px; 139} 140.directions li span.leftRoundaboutPass { 141 background-position:1036px; 142} 143.directions li span.leftRoundaboutExit5 { 144 background-position:-1064px; 145} 146.directions li span.leftRoundaboutExit6 { 147 background-position:-1092px; 148} 149.directions li span.leftRoundaboutExit7 { 150 background-position:-1120px; 151} 152.directions li span.leftRoundaboutExit8 { 153 background-position:-1148px; 154} 155.directions li span.leftRoundaboutExit9 { 156 background-position:-1176px; 157} 158.directions li span.leftRoundaboutExit10 { 159 background-position:-1204px; 160} 161.directions li span.leftRoundaboutExit11 { 162 background-position:-1232px; 163} 164.directions li span.leftRoundaboutExit12 { 165 background-position:-1260px; 166} 167.directions li span.arrive { 168 background-position:-1288px; 169} 170.directions li span.leftRamp { 171 background-position:-392px; 172} 173.directions li span.rightRamp { 174 background-position:-420px; 175} 176.directions li span.leftExit { 177 background-position:-448px; 178} 179.directions li span.rightExit { 180 background-position:-476px; 181} 182 183.directions li span.ferry { 184 background-position:-1316px; 185</style>
186<script src="/js/786bbbd.js"></script>
186 187 188 <!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 66 bytes, lines 188-189
188 189 <script async src="https://www.googletagmanager.com/gtag/js?id=
189UA-51725820-1
vendor: 14 bytes, lines 189-190
189"></script> 190
190<script> 191
vendor: 140 bytes, lines 191-195
191window.dataLayer = window.dataLayer || []; 192 function gtag(){dataLayer.push(arguments);} 193 gtag('js', new Date()); 194 195 gtag('config', '
195UA-51725820-1
vendor: 32 bytes, lines 195-196
195', { 'anonymize_ip': true }); 196
196</script>
196 197 198 199 </head> 200 <body onload="initialize();"> 201 202 <!-- Wrap all page content here --> 203 <div id="wrap"> 204 205 <!-- Fixed navbar --> 206 <div class="navbar navbar-default navbar-fixed-top" role="navigation"> 207 <div class="container"> 208 <div class="social pull-right"> 209 <div class="twitter pull-right"><a href="https://twitter.com/gpscoord" class="twitter-follow-button" data-show-count="false" data-show-screen-name="false">Follow @gpscoord</a>
209<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
209<a href="https://twitter.com/share" class="twitter-share-button" data-via="gpscoord">Tweet</a>
209<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
209</div> 210 <div id="plus-one" class="pull-right"></div> 211 </div> 212 <div class="navbar-header pull-right"> 213 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 214 <span class="sr-only">Toggle navigation</span> 215 <span class="icon-bar"></span> 216 <span class="icon-bar"></span> 217 <span class="icon-bar"></span> 218 </button> 219 <div id="top_account" class="pull-right"> 220 <p> 221 <a href="/login">login</a> | <a href="/register/">registrarse</a> 222 </p> 223 </div> 224 </div> 225 <div class="clearfix"></div> 226 <div class="collapse navbar-collapse"> 227 <ul class="nav nav-tabs"> 228 <li><a href="/">Inicio</a></li> 229 <li class="active"><a href="/como-llegar">Como llegar</a></li> 230 <li><a href="/sistema-de-coordenadas">Sistema de Coordenadas</a></li> 231 <li><a href="/convertidor-de-coordenadas-gps">Convertidor</a></li> 232 <li><a href="/mapa/paises">PaÃs</a></li> 233 <li><a href="/mapa/estados">Estados</a></li> 234 <li><a href="/mapa-personalizado">Mapa Personalizado</a></li> 235 </ul> 236 </div><!--/.nav-collapse --> 237 </div> 238 </div> 239 240 <!-- Begin page content --> 241 <div class="container"> 242 243 <div class="page-header"> 244 <h1 style="margin-top: 0;">Google Maps - Como llegar</h1> 245 <h3>Origen y Destino</h3> 246 <p> 247 Rellena los campos de origen y destino, haz clic en âObtener Direccionesâ para visualizar la ruta en el mapa entre las dos ubicaciones. Las <strong>direcciones de manejos</strong> aparecen justo debajo del mapa. 248 </p> 249 <p> 250
250<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
250 251 <!-- coordenadas-smartlink-1 --> 252 <ins class="adsbygoogle" 253 style="display:block" 254 data-ad-client="ca-pub-9379737428903517" 255 data-ad-slot="8986341384" 256 data-ad-format="link"></ins> 257
257<script> 258 (adsbygoogle = window.adsbygoogle || []).push({}); 259 </script>
259 260 </p> 261 <p> 262 Tienes la opción de cambiar el modo de transporte para obtener <strong>direcciones de manejo</strong> para ciclistas, en tránsito o peatones. 263 </p> 264 <h3>Herramienta coordenadas GPS</h3> 265 <p> 266 También puedes usar la herramienta de coordenadas GPS para encontrar una ubicación en el mapa a partir de sus coordenadas GPS. Si una dirección concuerda con dichas coordenadas, puedes establecer éste punto como tu punto de partida o destino para tu solicitud de <strong>dirección de manejo</strong>. También puedes hacer clic en el mapa hasta encontrar el lugar que buscas y seleccionarlo. 267 </p> 268 <h3>Ruta con múltiple paradas</h3> 269 <p> 270 Le recomendamos utilizar este <a href="http://www.itilog.com/en" target="_blank" title="route planner">planificador de ruta</a> en caso de que necesite crear y/o guardar itinerarios más complejos. 271 </p> 272 </div> 273 274 <div class="row"> 275 <div id="ad-content" class="col-md-12 pub"> 276
276<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
276 277 <!-- coordenadas-gps-content --> 278 <ins class="adsbygoogle" 279 style="display:block" 280 data-ad-client="ca-pub-9379737428903517" 281 data-ad-slot="4775031384" 282 data-ad-format="auto"></ins> 283
283<script> 284 (adsbygoogle = window.adsbygoogle || []).push({}); 285 </script>
285 286 </div> 287 </div> 288 <div class="row"> 289 <div class="col-md-4"> 290 <form class="form-horizontal" role="form"> 291 <h4>Localizar un punto GPS en el mapa</h4> 292 <div class="form-group"> 293 <label class="col-md-3 control-label" for="latitude">Latitud</label> 294 <div class="col-md-9"> 295 <input id="latitude" class="form-control" type="textbox"> 296 </div> 297 </div> 298 299 <div class="form-group"> 300 <label class="col-md-3 control-label" for="longitude">Longitud</label> 301 <div class="col-md-9"> 302 <input id="longitude" class="form-control" type="textbox"> 303 </div> 304 </div> 305 306 <div class="form-group"> 307 <div class="col-md-offset-3 col-md-4"> 308 <button type="button" class="btn btn-primary" onclick="codeLatLng(1)">Ver en el Mapa</button> 309 </div> 310 </div> 311 312 </form> 313 314 <form class="form-horizontal" role="form"> 315 <h4>Direcciones desde/hasta</h4> 316 <div class="form-group"> 317 <label for="address" class="col-md-3 control-label">Origen</label> 318 <div class="col-md-9"> 319 <input id="address" class="form-control" type="textbox" value="" data-lat="333" data-lng="333"> 320 </div> 321 </div> 322 <div class="form-group"> 323 <label for="address" class="col-md-3 control-label">Destino</label> 324 <div class="col-md-9"> 325 <input id="addressDest" class="form-control" type="textbox" value="" data-lat="333" data-lng="333"> 326 </div> 327 </div> 328 <div class="form-group"> 329 <label class="col-md-3 control-label" for="travelMode">Modo</label> 330 <div class="col-md-9"> 331 <select id="travelMode" class="form-control"> 332 <option>En coche</option> 333 <option>En bicicleta</option> 334 <option>Transporte público</option> 335 <option>A pie</option> 336 </select> 337 </div> 338 </div> 339 340 <div class="form-group"> 341 <label class="col-md-3 control-label" for="unit">Unidad</label> 342 <div class="col-md-9"> 343 <select id="unit" class="form-control"> 344 <option>Kilómetro</option> 345 <option>Milla</option> 346 </select> 347 </div> 348 </div> 349 350 <div class="form-group"> 351 <label class="col-md-3 control-label" for="highways">Autopista</label> 352 <div class="col-md-9"> 353 <select id="highways" class="form-control"> 354 <option>Ok</option> 355 <option>Evitar</option> 356 </select> 357 </div> 358 </div> 359 360 <div class="form-group"> 361 <label class="col-md-3 control-label" for="tolls">Peaje</label> 362 <div class="col-md-9"> 363 <select id="tolls" class="form-control"> 364 <option>Ok</option> 365 <option>Evitar</option> 366 </select> 367 </div> 368 </div> 369 <div class="form-group"> 370 <div class="col-md-offset-3 col-md-4"> 371 <button type="button" class="btn btn-primary" onclick="confirmDirections();">Obtener Direcciones<span id="loader"></span></button> 372 </div> 373 </div> 374 </form> 375 376 </div> 377 <div class="col-md-8"> 378 <div id="map_canvas"><p id="statusinfo" class="bg-orange"><img src="/images/ripple.gif"/>Allow or deny location access to proceed</p></div> 379 380 <div id="directionsPanel"></div>
381 </div> 382 </div> 383 384 <div class="row"> 385 <div class="col-md-12 pub" id="ad-bottom"> 386
386<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
386 387 <ins class="adsbygoogle" 388 style="display:block; text-align:center;" 389 data-ad-layout="in-article" 390 data-ad-format="fluid" 391 data-ad-client="ca-pub-9379737428903517" 392 data-ad-slot="1463842957"></ins> 393
393<script> 394 (adsbygoogle = window.adsbygoogle || []).push({}); 395 </script>
395 396 </div> 397 </div> 398 <div class="row"> 399 <div class="col-md-12"> 400 </div> 401</div> 402 403 404 </div> 405 406 </div> 407 408 <div id="footer"> 409 <div class="container"> 410 <p class="text-muted credit"><small>Copyright © 2026 www.coordenadas-gps.com</small> | <a href="/contacto">Contacto</a> | <a href="/privacy">Privacidad</a> | <a href="/terms">Terms</a></p> 411 </div> 412 </div> 413 414 <!-- Bootstrap core JavaScript 415 ================================================== --> 416 <!-- Placed at the end of the document so the pages load faster --> 417
417<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
417 418
418<script src="/js/bootstrap.min.js"></script>
418 419
419<script src="/js/appear.js"></script>
419 420
420<script> 421 $(document).ready(function() { 422 $("form").keypress(function(e) { 423 if (e.which == 13) { 424 return false; 425 } 426 }); 427 }); 428 </script>
428 429
429<script> 430var origFromPlace = 0, destFromPlace = 0; 431var locationOrigFromPlace; 432var locationDestFromPlace; 433var map; 434var directionsDisplay; 435var input, inputDest; 436var mapLoaded = 0; 437var geoloc = 0; 438var geolocLat = 0; 439var geolocLng = 0; 440var geolocAddr = ""; 441var mapContainer = document.getElementById('map_canvas'), 442 routeInstructionsContainer = document.getElementById('directionsPanel'); 443var platform = new H.service.Platform({ 444 apikey: 'CTpZbjPoVuWEJQhh5c7B7QansW6G1o0JOXAEApFuJ0M' 445 }); 446var pixelRatio = window.devicePixelRatio || 1; 447var defaultLayers = platform.createDefaultLayers({ 448 tileSize: pixelRatio === 1 ? 256 : 512, 449 lg: 'SPA', ppi: pixelRatio === 1 ? undefined : 320 450 }); 451var behavior; 452var ui; 453var bubble; 454var polyline, group; 455 456function initialize() { 457 if(navigator.geolocation) 458 { 459 navigator.geolocation.getCurrentPosition(function(position) { 460 geoloc = 1; 461 geolocLat = position.coords.latitude; 462 geolocLng = position.coords.longitude; 463 $("#statusinfo").removeClass('bg-orange').addClass('bg-green'); 464 $("#statusinfo").html("Geolocation on. Scroll page to load map."); 465 myReverseGeocode(geolocLat, geolocLng, -1); 466 467 }, function() { 468 geoloc = 2; 469 $("#statusinfo").removeClass('bg-orange').addClass('bg-green'); 470 $("#statusinfo").html("Geolocation off. Scroll page to load map"); 471 initializeMap(); 472 }); 473 } 474 else 475 { 476 geoloc = 2; 477 $("#statusinfo").removeClass('bg-orange').addClass('bg-green'); 478 $("#statusinfo").html("Geolocation off. Scroll page to load map"); 479 initializeMap(); 480 } 481} 482 483function initializeMap() { 484 if (mapLoaded==0 && appeared==1 && geoloc!=0) { 485 486 $('#statusinfo').remove(); 487 if(geoloc==1) 488 { 489 map = new H.Map(mapContainer, 490 defaultLayers.vector.normal.map,{ 491 center: {lat:geolocLat, lng:geolocLng}, 492 zoom: 13, 493 pixelRatio: pixelRatio 494 }); 495 496 mapLoaded = 1; 497 } 498 else 499 { 500 map = new H.Map(mapContainer, 501 defaultLayers.vector.normal.map,{ 502 center: {lat:trans.DefaultLat, lng:trans.DefaultLng}, 503 zoom: 13, 504 pixelRatio: pixelRatio 505 }); 506 507 mapLoaded = 1; 508 509 } 510 511 behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map)); 512 ui = H.ui.UI.createDefault(map, defaultLayers); 513 behavior.disable(H.mapevents.Behavior.WHEELZOOM); 514 let mapsettings = ui.getControl('mapsettings'); 515 let menuEntries = mapsettings.getChildren()[1].getChildren(); 516 menuEntries[0].getElement().style.borderBottom = 'none'; 517 for (let i=1; i<menuEntries.length; i++) 518 menuEntries[i].setVisibility(false); 519 if(geoloc==1) 520 { 521 infowindowContentWithButtons(trans.Geolocation, geolocAddr, geolocLat, geolocLng); 522 } 523 else 524 { 525 infowindowContentWithButtons(trans.Address, trans.DefaultAddress, trans.DefaultLat, trans.DefaultLng); 526 } 527 map.addEventListener('tap', 528 codeLatLngfromclick 529 ); 530 } 531} 532 533function myReverseGeocode(latToGeocode, lngToGeocode, intro) 534{ 535 latToGeocode = parseFloat(latToGeocode); 536 lngToGeocode = parseFloat(lngToGeocode); 537 538 if (latToGeocode>=-90 && latToGeocode<=90 && lngToGeocode>=-180 && lngToGeocode<=180) 539 { 540 $.ajax({ 541 type: "GET", 542 url: "https://api.opencagedata.com/geocode/v1/json?q="+latToGeocode+"+"+lngToGeocode+"&key=a08ab980938843789855fc7e05f161d3&no_annotations=1&language="+trans.Locale, 543 dataType: "json", 544 success: function(data){ 545 if (data.status.code==200) 546 { 547 if (data.total_results>=1) 548 { 549 if (intro==-1) 550 { 551 geolocAddr = data.results[0].formatted; 552 } 553 else infowindowContentWithButtons(trans.Address, data.results[0].formatted, latToGeocode, lngToGeocode); 554 } 555 else 556 { 557 if (intro==-1) geolocAddr = trans.NoResolvedAddress; 558 else infowindowContentWithButtons(trans.Address, trans.NoResolvedAddress, latToGeocode, lngToGeocode); 559 } 560 } 561 else 562 { 563 if (intro==-1) geolocAddr = trans.GeocodingError; 564 else infowindowContentWithButtons(trans.Address, trans.InvalidCoordinates, latToGeocode, lngToGeocode); 565 } 566 }, 567 error: function(xhr, err){ 568 if (intro!=-1) infowindowContentWithButtons(trans.Address, trans.InvalidCoordinates, latToGeocode, lngToGeocode); 569 } 570 }).always(function() { if (intro==-1) initializeMap(); }); 571 return false;
572 } 573 else alert(trans.InvalidCoordinatesShort); 574} 575 576function codeLatLng(origin) 577{ 578 var lat = parseFloat(document.getElementById("latitude").value) || 0; 579 var lng = parseFloat(document.getElementById("longitude").value) || 0; 580 if (lat>=-90 && lat<=90 && lng>=-180 && lng<=180) 581 { 582 map.setCenter({lat:lat, lng:lng}); 583 myReverseGeocode(lat, lng, trans.Address); 584 } 585 else alert(trans.InvalidCoordinatesShort); 586} 587 588function codeLatLngfromclick(evt) { 589 var coord = map.screenToGeo(evt.currentPointer.viewportX, evt.currentPointer.viewportY); 590 var lat = coord.lat.toFixed(6); 591 var lng = coord.lng.toFixed(6); 592 map.setCenter({lat:lat, lng:lng}); 593 myReverseGeocode(lat, lng, trans.Address); 594} 595 596function setOrigin(lat, lng) 597{ 598 document.getElementById("address").value=document.getElementById("geocodedAddress").innerHTML; 599 document.getElementById("buttonSet").innerHTML="<strong>This location is your new starting point.</strong>"; 600 $("#address").attr('data-lat',lat.toFixed(6)); 601 $("#address").attr('data-lng',lng.toFixed(6)); 602 origFromPlace = 0; 603} 604 605function setDest(lat, lng) 606{ 607 document.getElementById("addressDest").value=document.getElementById("geocodedAddress").innerHTML; 608 document.getElementById("buttonSet").innerHTML="<strong>This location is your new destination.</strong>"; 609 $("#addressDest").attr('data-lat',lat.toFixed(6)); 610 $("#addressDest").attr('data-lng',lng.toFixed(6)); 611 destFromPlace = 0; 612} 613 614function confirmDirections() { 615 var origin = document.getElementById("address").value; 616 var destination = document.getElementById("addressDest").value; 617 618 if (origin === "" || destination === "") { 619 alert("Origin and destination cannot be empty"); 620 return; 621 } 622 623var confirmation = confirm(origin + " -> " + destination + ". Are you sure?"); 624 if (confirmation) { 625 directions(); 626 } 627 } 628 629function directions() 630{ 631 if (bubble) {bubble.close();} 632 if (polyline) {map.removeObject(polyline);} 633 if (group) {map.removeObject(group);} 634 document.getElementById('directionsPanel').innerHTML = ''; 635 document.getElementById('loader').innerHTML = ' <img src="/images/loader.gif" />'; 636 637 var ori = $('#address').val(); 638 var des = $('#addressDest').val(); 639 var latO, lngO, latD, lngD; 640 var addressLat = $('#address').attr('data-lat'); 641 var addressLng = $('#address').attr('data-lng'); 642 var addressDestLat = $('#addressDest').attr('data-lat'); 643 var addressDestLng = $('#addressDest').attr('data-lng'); 644 645 if (addressLat!=333 && addressLng!=333 && addressDestLat!=333 && addressDestLng!=333) 646 { 647 latO = addressLat; 648 lngO = addressLng; 649 latD = addressDestLat; 650 lngD = addressDestLng; 651 calculateRoute(latO, lngO, latD, lngD); 652 } 653 else if (addressLat!=333 && addressLng!=333) 654 { 655 latO = addressLat; 656 lngO = addressLng; 657 $.ajax({ 658 type: "GET", 659 url: "https://api.opencagedata.com/geocode/v1/json?q="+encodeURIComponent(des)+"&key=a08ab980938843789855fc7e05f161d3&no_annotations=1&language="+trans.Locale, 660 dataType: "json", 661 success: function(data){ 662 if (data.status.code==200) 663 { 664 if (data.total_results>=1) 665 { 666 latD = data.results[0].geometry.lat; 667 lngD = data.results[0].geometry.lng; 668 calculateRoute(latO, lngO, latD, lngD); 669 } 670 else 671 { 672 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 673 document.getElementById('loader').innerHTML = ''; 674 } 675 } 676 else 677 { 678 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 679 document.getElementById('loader').innerHTML = ''; 680 } 681 }, 682 error: function(xhr, err){ 683 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 684 document.getElementById('loader').innerHTML = ''; 685 } 686 }); 687 } 688 else if (addressDestLat!=333 && addressDestLng!=333) 689 { 690 latD = addressDestLat; 691 lngD = addressDestLng; 692 $.ajax({ 693 type: "GET", 694 url: "https://api.opencagedata.com/geocode/v1/json?q="+encodeURIComponent(ori)+"&key=a08ab980938843789855fc7e05f
694161d3&no_annotations=1&language="+trans.Locale, 695 dataType: "json", 696 success: function(data){ 697 if (data.status.code==200) 698 { 699 if (data.total_results>=1) 700 { 701 latO = data.results[0].geometry.lat; 702 lngO = data.results[0].geometry.lng; 703 calculateRoute(latO, lngO, latD, lngD); 704 } 705 else 706 { 707 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 708 document.getElementById('loader').innerHTML = ''; 709 } 710 } 711 else 712 { 713 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 714 document.getElementById('loader').innerHTML = ''; 715 } 716 }, 717 error: function(xhr, err){ 718 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 719 document.getElementById('loader').innerHTML = ''; 720 } 721 }); 722 } 723 else 724 { 725 $.ajax({ 726 type: "GET", 727 url: "https://api.opencagedata.com/geocode/v1/json?q="+encodeURIComponent(ori)+"&key=a08ab980938843789855fc7e05f161d3&no_annotations=1&language="+trans.Locale, 728 dataType: "json", 729 success: function(data){ 730 if (data.status.code==200) 731 { 732 if (data.total_results>=1) 733 { 734 latO = data.results[0].geometry.lat; 735 lngO = data.results[0].geometry.lng; 736 737 $.ajax({ 738 type: "GET", 739 url: "https://api.opencagedata.com/geocode/v1/json?q="+encodeURIComponent(des)+"&key=a08ab980938843789855fc7e05f161d3&no_annotations=1&language="+trans.Locale, 740 dataType: "json", 741 success: function(data){ 742 if (data.status.code==200) 743 { 744 if (data.total_results>=1) 745 { 746 latD = data.results[0].geometry.lat; 747 lngD = data.results[0].geometry.lng; 748 749 calculateRoute(latO, lngO, latD, lngD); 750 751 } 752 else 753 { 754 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 755 document.getElementById('loader').innerHTML = ''; 756 } 757 } 758 else 759 { 760 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 761 document.getElementById('loader').innerHTML = ''; 762 } 763 }, 764 error: function(xhr, err){ 765 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 766 document.getElementById('loader').innerHTML = ''; 767 } 768 }); 769 770 } 771 else 772 { 773 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 774 document.getElementById('loader').innerHTML = ''; 775 } 776 } 777 else 778 { 779 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 780 document.getElementById('loader').innerHTML = ''; 781 } 782 }, 783 error: function(xhr, err){ 784 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 785 document.getElementById('loader').innerHTML = ''; 786 } 787 }); 788 } 789 790} 791 792function calculateRoute(latO, lngO, latD, lngD){ 793 var travelMode = document.getElementById("travelMode").value 794 var unit = document.getElementById("unit").value 795 var highways = document.getElementById("highways").value 796 var tolls = document.getElementById("tolls").value 797 var origin = document.getElementById("address").value; 798 var destination = document.getElementById("addressDest").value; 799 800 if (travelMode==trans.Bicycling) travelMode='balanced;bicycle'; 801 else if (travelMode==trans.Transit) travelMode='fastest;publicTransport'; 802 else if (travelMode==trans.Walking) travelMode='balanced;pedestrian'; 803 else travelMode='fastest;car'; 804 805 if (unit==trans.Mile) unit='imperial'; 806 else unit='metric'; 807 808 if (highways==trans.Avoid) travelMode += ';motorway:-3' 809 810 if (tolls==trans.Avoid) travelMode += ';tollroad:-3' 811 812 var router = platform.getRoutingService(),
813 routeRequestParams = { 814 mode: travelMode, 815 language: trans.Locale, 816 representation: 'display', 817 MetricSystem:unit, 818 routeattributes : 'waypoints,summary,shape,legs', 819 maneuverattributes: 'direction,action', 820 waypoint0: latO +','+ lngO, 821 waypoint1: latD +','+ lngD 822 }; 823 824 825 router.calculateRoute( 826 routeRequestParams, 827 onSuccess, 828 onError 829 ); 830} 831 832function onSuccess(result) { 833 document.getElementById('loader').innerHTML = ''; 834 if (result.response) 835 { 836 var route = result.response.route[0]; 837 838 addRouteShapeToMap(route); 839 addManueversToMap(route); 840 841 addWaypointsToPanel(route.waypoint); 842 addManueversToPanel(route); 843 addSummaryToPanel(route.summary); 844 } 845 else document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 846} 847 848function onError(error) { 849 document.getElementById('directionsPanel').innerHTML = '<p>' + trans.DirectionsError + '</p>'; 850 document.getElementById('loader').innerHTML = ''; 851} 852 853function infowindowContentWithButtons(text1, text2, latres, lngres) 854{ 855 var infoText = '<strong>' + text1 + '</strong> <span id="geocodedAddress">' + text2 + '</span>'; 856 var finalText = '<div id="info_window">' + infoText + '<br/><strong>' + trans.Latitude + '</strong> ' + Math.round(latres*1000000)/1000000 + ' | <strong>' + trans.Longitude + '</strong> ' + Math.round(lngres*1000000)/1000000 + '<br/><br/><span id="buttonSet"><button type="button" class="btn btn-primary" onclick="setOrigin(' + latres +','+ lngres + ')">' + trans.SetOrigin + '</button> <button type="button" class="btn btn-primary" onclick="setDest(' + latres +','+ lngres + ')">' + trans.SetDestination + '</button></span>' + bookmark() + '</div>'; 857 858 openBubble({lat:latres, lng:lngres}, finalText); 859 bookUp(text2, latres, lngres); 860} 861 862function infowindowContentWithoutButtons(text1, text2, latres, lngres) 863{ 864 var infoText = '<strong>' + text1 + '</strong> <span id="geocodedAddress">' + text2 + '</span>'; 865 finalText='<div id="info_window">' + infoText + '<br/><strong>' + trans.Latitude + '</strong> ' + Math.round(latres*1000000)/1000000 + ' | <strong>' + trans.Longitude + '</strong> ' + Math.round(lngres*1000000)/1000000 + bookmark() + '</div>'; 866 openBubble({lat:latres, lng:lngres}, finalText); 867 bookUp(text2, latres, lngres); 868} 869 870/** 871 * Opens/Closes a infobubble 872 * @param {H.geo.Point} position The location on the map. 873 * @param {String} text The contents of the infobubble. 874 */ 875function openBubble(position, text){ 876 if(!bubble){ 877 bubble = new H.ui.InfoBubble( 878 position, 879 // The FO property holds the province name. 880 {content: text}); 881 ui.addBubble(bubble); 882 } else { 883 bubble.setPosition(position); 884 bubble.setContent(text); 885 bubble.open(); 886 } 887} 888 889 890/** 891 * Creates a H.map.Polyline from the shape of the route and adds it to the map. 892 * @param {Object} route A route as received from the H.service.RoutingService 893 */ 894function addRouteShapeToMap(route){ 895 var lineString = new H.geo.LineString(), 896 routeShape = route.shape; 897 898 899 routeShape.forEach(function(point) { 900 var parts = point.split(','); 901 lineString.pushLatLngAlt(parts[0], parts[1]); 902 }); 903 904 polyline = new H.map.Polyline(lineString, { 905 style: { 906 lineWidth: 8, 907 strokeColor: 'rgba(0, 128, 255, 0.7)' 908 }, 909 arrows: { fillColor: 'white', frequency: 3, width: 1.3, length: 1.2 } 910 }); 911 // Add the polyline to the map 912 map.addObject(polyline); 913 // And zoom to its bounding rectangle 914 //map.setViewBounds(polyline.getBounds(), true); 915 map.getViewModel().setLookAtData({ 916 bounds: polyline.getBoundingBox()//getBounds() 917 }); 918} 919 920 921/** 922 * Creates a series of H.map.Marker points from the route and adds them to the map. 923 * @param {Object} route A route as received from the H.service.RoutingService 924 */ 925function addManueversToMap(route){ 926 var svgMarkup = '<svg width="18" height="18" ' + 927 'xmlns="http://www.w3.org/2000/svg">' + 928 '<circle cx="8" cy="8" r="8" ' + 929 'fill="#1b468d" stroke="white" stroke-width="1" />' + 930 '</svg>', 931 dotIcon = new H.map.Icon(svgMarkup, {anchor: {x:8, y:8}}), 932 i, 933 j; 934 935 group = new H.map.Group(); 936 var markers = []; 937 938 // Add a marker for each maneuver 939 for (i = 0; i < route.leg.length; i += 1) { 940 markers[i]=[]; 941 for (j = 0; j < route.leg[i].maneuver.length; j += 1) { 942 // Get the next maneuver. 943 maneuver = route.leg[i].maneuver[j]; 944 // Add a marker to the maneuvers group 945 markers[i][j] = new H.map.Marker({ 946 lat: maneuver.position.latitude, 947 lng: maneuver.position.longitude} , 948 {icon: dotIcon}); 949 markers[i][j].instruction = maneuver.instruction; 950 markers[i][j].addEventListener('pointerenter', function (evt) { 951 openBubble( 952 this.getPosition(), this.instruction); 953 }, false); 954 group.addObject(markers[i][j]); 955 956 } 957 } 958 959 // Add the maneuvers group to the map 960 map.addObject(group); 961} 962 963 964/** 965 * Creates a series of H.map.Marker points from the route and adds them to the map. 966 * @param {Object} route A route as received from the H.service.RoutingService 967 */ 968function addWaypointsToPanel(waypoints){ 969 970 971 972 var nodeH3 = document.createElement('h3'), 973 waypointLabels = [], 974 i; 975 976 977 for (i = 0; i < waypoints.length; i += 1) { 978 waypointLabels.push(waypoints[i].label) 979 } 980 981 nodeH3.textContent = waypointLabels.join(' - '); 982 983 routeInstructionsContainer.innerHTML = ''; 984 routeInstructionsContainer.appendChild(nodeH3); 985} 986 987/** 988 * Creates a series of H.map.Marker points from the route and adds them to the map. 989 * @param {Object} route A route as received from the H.service.RoutingService 990 */ 991function addSummaryToPanel(summary){ 992 var summaryDiv = document.createElement('div'), 993 content = ''; 994 content += '<b>Total distance</b>: ' + summary.distance/1000 + ' km. <br/>'; 995 content += '<b>Travel Time</b>: ' + summary.travelTime.toMMSS() + ' (in current traffic)'; 996 997 998 summaryDiv.style.fontSize = 'small'; 999 summaryDiv.style.marginLeft ='5%'; 1000 summaryDiv.style.marginRight ='5%'; 1001 summaryDiv.innerHTML = content; 1002 routeInstructionsContainer.appendChild(summaryDiv); 1003} 1004 1005/** 1006 * Creates a series of H.map.Marker points from the route and adds them to the map. 1007 * @param {Object} route A route as received from the H.service.RoutingService 1008 */ 1009function addManueversToPanel(route){ 1010 1011 1012 1013 var nodeOL = document.createElement('ol'), 1014 i, 1015 j; 1016 1017 nodeOL.style.fontSize = 'small'; 1018 nodeOL.style.marginLeft ='5%'; 1019 nodeOL.style.marginRight ='5%'; 1020 nodeOL.className = 'directions'; 1021 1022 // Add a marker for each maneuver 1023 for (i = 0; i < route.leg.length; i += 1) { 1024 for (j = 0; j < route.leg[i].maneuver.length; j += 1) { 1025 // Get the next maneuver. 1026 maneuver = route.leg[i].maneuver[j]; 1027 1028 var li = document.createElement('li'), 1029 spanArrow = document.createElement('span'), 1030 spanInstruction = document.createElement('span'); 1031 1032 spanArrow.className = 'arrow ' + maneuver.action; 1033 spanInstruction.innerHTML = maneuver.instruction; 1034 li.appendChild(spanArrow); 1035 li.appendChild(spanInstruction); 1036 1037 nodeOL.appendChild(li); 1038 } 1039 } 1040 1041 routeInstructionsContainer.appendChild(nodeOL); 1042} 1043 1044 1045Number.prototype.toMMSS = function () { 1046 var hours, totalSeconds, minutes, seconds; 1047 totalSeconds=this; 1048 hours = Math.floor(totalSeconds / 3600); 1049 totalSeconds %= 3600; 1050 minutes = Math.floor(totalSeconds / 60); 1051 seconds = totalSeconds % 60; 1052 return hours + ' hours ' + minutes +' minutes '+ seconds + ' seconds.'; 1053} 1054 1055</script>
1055 1056
1057<script> 1058 1059 function bookmark() { 1060 return ""; 1061 } 1062 1063 function bookUp(address, latitude, longitude) { 1064 return false; 1065 } 1066 1067 function simulateClick(latitude, longitude) { 1068 map.setCenter({lat:latitude, lng:longitude}); 1069 myReverseGeocode(latitude, longitude, trans.Address); 1070 } 1071 1072</script>
vendor: 1 bytes, line 1072
1072
1073<script> 1074 $(document).ready(function() { 1075 $("#address").keydown(function(e) { 1076 origFromPlace = 0; 1077 $(this).attr('data-lat',333); 1078 $(this).attr('data-lng',333); 1079 }); 1080 $("#addressDest").keydown(function(e) { 1081 destFromPlace = 0; 1082 $(this).attr('data-lat',333); 1083 $(this).attr('data-lng',333); 1084 }); 1085 $('#addressDest').appear(); 1086 $(document.body).one('appear', '#addressDest', function(e, $affected) { 1087 appeared = 1; 1088 initializeMap(); 1089 }); 1090 }); 1091</script>
1091 1092
1092<script> 1093 $(document).ready(function() { 1094 1095 $('#wrap').on('click', '.favorite', function(e) { 1096 $('#dp_pointbundle_point_submit').trigger('click'); 1097 $(this).replaceWith('<button type="button" class="bookmarked btn btn-primary"><span class="glyphicon glyphicon-star"></span></button>'); 1098 }); 1099 1100 $('#form_wrap').on('submit', 'form', function(e) { 1101 e.preventDefault(); 1102 $.ajax({ 1103 type: $(this).attr('method'), 1104 cache: false, 1105 url: $(this).attr('action'), 1106 data: $(this).serialize(), 1107 dataType: "json", 1108 success: function(data){ 1109 1110 if (data.responseCode==200) {} 1111 else if (data.responseCode==400) alert(data.message); 1112 else alert("ok"); 1113 1114 $.ajax({ 1115 url: "/point/update", 1116 cache: false, 1117 success: function(data2){ 1118 1119 if (data2.responseCode==200) $('#bookmarks_wrap').html(data2.updated); 1120 //else if (data2.responseCode==400) alert(data2.message); 1121 //else alert("ok"); 1122 1123 1124 1125 1126 1127 }, 1128 error: function(xhr, err){ 1129 1130 //alert("This is taking too long. You may have internet connectivity issues or the server is down."); 1131 } 1132 }); 1133 1134 }, 1135 error: function(xhr, err){ 1136 1137 alert("Error. You may have internet connectivity issues or the server is down."); 1138 } 1139 }); 1140 1141 return false; 1142 }); 1143 1144 $('#bookmarks_wrap').on('submit', 'form', function(e) { 1145 e.preventDefault(); 1146 $(this).replaceWith('<img src="/images/loader.gif" style="margin-left: 25px; margin-top: 8px;"/>'); 1147 $.ajax({ 1148 type: $(this).attr('method'), 1149 cache: false, 1150 url: $(this).attr('action'), 1151 data: $(this).serialize(), 1152 dataType: "json", 1153 success: function(data){ 1154 1155 if (data.responseCode==200) {} 1156 else if (data.responseCode==400) alert(data.message); 1157 else alert("ok"); 1158 1159 1160 $.ajax({ 1161 url: "/point/update", 1162 cache: false, 1163 success: function(data2){ 1164 1165 if (data2.responseCode==200) $('#bookmarks_wrap').html(data2.updated); 1166 // else if (data2.responseCode==400) alert(data2.message); 1167 //else alert("Error"); 1168 1169 1170 1171 1172 1173 }, 1174 error: function(xhr, err){ 1175 1176 //alert("Error"); 1177 } 1178 }); 1179 1180 1181 }, 1182 error: function(xhr, err){ 1183 1184 alert("Error. You may have internet connectivity issues or the server is down."); 1185 } 1186 }); 1187 1188 return false; 1189 }); 1190 1191 }); 1192 1193</script>
1193 1194 1195 1196
1196<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"1cea4354198741389cfb2fc6d8065ecc","r":1,"spa":2}' crossorigin="anonymous"></script>
1196 1197</body> 1198</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.