1

У меня проблема с Google Map.Угловая проблема с рендерингом google-карты JS

На данный момент карта выглядит следующим образом. enter image description here

<ui-gmap-google-map center='map.center' zoom='map.zoom'></ui-gmap-google-map>

var ngApp = angular.module('ngTest', ['ngResource', 'uiGmapgoogle-maps']); 
 
    ngApp.config(
 
     ['uiGmapGoogleMapApiProvider', function (GoogleMapApiProviders) { 
 
     GoogleMapApiProviders.configure({ 
 
      v: '3.17', 
 
      china: true 
 
     }); 
 
     }]);

Что бы проблема. Пожалуйста, помогите, спасибо

+0

Создать демоверсию, которая воспроизводит эту проблему – charlietfl

+0

добавить значение 'map.zoom = 4' и попробовать – ihemant360

+0

установить высоту и ширину для google map? –

ответ

0

Как ответил Angular Google Maps - FAQ на картах, которые частично рендеринга:

Если рендеринг начинается до элементов в полный размер, Google Maps рассчитывает в соответствии с меньшим размером. Это чаще всего происходит со скрытым элементом (например, ng-show). Чтобы исправить это, вместо этого используйте «ng-if», так как это будет ждать для присоединения к DOM до тех пор, пока условие не будет истинным, которое должно быть после того, как все получилось полностью.

Угловые Google Maps - Documentation и Quickstart могут помочь.

Кроме того, это сообщение SO - Showing a google map in angular-ui modal тоже будет полезно.