Cách ẩn Dấu trang Api của Google Maps bằng jQuery

Xin chào, đây có thể là câu hỏi thực sự ngớ ngẩn nhưng tôi đang cố gắng làm cho các điểm đánh dấu biến mất khi chúng được nhấp. Điểm đánh dấu được đặt chính xác trên bản đồ nhưng khi tôi nhấp vào nó, nó không làm bất cứ điều gì. Tôi đã tự hỏi tại sao nó không hoạt động. Cảm ơn bạn!Cách ẩn Dấu trang Api của Google Maps bằng jQuery

<script type="text/javascript" src="jQuery.js"></script> 
    <script type="text/javascript"> 

    $(document).ready(function(){ 
     var myOptions = { 
     center: new google.maps.LatLng(40.1, -88.2), 
     zoom: 13, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

     var myLatlng = new google.maps.LatLng(40.1, -88.2); 
     var temp_marker = new google.maps.Marker({ 
      position: myLatlng, 
      map: map, 
      title:"Hello World!" 
     }); 

     console.log($(temp_marker)); 
     console.log(temp_marker); 

     //temp_marker.click(function(){$(this).hide();}); 

     $(temp_marker).click(function(){console.log("click is working"); $(this).hide();}); 
      }); 
    </script> 
</head> 
<body> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
</body>

Nguồn

2012-03-07 wayfare

temp_marker là một đối tượng Javascript, không phải là một phần tử DOM. Để đính kèm một người biết lắng nghe để đánh dấu (API sẽ xử lý các chi tiết cụ thể trong đó DOM yếu tố để gắn vào và làm thế nào), bạn nên sử dụng hệ thống các sự kiện riêng của Google Maps API như:

google.maps.event.addListener(marker, 'click', function() { 
    marker.setVisible(false); // maps API hide call 
    });

tài liệu của họ: Google Maps Javascript API v3 - Events

Nguồn

2012-03-07 00:42:44

điều đó có nghĩa là tôi không thể áp dụng jQuery cho hầu hết các đối tượng Google Maps? – wayfare

@wayfare API Maps đặt lớp trừu tượng vào giữa các phần tử DOM mà nó tạo cho các điểm đánh dấu và trình triển khai. Có thể có các thủ thuật để truy cập trực tiếp vào các phần tử DOM, nhưng không có đường dẫn được hỗ trợ. Bất kỳ nỗ lực nào để giải quyết các yếu tố trực tiếp sẽ bị vỡ ngay khi Google Maps thực hiện thay đổi nội bộ; nó cũng có thể không hoạt động trên trình duyệt. –

Nếu bạn thêm tùy chọn được tối ưu hóa: false trong khai báo đánh dấu, bạn có thể truy cập nó bằng jQuery, nhưng API đặt lại tất cả cấu hình thành cấu hình mặc định khi bạn di chuyển bản đồ, phóng to hoặc thu nhỏ, vì điều này, cách tốt nhất là để sử dụng setVisible, vì nó sẽ giữ cấu hình đó. – Corner

là một đối tượng bản đồ google, không phải là phần tử DOM. Jquery hoạt động trên các phần tử DOM.

Nguồn

2012-03-07 00:43:02 charlietfl

Tôi không chắc chắn rằng bạn chỉ có thể ẩn dấu, nhưng lưỡi câu phù hợp với sự kiện click sẽ làm điều gì đó như thế này khi bạn khai báo

google.maps.event.addListener(marker, 'click', function() { 
    // do your hide here 
});

Bạn có thể phải loại bỏ các điểm đánh dấu từ bản đồ thay vì "ẩn" nó.

Bạn đang cố giấu các điểm đánh dấu để làm gì? Bạn có để có thể reshow các điểm đánh dấu? Làm thế nào để bạn có kế hoạch để thực hiện điều này?

Nguồn

2012-03-07 00:48:11

Ben cung cấp cho bạn một nửa câu trả lời. Khi bạn có thể phát hiện sự kiện nhấp chuột điểm đánh dấu, bạn cần phải "ẩn" hoặc xóa điểm đánh dấu khỏi bản đồ. Cách tiêu chuẩn để thực hiện việc này với bản đồ google là thực hiện việc này:

this.setMap(null);

Sau đó bạn có thể hiển thị lại bản đồ bằng cách sử dụng setMap để gán đối tượng bản đồ thay vì null.

Nguồn

2012-03-07 17:28:39

Mở rộng trên ghi chú của Ben, điều này sẽ đi nơi bạn đã tuyên bố đánh dấu của bạn - ví dụ:

var beachMarker = new google.maps.Marker({ 
    position: myLatLng, 
    map: map, 
    icon: image 
}); 
google.maps.event.addListener(beachMarker, 'click', function() { 
    beachMarker.setVisible(false); // maps API hide call 
}); 
}

Nó đưa tôi lứa tuổi cố gắng để con số này ra. Tín dụng lớn cho Ben! Cảm ơn!

Nguồn

2014-05-23 14:10:38

Cách ẩn Dấu trang Api của Google Maps bằng jQuery

Trả lời

Các vấn đề liên quan