2016-12-09 27 views
0

我正在創建與Google地圖API交互的角度2應用。該文件確實說,如果風格不適用,那麼谷歌地圖不會在屏幕上看到。 即使我明確地將CSS類分配給html元素,它也沒有區別。有人可以幫Angular 2使用GoogleMap Api。當HTML呈現時MAP不可見

按照文檔此鏈接

https://angular-maps.com/docs/getting-started.html

.sebm-google-map-container { 
    height: 300px; 
} 

我曾經在我的組件宣佈它可是我只能看到標題,而不是地圖。我也沒有看到開發者工具上的任何錯誤。請參閱我下面的代碼

ShipGeoFinderComponent

@Component({ 
    selector: 'ship-root', 
    templateUrl: '/app/ShipGeoFinder/ShipGeoFinder.html', 
    styles: [` 
    .sebm-google-map-container { 
     height: 400px; 
     width: 400px; 
    } 
    `], 
}) 
export class ShipGeoFinderComponent { 
    title: string = 'My first angular2-google-maps project'; 
    lat: number = 51.678418; 
    lng: number = 7.809007; 
} 

ShipGeoFinder.html

<h1>{{ title }}</h1> 

<!-- this creates a google map on the page with the given lat/lng from --> 
<!-- the component as the initial center of the map: --> 

<sebm-google-map [latitude]="lat" [longitude]="lng"> 
    <sebm-google-map-marker [latitude]="lat" [longitude]="lng"></sebm-google-map-marker> 
</sebm-google-map> 

回答

0

確保您導入的角地圖模塊在app.module.ts

//app.module.ts   
    import { AgmCoreModule } from 'angular2-google-maps/core'; 

    imports: [ 
    AgmCoreModule.forRoot({ 
     apiKey: 'YOUR_KEY_FROM_GOOGLE_CONSOLE' //Ensure Google Maps Javascript API is enabled 
    }) 
    ] 

如果你還沒有做到這一點,應該這樣做。