Javascript Mapbox/floaple.js更改悬停标记的颜色

更新：我发现当我设置geojson时，它正在创建一组新的标记，并立即触发mouseover事件。它无限地循环和破坏它。我把它改为点击，然后它就可以工作了，那么我现在如何使用鼠标悬停来工作呢

我正在将节日加载到右侧的地图上，以用于我的节日索引页面。这与yelp的索引页功能类似。因此，我已成功地将数据作为geoJSON加载到我的markerLayer，但当我设置数据的geoJSON以更改悬停的标记的颜色时，它将禁用“单击”和“鼠标出”事件。有很多方法可以整理这些代码，我也尝试过很多方法，将这些东西从ajax调用中移出，但我似乎无法让它正常工作

为什么这个代码不起作用？我能做些什么让它工作呢？我知道这与我对图层、mapbox和设置geojson缺乏了解有关

我还想知道是否有更好的方法来解决我的问题，比如使用字体真棒和改变字体颜色。欢迎所有反馈

map = L.mapbox.map("index-map", "jbhatab.map-iu8zewt3")
    markerLayer = L.mapbox.markerLayer()
    $.ajax
      dataType: 'text'
      url: 'festivals.json'
      success: (data) ->
        geojson = $.parseJSON(data)
        markerLayer.setGeoJSON(geojson)
        console.log markerLayer

        $(".event-list-item").hover (->
          $(this).addClass "hover"
          console.log $(this).data('festival-id')
        ), ->
          $(this).removeClass "hover"

        markerLayer.on "mouseover", (e) ->
          e.layer.feature.properties['old-color'] = e.layer.feature.properties['marker-color']
          e.layer.feature.properties['marker-color'] = '#000'
          e.layer.openPopup()
          markerLayer.setGeoJSON(geojson)
          console.log e.target
          console.log 'mousover'

        markerLayer.on "mouseout", (e) ->
          console.log 'mouseout'

        markerLayer.on "click", (e) ->
          console.log 'click'
          e.layer.unbindPopup()
          window.open '/festivals/' + e.layer.feature.properties.id

        markerLayer.addTo(map)
        map.fitBounds markerLayer.getBounds()

---

如果要修改悬停时的标记，请使用事件对象的

layer

属性，并使用

setIcon

为该层设置一个新图标：如果

setGeoJSON

函数可能导致这样的循环，则不应使用该函数