Question

我有一个默认隐藏的元素（#intanet-element）。当我点击按钮（＃btn-toggle）时，我想让这个元素可见。现在，一切都很好。该元素确实显示，但如果我第一次点击该按钮，则不会显示地图。然后我点击隐藏元素，然后再次显示隐藏元素第二次，现在地图就在这里。

所以，我的问题是，我怎么能保证地图会第一次出现（我必须初始化地图或类似的东西）并且我能以某种方式破坏地图对象吗？并且甚至需要破坏地图对象？

$(document).ready(function(){

  // function for showing the map with markers - gmaps4rails gem
  function showMap(){
    var handler = Gmaps.build('Google');
      handler.buildMap({ internal: {id: 'multi_markers'}}, function(){
        var markers = handler.addMarkers([
          { lat: 43, lng: 3.5},
          { lat: 45, lng: 4},
          { lat: 47, lng: 3.5},
          { lat: 49, lng: 4},
          { lat: 51, lng: 3.5}
        ]);
        handler.bounds.extendWith(markers);
        handler.fitMapToBounds();
      });
  }

  // this will hide the element when document is ready
  $("#hidden-element").hide();
  // if I click on button with ID btn-toggle, element will shows up or hide
  $("#btn-toggle").click(function(){
    if ($('#hidden-element').is(':hidden')){
      // is necesarry to have condition and check if element is hidden or visible?
    } else if ($('#hidden-element').is(':visible')){
      // element is hidden? Show it!
      showMap();
    }


    $("#hidden-element").toggle(1000);

  });
});

Answer 1

所以这不是库的错误。我认为当元素出现时，Gmaps4Rails不知道元素的精确位置。因此，您必须确保元素完全可见，然后显示地图：

$("#hidden-element").toggle(1000).promise().done(function(){
      if ($('#hidden-element').is(':visible')){
        showMap();
      }
});

这基本上意味着地图将在元素完全可见后加载并在屏幕上占据一席之地。

如何在隐藏元素中启动Gmaps

1 个答案: