在地图上绘制 AGM 未初始化

如何解决在地图上绘制 AGM 未初始化

我尝试将我的 angular 应用程序与谷歌地图绘图集成在一起。我尝试按照文档进行操作，但遇到问题并且绘图工具未显示在地图上。

我希望能够从地图上进行绘制。我能够从文档中阅读很多内容，但它不起作用：/.

我做错了什么？

我的地图组件：

@Component({
  selector: 'app-map',templateUrl: './map.component.html',styleUrls: ['./map.component.css']
})
export class MapComponent implements OnInit {
  title = 'WGCM';
  lat = 52.237049;
  lng = 18.517532;



  @input() clientList: Array<Client>;
  @Output() klienci : EventEmitter<Client[]> = new EventEmitter<Client[]>();



  constructor(private client: ClientService){}

  ngOnInit(): void {
  }




  onMapReady(map) {
    this.initDrawingManager(map);
  }

  initDrawingManager(map: any) {

    const drawingManager = new google.maps.drawing.DrawingManager({
      drawingMode: google.maps.drawing.OverlayType.MARKER,drawingControl: true,drawingControlOptions: {
        position: google.maps.ControlPosition.TOP_CENTER,drawingModes: [
          google.maps.drawing.OverlayType.MARKER,google.maps.drawing.OverlayType.CIRCLE,google.maps.drawing.OverlayType.polyGON,google.maps.drawing.OverlayType.polyLINE,google.maps.drawing.OverlayType.RECTANGLE,],},markerOptions: {
        icon:
          "https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png",circleOptions: {
        fillColor: "#ffff00",fillOpacity: 1,strokeWeight: 5,clickable: false,editable: true,zIndex: 1,}

    );
    drawingManager.setMap(map);
  }

    }

我的地图.Html

<div class="map" *ngIf="clientList">
  <agm-map class="map" [zoom] = "7" [latitude] ="lat" [longitude] ="lng">
    (mapReady)="onMapReady($event)"
    <ng-container *ngFor= "let place of clientList">
      <agm-marker [latitude]= "place.latitude" [longitude]= "place.longitude"
      [title] ="place.name" [iconUrl] = getUrlMarker(place.segment)>
    <agm-info-window>
      <b>Kod klienta:</b> {{place.clientId}}
      <p><b>Nazwa:</b> {{place.name}}</p>
      <p><b>Miasto:</b> {{place.city}}</p>
      <p><b>Powiat:</b> {{place.province}}</p>
      <p><b>Segment:</b> {{place.segment}}</p>
    </agm-info-window>
    </agm-marker>
    </ng-container>
  </agm-map>
</div>

在应用模块中我有：

AgmCoreModule.forRoot({
      apiKey: 'MyApiCode',libraries: ['places','drawing','geometry']}),