Administrator
2022-09-14 58d006e05dcf2a20d0ec5367dd03d66a61db6849
提交 | 用户 | 时间
58d006 1 <!DOCTYPE html>
A 2 <html>
3 <head>
4   <meta charset="utf-8">
5   <title>GMaps.js &mdash; Static map with markers</title>
6   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
7   <script src="http://maps.google.com/maps/api/js?sensor=true"></script>
8   <script src="../gmaps.js"></script>
9   <link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css" />
10   <link rel="stylesheet" type="text/css" href="examples.css" />
11   <script>
12     $(document).ready(function(){
13       var url = GMaps.staticMapURL({
14         size: [610, 350],
15         lat: -12.043333,
16         lng: -77.028333,
17         markers: [
18           {lat: -12.043333, lng: -77.028333},
19           {lat: -12.045333, lng: -77.034, size: 'small'},
20           {lat: -12.045633, lng: -77.022, color: 'blue'}
21         ]
22       });
23       $('<img/>').attr('src', url).appendTo('#map');
24     });
25   </script>
26 </head>
27 <body>
28   <h1>GMaps.js &mdash; Static map with markers</h1>
29   <div class="row">
30     <div class="span11">
31       <div id="map"></div>
32     </div>
33     <div class="span6">
34       <p>With GMaps.js, a static map with markers is made this way:</p>
35       <pre>url = GMaps.staticMapURL({
36   size: [610, 350],
37   lat: -12.043333,
38   lng: -77.028333,
39   markers: [
40     {lat: -12.043333, lng: -77.028333},
41     {lat: -12.045333, lng: -77.034, size: 'small'},
42     {lat: -12.045633, lng: -77.022, color: 'blue'}
43   ]
44 });
45
46 $('&lt;img/&gt;').attr('src', url)
47   .appendTo('#map');</pre>
48       <p>If no style attribute (like <strong>color</strong>, <strong>size</strong> or <strong>icon</strong>) is defined for a marker, the last one (or the default) will be used.</p>
49     </div>
50   </div>
51 </body>
52 </html>