Вход Регистрация
Файл: module-assets/admin/gmaps/examples/routes_advanced.html
Строк: 68
<?php
<!DOCTYPE html>
<
html>
<
head>
  <
meta charset="utf-8">
  <
title>GMaps.js &mdashRoutes</title>
  <
script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
  <
script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
  <
script type="text/javascript" src="../gmaps.js"></script>
  <
link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css" />
  <
link rel="stylesheet" type="text/css" href="examples.css" />
  <
script type="text/javascript">
    var 
map;
    $(
document).ready(function(){
      
map = new GMaps({
        
el'#map',
        
lat: -12.043333,
        
lng: -77.028333
      
});
      
map.travelRoute({
        
origin: [-12.044012922866312, -77.02470665341184],
        
destination: [-12.090814532191756, -77.02271108990476],
        
travelMode'driving',
        
step: function(e){
          $(
'#instructions').append('<li>'+e.instructions+'</li>');
          $(
'#instructions li:eq('+e.step_number+')').delay(450*e.step_number).fadeIn(200, function(){
            
map.drawPolyline({
              
pathe.path,
              
strokeColor'#131540',
              
strokeOpacity0.6,
              
strokeWeight6
            
});  
          });
        }
      });
    });
  </
script>
</
head>
<
body>
  <
h1>GMaps.js &mdashRoutes</h1>
  <
div class="row">
    <
div class="span11">
      <
div id="map"></div>
      <
ul id="instructions">
      </
ul>
    </
div>
    <
div class="span6">
      <
p>You can travel a routestep by stepthis way:</p>
      <
pre>map.travelRoute({
  
origin: [-12.044012922866312, -77.02470665341184],
  
destination: [-12.090814532191756, -77.02271108990476],
  
travelMode'driving',
  
step: function(e){
    $(
'#instructions').append('&lt;li&gt;'+e.instructions+'&lt;/li&gt;');
    $(
'#instructions li:eq('+e.step_number+')').delay(450*e.step_number).fadeIn(200, function(){
      
map.drawPolyline({
        
pathe.path,
        
strokeColor'#131540',
        
strokeOpacity0.6,
        
strokeWeight6
      
});  
    });
  }
});</
pre>
      <
p>Same as <code>drawRoute</code>, you must define an <strong>origin</strong>, <strong>destination</strong> and <code>travelMode</code>. Alsoyou must define the function that GMaps will call every step in the route.</p>
    </
div>
  </
div>
</
body>
</
html>
?>
Онлайн: 2
Реклама