gpt4 book ai didi

javascript - 更改 Google map 的 RichMarker 光标

转载 作者:行者123 更新时间:2023-11-28 04:04:41 32 4
gpt4 key购买 nike

解释

出于某种原因,当使用 RichMarker 时(所以我可以使用 Font Awesome 的字体),不允许更改光标。正如您在下面看到的,当将鼠标悬停在 Google map 的标记上时,光标会如代码所示发生变化,但 RichMarker 的标记不会发生任何变化。我做错了什么吗?

代码

你也可以在JSFiddle中看到它.

function initialize() {
var myLatLng1 = new google.maps.LatLng(37.773293, -122.469468);
var myLatLng2 = new google.maps.LatLng(37.774548, -122.467054);

var mapOptions = {
zoom: 15,
center: myLatLng1
};

var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

// First Marker
var marker = new RichMarker({
position: myLatLng1,
map: map,
flat:true,
content: '<i class="fa fa-map-marker fa-4x"></i>',
cursor: 'default'
});

// Second Marker
var marker = new google.maps.Marker({
position: myLatLng2,
map: map,
cursor: 'default'
});
}

google.maps.event.addDomListener(window, "load", initialize);
#map-canvas {
width: 500px;
height: 400px;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
</head>
<body>
<div id="map-canvas"></div>

<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script src="https://rawgit.com/googlemaps/js-rich-marker/gh-pages/src/richmarker.js"></script>
</body>
</html>

提前致谢,
路易斯。

最佳答案

根据 Hua Trung 的建议在上面的评论中,我需要更改 richmarker.js .

因为我不希望标记是可拖动的,所以我可以删除它的所有内容。

所以我:

  • 查找设置光标(第 428 行);
  • 删除了第 439 行到第 460 行的所有内容;
  • var cursor = '';(第 438 行)更改为 var cursor = 'pointer';(或您偏好的光标)。

现在如下(来自第427行)

/**
* Sets the cursor.
*
* @param {string} whichCursor What cursor to show.
* @private
*/
RichMarker.prototype.setCursor_ = function(whichCursor) {
if (!this.ready_) {
return;
}

var cursor = 'pointer';

if (this.markerWrapper_.style.cursor != cursor) {
this.markerWrapper_.style.cursor = cursor;
}
};

关于javascript - 更改 Google map 的 RichMarker 光标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43018509/

32 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com