Gmaps4rails-如何从地图外部调用信息窗口标记 [英] Gmaps4rails - How to call infowindow marker outside from maps

问题描述

在成功使用之前，我已经使用过gmaps4rails，但是这次我需要我不知道该怎么做.

I have used gmaps4rails before with success but this time i have a need that i cant figure out how to do it.

我让我的生成器在工作并生成我的map_info局部视图，而且，我还可以通过在地图内部单击来从标记中打开每个信息窗口.

I have my builder working and generating my map_info partials, also, i am able to open every infowindow from markers by clicking inside the map.

我需要从列表中调用标记的信息窗口. (例如，div内的onclick事件)

What i need is to call the infowindow of a marker from a list. (onclick event inside a div for instance)

控制器内部的构建器

 @gmaps_markers = Gmaps4rails.build_markers(@partners) do |partner, marker|
   marker.lat    partner.latitude
   marker.lng    partner.longitude
   marker.title  partner.company
   marker.json({:id => partner.id })        
   marker.infowindow render_to_string(partial: 'pages/partials/subscribe/map_info', locals: { partner: partner })
 end

javascript标记+地图生成器

javascript markers + maps generator

handler = Gmaps.build('Google', {
    markers: {
        clusterer: {
            gridSize: 10,
            maxZoom: 15
        }
    }
});
handler.buildMap({
        provider: {
            disableDefaultUI: false
        },
        internal: {
            id: 'gmaps'
        }
    },
    function() {
        markers = handler.addMarkers(#{
            raw @gmaps_markers.to_json
        });
        handler.bounds.extendWith(markers);
        handler.fitMapToBounds();
        handler.getMap().setZoom(8);
        handler.map.centerOn;
    }
);

让我知道您是否需要更多详细信息！ 谢谢

Let me know if you need more details! Thanks

推荐答案

您需要将地图和标记生成js更改为

Change your map and markers generation js to

Gmaps.store = {}

handler = Gmaps.build('Google', {
    markers: {
        clusterer: {
            gridSize: 10,
            maxZoom: 15
        }
    }
});
handler.buildMap({
    provider: {
        disableDefaultUI: false
    },
    internal: {
        id: 'gmaps'
    }
},
function() {
    Gmaps.store.markers = handler.addMarkers(#{
        raw @gmaps_markers.to_json
    });
    handler.bounds.extendWith(Gmaps.store.markers);
    handler.fitMapToBounds();
    handler.getMap().setZoom(8);
    handler.map.centerOn;
});

然后编写js函数

Gmaps.openMarkerInfo = function(id) {
    $.each(Gmaps.store.markers, function() {
        if (this.serviceObject.id == id) {
            var infowindow = this.infowindow;
            infowindow.open(Gmaps.map.map, marker.serviceObject);
        }
    });
}

然后将其添加到列表元素的onclick

Then add it to onclick of your list element

Gmaps.openMarkerInfo(1);

这篇关于Gmaps4rails-如何从地图外部调用信息窗口标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！