Google Maps API。

Question

我的网站上有一张地图。此地图上有很多带infoWindows的标记。 对于每个infoWindow，我都会使用自定义刀片，如果地图上的标记过多，则页面初始化DOM需要花费大量时间来加载。

我有想法只在标记单击时加载此窗口。

有人可以帮我吗？

Answer 1

试试下面的代码：

function makeInfoWindowEvent(map, infowindow, marker) {
 google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map, marker);
  });
}

Answer 2

为这种情况找到了很好的解决方案。 也许对某人有用。

一劳永逸

var locations = [
                @if(count($trainings) > 0)
                   @foreach($trainingsas $item)
                      @if($item->p_lat && $item->p_lng)
                      {
                        lat: {{$item->p_lat}},
                        lng: {{$item->p_lng}},
                        id: {{ $item->p_id }}
                      },
                      @endif
                   @endforeach
                @endif
            ];

然后，在将所有标记映射到地图上时，为每个标记添加一个侦听器

    google.maps.event.addListener(marker, 'click', function (evt) {
                        var id = marker.get("id");
                        $.ajax({
                            url: "{{ route('getInfoWindow') }}",
                            data:{
                                    id: id
                            },
                            success: function(data) {
                                console.log(data);
                                infoWin.setContent(data);
                                infoWin.open(map, marker);
                            }
                        });

这就是我们所需要的。 在后端，我们用它获得模型并用我们的视图渲染输出！