Angular2 - 谷歌地圖-drawingManager undefined

嗨我想在谷歌地圖啓用繪圖工具。但得到錯誤類似如下：Angular2 - 谷歌地圖-drawingManager undefined

VM1935 [email protected]主要=瀏覽器：140遺漏的類型錯誤：無法讀取未定義

import { Component } from '@angular/core'; 
import { Validators, FormGroup, FormArray, FormBuilder } from '@angular/forms'; 
import { Ng2MapComponent } from 'ng2-map'; 

Ng2MapComponent['apiUrl'] = 
    'https://maps.google.com/maps/api/js?libraries=visualization,places'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <ng2-map zoom="14" center="Brampton, Canada"> 
     <marker *ngFor="let pos of positions" 
     (click)="showInfoWindow($event)" 
     [position]="pos"></marker> 
     <info-window id="iw"> 
     lat: [[lat]], lng: [[lng]] 
     </info-window> 
     <drawing-manager 
     [drawingMode]="'marker'" 
     [drawingControl]="true" 
     [drawingControlOptions]="{ 
     position: 2, 
     drawingModes: ['marker', 'circle', 'polygon', 'polyline', 'rectangle'] 
     }" 
     [circleOptions]="{ 
     fillColor: '#ffff00', 
     fillOpacity: 1, 
     strokeWeight: 5, 
     editable: true, 
     zIndex: 1 
     }"></drawing-manager> 
    </ng2-map> 
    <button (click)="showRandomMarkers()">Show Random Markers</button> 
    ` 
}) 
export class AppComponent { 
    positions = []; 

    showRandomMarkers() { 
    let randomLat: number, randomLng: number; 
    this.positions = []; 
    for (let i = 0 ; i < 9; i++) { 
     randomLat = Math.random() * 0.0099 + 43.7250; 
     randomLng = Math.random() * 0.0099 + -79.7699; 
     this.positions.push([randomLat, randomLng]); 
    } 
    } 

    showInfoWindow(marker) { 
    marker.ng2MapComponent.openInfoWindow(
     'iw', // id of InfoWindow 
     marker, // anchor for InfoWindow 
     {  // local variables for InfoWindow 
     lat: marker.getPosition().lat(), 
     lng: marker.getPosition().lng(), 
     } 
    ); 
    } 
}

模塊文件的特性 '的DrawingManager'：

import { NgModule } from '@angular/core'; 
import { RouterModule } from '@angular/router'; 
import { Ng2MapModule } from 'ng2-map'; 

@NgModule({ 
    imports: [ 
    RouterModule.forChild(AlertsRoutes), 
    Ng2MapModule.forRoot({apiUrl: 'https://maps.google.com/maps/api/js?key=mykey'}) 
    ] 
}) 
export class TestModule { }

另外我該如何啓用繪圖管理器？

來源

2017-03-01 Sanjay Kumar N S

從NG2地圖的文件，似乎你需要做標準@NgModule（{進口： Ng2MapModule.forRoot（）}）的東西，並通過該apiUrl。你能否顯示你的模塊文件，以便我可以準備一個完整的響應？ –

只是要清楚，你沒有編程使用DrawingManager的權利？你只是在你的模板中使用它，但是你仍然從ng2-map代碼本身得到這個錯誤。我的理解是否正確？ –

由ng2-map給出的示例[1]將'&libraries=visualization,places,drawing'附加到模塊導入。我找不到有關可用庫的具體文檔，但您可能首先嚐試所有3，然後查看是否可以刪除其中的一部分。

它會改變你的NgModule代碼：

@NgModule({ 
    imports: [ 
    RouterModule.forChild(AlertsRoutes), 
    Ng2MapModule.forRoot({apiUrl: 'https://maps.google.com/maps/api/js?key=mykey&libraries=visualization,places,drawing'}) 
    ] 
})

[1] https://github.com/ng2-ui/ng2-map/blob/0e0bd891623fe4adc6a7ea78e76cf1e36456eb8b/app/main.ts

來源

2017-03-01 11:05:08

您應該也可以移除Ng2MapComponent ['apiUrl'] = 'https://maps.google.com/maps/api/js?libraries=visualization,places'; –

Angular2 - 谷歌地圖-drawingManager undefined

回答

相關問題