如何以角度重新加载视图。谷歌地图API

时间:2016-07-25 11:04:05

标签: javascript angularjs google-maps ionic-framework

我的问题是,当我使用谷歌地图加载屏幕时,地图不会显示。第一次刷新后。这是我的错误或我如何防止这种情况?

 p <- ggplot(t, aes(x = v_rate, weight = f)) + geom_histogram() + facet_grid(group ~ member)

标记:

    .controller('LocationsCtrl', function($scope, $http, $timeout) {

      $scope.ini = function() {

      var map;
      var infowindow = new google.maps.InfoWindow();
      function initialize() {

          var mapProp = {
              center: new google.maps.LatLng(52.4550, -3.3833),
              zoom: 7,
              mapTypeId: google.maps.MapTypeId.ROADMAP
          };

          map = new google.maps.Map(document.getElementById("map"), mapProp);

          $.getJSON("https://onepicture.ch/locations.php", function(json1) {

          $.each(json1.stores, function (key, data) {

              var latLng = new google.maps.LatLng(data.lat, data.lng);

              var marker = new google.maps.Marker({
                  position: latLng,
                  title: data.title,
                  map: map
                  // icon: icon,

              });

              var details = "<b>" + data.title + "<b><br> " +data.address + "<br> " + data.city + "<br>";

              bindInfoWindow(marker, map, infowindow, details);

              });

          });

  }

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

  google.maps.event.addDomListener(window, 'load', initialize);


    }
})

1 个答案:

答案 0 :(得分:1)

除父容器外,地图div大小也需要显式指定:

<div id="map"></div>

CSS

#map {
        margin: 0;
        padding: 0;
        height: 100%;
        width: 100%;
    }

Plunker

相关问题