我正在使用
jquery和Google Maps V3 API动态添加标记到Google地图.单击按钮search_button时,将使用AJAX向服务器发送请求,该请求将返回与结果相对应的LatLng
JSON数组,该数组将用于放置标记.但是在我的
Javascript Conole中,我收到错误：属性< map>：map的值无效.我哪里做错了？这是我的代码：
HTML标头JS：
- <script type="text/javascript">
- function initialize() {
- var latlng = new google.maps.LatLng(42.354183,-71.065063);
- var options = {
- zoom: 15,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP
- };
- var map = new google.maps.Map(document.getElementById("map_canvas"),options);
- }
- </script>
jQuery的
- $(function() {
- $("#search_button").click(function(e){
- e.preventDefault();
- // Place markers on map
- for( i = 0; i < json.length; i++) {
- var latLng = new google.maps.LatLng(json[i].lat,json[i].lng);
- var marker = new google.maps.Marker({
- position: latLng,map: map
- });
- }
- });
- });
- });
解决方法
你应该将你的变量称为map.这就是全部,实际上我建议将所有内容移动到这样的javascript文件中
- $(document).ready(initialize);
- var map;
- function initialize() {
- var latlng = new google.maps.LatLng(42.354183,-71.065063);
- var options = {
- zoom: 15,mapTypeId: google.maps.MapTypeId.ROADMAP
- };
- map = new google.maps.Map($('#map-canvas')[0],options);
- $("#search_button").click(function(e){
- e.preventDefault();
- // Place markers on map
- for( i = 0; i < json.length; i++) {
- var latLng = new google.maps.LatLng(json[i].lat,map: map
- });
- }
- });
- }
