Вход Регистрация
Файл: module-assets/admin/gmaps/examples/map_types.html
Строк: 50
<?php
<!DOCTYPE html>
<
html>
<
head>
  <
meta charset="utf-8">
  <
title>GMaps.js &mdashMap Types</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,
        
mapTypeControlOptions: {
          
mapTypeIds : ["hybrid""roadmap""satellite""terrain""osm""cloudmade"]
        }
      });
      
map.addMapType("osm", {
        
getTileUrl: function(coordzoom) {
          return 
"http://tile.openstreetmap.org/" zoom "/" coord."/" coord.".png";
        },
        
tileSize: new google.maps.Size(256256),
        
name"OpenStreetMap",
        
maxZoom18
      
});
      
map.addMapType("cloudmade", {
        
getTileUrl: function(coordzoom) {
          return 
"http://b.tile.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/1/256/" zoom "/" coord."/" coord.".png";
        },
        
tileSize: new google.maps.Size(256256),
        
name"CloudMade",
        
maxZoom18
      
});
      
map.setMapTypeId("osm");
    });
  </
script>
</
head>
<
body>
  <
h1>GMaps.js &mdashMap Types</h1>
  <
div class="row">
    <
div class="span11">
      <
div id="map"></div>
    </
div>
    <
div class="span6">
      <
p>You can define many map types from external map serviceslike OpenStreetMap:</p>
      <
pre>map.addMapType("osm", {
  
getTileUrl: function(coordzoom) {
    return 
"http://tile.openstreetmap.org/" zoom "/" coord."/" coord.".png";
  },
  
tileSize: new google.maps.Size(256256),
  
name"OpenStreetMap",
  
maxZoom18
});</pre>
      <
p>You must define a function called <code>getTileUrl</code>, which returns a tile URL according the coordenates in the map.</p>
    </
div>
  </
div>
</
body>
</
html>
?>
Онлайн: 1
Реклама