NG-지도

Question

난에 geting하고 내가 왜 해달라고

var app = angular.module('app', ['ngMap']); 
 

 
app.controller('ctrl', ['$scope', 'ngMap','$timeout', function($scope, ngMap,$timeout) { 
 
    NgMap.getMap().then(function(map) { 
 
    var center = map.getCenter(); 
 
    google.maps.event.trigger(map, "resize"); 
 
    map.setCenter(center); 
 
    }); 
 
    $timeout(function() { 
 
    NgMap.getMap().then(function(map) { 
 
     google.maps.event.trigger(map, 'resize'); 
 
    }); 
 
    }, 500); 
 
}]);

#ng-map { 
 
    width: 100% !important; 
 
    height: 100% !important; 
 
    position: absolute !important; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app" ng-controller="ctrl"> 
 
    <div map-lazy-load="https://maps.google.com/maps/api/js" id="ng-map" map-lazy-load-params="https://maps.google.com/maps/api/js?key=AIzaSyB4qnR0XX1tetbLUxSSLVWKi_E4WzGi1tk"> 
 
    <ng-map zoom="4"> 
 

 
    </ng-map> 
 
    </div> 
 
</div>

알고 NG 맵을 사용하고 화면의 절반 UI를에 geting하지만 전체 사업부에서 그것을에 geting하고 있지 않다 UI에서 부분적인지도를 표시 이 오류. 제발 도와주세요

Answer 1

첫 번째 것은 당신이 당신의 # ng-map div 안에있는 요소에 그것을 설정해야하는 잘못된 요소에 설정되어 있다고 믿습니다. CSS를 변경하려고 시도하십시오 (또한 사용하지 마십시오!) importants) :

#ng-map ng-map{ 
    width: 100%; 
    height: 100%; 
    position: absolute; 
} 

그 후, 당신은 설정을 시도 할 수 있습니다 :

default-style="false" 

당신의 NG-지도 지침에, 또한 인라인 스타일로 시도, 여기 예제 :

<ng-map zoom="4" default-style="false"> 
</ng-map> 

그리고 plunker : http://plnkr.co/edit/Qh2O0W?p=preview