Tôi cần hiển thị một số chú giải công cụ đẹp mắt với hình ảnh và văn bản trên di chuột của dấu bản đồ google.
marker.setTitle - chỉ hoạt động với văn bản nhưng không phải bằng html
Google map api có giải pháp tiêu chuẩn không?
Bạn có thể đề xuất lib tạo chú giải công cụ và làm cho chúng trông đẹp mắt không?Cách thêm chú giải công cụ tùy chỉnh cho điểm đánh dấu trên bản đồ google?
Bạn có thể nghe sự kiện mouseover trên điểm đánh dấu và kích hoạt infoWindow để xuất hiện cùng với sự kiện đó.
Một khi bạn có infowindow, bạn có thể đặt hình ảnh và văn bản trong đó theo cách được hỗ trợ bởi api.
Đây là những gì tôi đã làm trong một dự án nếu bạn muốn có giải pháp DIY.
Bằng cách này bạn thực sự có thể kiểm soát cách "infowindow" xuất hiện và nội dung sẽ chứa. Chúc may mắn.
Nếu bạn xử lý sự kiện di chuột qua điểm đánh dấu bằng cách sử dụng google.maps.event.addListener, tất cả đối tượng sự kiện có chứa lat và dài, do đó bạn không nhận được vị trí x, y của chuột. Điều đó làm cho cách tiếp cận này không thể thực hiện được. – Justin
Tôi không nói bạn có được vị trí chuột từ trình nghe đánh dấu. Nhận nó từ DOM như bạn sẽ làm trong bất kỳ kịch bản khác. – MrUpsidown
Oleg, tại sao bạn bị ràng buộc vào api bản đồ google. Bạn có thể chèn chú giải công cụ tùy chỉnh vào DOM.
Đính kèm trình xử lý sự kiện cho người di chuột, người di chuột và người nghe trên bản đồ (hoặc các phần cụ thể của bản đồ). Mỗi người nghe cũng cung cấp cho bạn một đối số cho bạn các tọa độ chuột.
Sử dụng một phong cách cố định/tuyệt đối về css của tooltip cho đặt nó
khi rê chuột, tiêm các tooltip tại vị trí con trỏ vào DOM trên MouseMove, cập nhật vị trí (trái và trên cùng) khi di chuột ra, xóa chú giải công cụ khỏi DOM.
Gần đây, tôi đã tạo bản đồ này cho đa giác bản đồ google. Bạn có thể sử dụng lại cách tiếp cận của tôi cho bất kỳ phần nào khác của bản đồ của bạn vì hầu như mọi tính năng trên bản đồ google đều hỗ trợ các sự kiện.
liên kết: https://medium.com/@asimmittal/custom-tooltips-for-google-maps-in-pure-javascript-a8004b8e9458
có, nhưng infoWindow khó tùy chỉnh. Nó có thiết kế được xác định trước. InfoBox là proffered cho tôi. –