Skip to content

Latest commit

 

History

History
37 lines (31 loc) · 1.06 KB

File metadata and controls

37 lines (31 loc) · 1.06 KB

MapGroundOverlay

The MapGroundOverlay component wraps the google.maps.GroundOverlay class from the Google Maps JavaScript API. A url and a bounds are required.

Example

// google-maps-demo.component.ts
import {Component} from '@angular/core';
import {GoogleMap, MapGroundOverlay} from '@angular/google-maps';

@Component({
  selector: 'google-map-demo',
  templateUrl: 'google-map-demo.html',
  standalone: true,
  imports: [GoogleMap, MapGroundOverlay],
})
export class GoogleMapDemo {
  center: google.maps.LatLngLiteral = {lat: 24, lng: 12};
  zoom = 4;

  imageUrl = 'https://angular.io/assets/images/logos/angular/angular.svg';
  imageBounds: google.maps.LatLngBoundsLiteral = {
    east: 10,
    north: 10,
    south: -10,
    west: -10,
  };
}
<!-- google-maps-demo.component.html -->
<google-map height="400px" width="750px" [center]="center" [zoom]="zoom">
  <map-ground-overlay [url]="imageUrl" [bounds]="imageBounds" />
</google-map>