关于Rails:当鼠标悬停在地标链接上时,高亮显示Google映射折线

Highlight Google maps polyline when mouseover a placemark link

我试图在网上找到它,但是运气不佳。 Stackoverflow似乎也没有类似的问题解决方案。这是我发现的最接近的比较:

http://groups.google.com/group/google-maps-js-api-v3/browse_thread/thread/2121de2422cf5053?pli=1

但是此人的实时页面看起来并不像他们走的那么远(他们的地图只有他们2010年1月在工作)...但是与我想做的想法相同。我也不知道如何实现给定的解决方案,因为我将有数百条折线,并且不想为每个折线创建一个全局变量...

我想做的是以某种方式"聚类"一个具有一组从该标记开始/结束的折线的地标。然后,我将在侧边栏/菜单外地图中具有指向该地标的链接,并且我希望当用户将鼠标悬停/鼠标悬停于该地标的链接时,与该地标关联的折线会更改其不透明度(即突出显示)。我认为我的问题是:

  • 如何引用已经创建的折线?我如何找出它的句柄?
  • 我可以通过"通过"标记的事实以某种方式更改折线的属性吗? (即aSel.onmouseover("接触此对象的所有多段线的不透明度= 1"))
  • 关于如何修改gmaps4rails.base.js文件的"创建折线"函数来执行此操作的任何建议? https://github.com/apneadiving/Google-Maps-for-Rails/blob/master/app/assets/javascripts/gmaps4rails/gmaps4rails.base.js.coffee
    我有种感觉,然后我的问题就会变成"如何在创建折线时知道链接/地标的处理程序?"如果我尝试这种方法...
  • 我目前正在使用Rails和gmaps4rails插件进行尝试,但是可以接受其他精美的建议/解决方案。

    感谢您的帮助!

    ========================================

    这是我到目前为止尝试过的代码,遵循以下暂停呼吸的建议(我不是Rails,javascript,Coffeescript或Maps专家...):

    在gmaps4rails.base.js中的createSidebar函数中,添加了第二行:

    1
    2
    aSel.onclick = @sidebar_element_handler(currentMap, marker_container.serviceObject, 'click')
    aSel.onmouseover = @sidebar_highlight_paths(currentMap, marker_container.serviceObject)

    然后定义:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    sidebar_highlight_paths : (currentMap, marker) ->
      return () ->
        for polyline in Gmaps.map.polylines
          points = polyline.serviceObject.latLngs.getArray()[0].getArray()
          if (@sidebar_intersect(points, marker.position))
            @polyline.setOptions({strokeOpacity: 1.0})

    sidebar_intersect : (a, b) ->
      [a, b] = [b, a] if a.length > b.length
      value for value in a when value in b

    相交函数基于此处的响应:
    Coffeescript:数组元素匹配另一个数组

    现在,每当我将鼠标悬停在链接上时,我的Chrome javascript控制台中的透明度都不会改变,并且此错误:

    未捕获的TypeError:对象javascript:void(0);没有方法" sidebar_intersect"
    Gmaps4Rails.Gmaps4Rails.sidebar_highlight_pathsgmaps4rails.base.js:434

    资源被解释为图片,但以MIME类型text / html传输:" http://maps.googleapis.com/maps/gen_204?ev=api_viewport


    好吧,想通了-感谢您进行呼吸暂停技巧!为了将来参考(如果这确实对任何人有帮助),我基本上在gmaps4rails.base.js.coffee中将这两行(onmouseover和onmouseout)添加到createSidebar:

    1
    2
    3
    4
    5
    aSel.onclick = @sidebar_element_handler(currentMap,marker_container.serviceObject, 'click')
    aSel.onmouseover = @sidebar_highlight_paths(currentMap,marker_container.serviceObject)
    aSel.onmouseout = @sidebar_reset_paths(currentMap,marker_container.serviceObject)
    li.appendChild(aSel)
    ul.appendChild(li)

    然后:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    sidebar_highlight_paths : (currentMap, marker) ->
    return () ->
      for polyline in Gmaps.map.polylines
         b = polyline.serviceObject.latLngs.getArray()[0].getArray()
         for latlng in b
           if (marker.position.equals(latlng))
             polyline.serviceObject.setOptions({strokeOpacity: 1})

    sidebar_reset_paths : (currentMap, marker) ->
    return () ->
      for polyline in Gmaps.map.polylines
        polyline.serviceObject.setOptions({strokeOpacity: 0.1}