码迷,mamicode.com
首页 > Windows程序 > 详细

初识SFDC创建一个google map(添加了marker小图标上的小框框InfoWindow可变更文字)

时间:2016-06-10 12:15:37      阅读:138      评论:0      收藏:0      [点我收藏+]

标签:

 1 <apex:page >
 2     <head>
 3         <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 4         <script type="text/javascript" src="http://maps.google.cn/maps/api/js?sensor=false"></script>
 5         <script type="text/javascript">
 6             function myLoad() { 
 7 
 8                 var lat = 23.14746;
 9                 var lng = 113.34175376;
10                 
11                     var myLatLng = new google.maps.LatLng(lat, lng);
12                 var myOptions = {
13                     zoom: 15,
14                     center: myLatLng,                    
15                     mapTypeId: google.maps.MapTypeId.ROADMAP
16                 };
17                 var map = new google.maps.Map(document.getElementById("map"), myOptions);
18           
19                 var marker = new google.maps.Marker({
20                       position: myLatLng,
21                       draggable: true
22                   });
23                   marker.setMap(map);
24                   
25                   var win2 = null;
26                   //添加了侦听每次移动都会生成新的win1,但是会重叠覆盖;
27                 google.maps.event.addListener(marker, ‘dragend‘, function() {
28                     var win1 = new google.maps.InfoWindow({
29                             content: "経度:" + marker.position.lat() + " " + "緯度:" + marker.position.lng()
30                       });
31                     win1.open(map, marker);
32                     //每次都关闭上一个就不会有重复了;
33                     if(win2) {
34                         win2.close();
35                     }    //给当前的infoWindow重新命名了;
36                         win2 = win1;
37                 });
38             }
39             window.onload = myLoad;
40         </script>    
41     </head>
42     <body>
43         <style>
44               #map {
45                 width: 500px;
46                 height: 400px;
47                 float: left;
48               }
49           </style>
50           <div id="map"></div>
51     </body>
52 </apex:page>

就是给marker图标添加一个侦听

google.maps.event.addListener(marker, ‘dragend‘, function() 
也可以‘dragstart‘每次移动结束时候关闭上一个
InfoWindow开启一个新的InfoWindow 再调用里面的lat();lng();方法,所以每次都获取新的经纬度;
这两个方法非常重要;
说到重要,还有一件事比较重要,必须用IE才能看到效果;

初识SFDC创建一个google map(添加了marker小图标上的小框框InfoWindow可变更文字)

标签:

原文地址:http://www.cnblogs.com/panxing/p/5573349.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!