From 32a3a756ab83446da3d5dbb5665dc1f1fc435cbc Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@abv.bg>
Date: Wed, 6 May 2026 09:26:39 +0200
Subject: [PATCH] fix(google-maps): deprecate heatmap layer

The APIs that the heatmap layer is based on have been deprecated for about a year and Google Maps will remove them later this month.

These changes turn the `map-heatmap-layer` into a no-op and log an error message so that users know what is happening.
---
 goldens/google-maps/index.api.md              |  21 +--
 src/dev-app/google-map/google-map-demo.html   |  12 --
 src/dev-app/google-map/google-map-demo.ts     |  22 ---
 src/google-maps/map-heatmap-layer/README.md   |  48 -----
 .../map-heatmap-layer.spec.ts                 | 167 ------------------
 .../map-heatmap-layer/map-heatmap-layer.ts    | 167 +++---------------
 .../testing/fake-google-map-utils.ts          |  46 +----
 .../kitchen-sink/kitchen-sink.html            |   8 -
 .../kitchen-sink/kitchen-sink.ts              |   2 -
 9 files changed, 33 insertions(+), 460 deletions(-)
 delete mode 100644 src/google-maps/map-heatmap-layer/README.md
 delete mode 100644 src/google-maps/map-heatmap-layer/map-heatmap-layer.spec.ts

diff --git a/goldens/google-maps/index.api.md b/goldens/google-maps/index.api.md
index dbc87214d31e..a3fbc083cb41 100644
--- a/goldens/google-maps/index.api.md
+++ b/goldens/google-maps/index.api.md
@@ -305,8 +305,8 @@ export class GoogleMapsModule {
     static ɵmod: i0.ɵɵNgModuleDeclaration<GoogleMapsModule, never, [typeof GoogleMap, typeof MapBaseLayer, typeof MapBicyclingLayer, typeof MapCircle, typeof MapDirectionsRenderer, typeof MapGroundOverlay, typeof MapHeatmapLayer, typeof MapInfoWindow, typeof MapKmlLayer, typeof MapMarker, typeof MapAdvancedMarker, typeof DeprecatedMapMarkerClusterer, typeof MapPolygon, typeof MapPolyline, typeof MapRectangle, typeof MapTrafficLayer, typeof MapTransitLayer, typeof MapMarkerClusterer], [typeof GoogleMap, typeof MapBaseLayer, typeof MapBicyclingLayer, typeof MapCircle, typeof MapDirectionsRenderer, typeof MapGroundOverlay, typeof MapHeatmapLayer, typeof MapInfoWindow, typeof MapKmlLayer, typeof MapMarker, typeof MapAdvancedMarker, typeof DeprecatedMapMarkerClusterer, typeof MapPolygon, typeof MapPolyline, typeof MapRectangle, typeof MapTrafficLayer, typeof MapTransitLayer, typeof MapMarkerClusterer]>;
 }
 
-// @public
-export type HeatmapData = google.maps.MVCArray<google.maps.LatLng | google.maps.visualization.WeightedLocation | google.maps.LatLngLiteral> | (google.maps.LatLng | google.maps.visualization.WeightedLocation | google.maps.LatLngLiteral)[];
+// @public @deprecated
+export type HeatmapData = any;
 
 // @public
 export class MapAdvancedMarker implements OnInit, OnChanges, OnDestroy, MapAnchorPoint, MarkerDirective {
@@ -532,19 +532,14 @@ export class MapGroundOverlay implements OnInit, OnDestroy {
     static ɵfac: i0.ɵɵFactoryDeclaration<MapGroundOverlay, never>;
 }
 
-// @public
-export class MapHeatmapLayer implements OnInit, OnChanges, OnDestroy {
+// @public @deprecated
+export class MapHeatmapLayer {
+    constructor();
     set data(data: HeatmapData);
     getData(): HeatmapData;
-    heatmap?: google.maps.visualization.HeatmapLayer;
-    readonly heatmapInitialized: EventEmitter<google.maps.visualization.HeatmapLayer>;
-    // (undocumented)
-    ngOnChanges(changes: SimpleChanges<this>): void;
-    // (undocumented)
-    ngOnDestroy(): void;
-    // (undocumented)
-    ngOnInit(): void;
-    set options(options: Partial<google.maps.visualization.HeatmapLayerOptions>);
+    heatmap?: any;
+    readonly heatmapInitialized: EventEmitter<any>;
+    set options(options: any);
     // (undocumented)
     static ɵdir: i0.ɵɵDirectiveDeclaration<MapHeatmapLayer, "map-heatmap-layer", ["mapHeatmapLayer"], { "data": { "alias": "data"; "required": false; }; "options": { "alias": "options"; "required": false; }; }, { "heatmapInitialized": "heatmapInitialized"; }, never, never, true, never>;
     // (undocumented)
diff --git a/src/dev-app/google-map/google-map-demo.html b/src/dev-app/google-map/google-map-demo.html
index 9d4b75dd5a20..b65b0d96ea41 100644
--- a/src/dev-app/google-map/google-map-demo.html
+++ b/src/dev-app/google-map/google-map-demo.html
@@ -72,11 +72,6 @@
       @if (directionsResult) {
         <map-directions-renderer [directions]="directionsResult"></map-directions-renderer>
       }
-      @if (isHeatmapDisplayed) {
-        <map-heatmap-layer
-          [data]="heatmapData"
-          [options]="heatmapOptions"></map-heatmap-layer>
-      }
     </google-map>
 
     <p><label>Latitude:</label> {{display?.lat}}</p>
@@ -206,13 +201,6 @@
       </label>
     </div>
 
-    <div>
-      <label for="heatmap-layer-checkbox">
-        Toggle Heatmap Layer
-        <input type="checkbox" (click)="toggleHeatmapLayerDisplay()">
-      </label>
-    </div>
-
     <div>
       <label>
         Toggle Advanced Marker with custom content
diff --git a/src/dev-app/google-map/google-map-demo.ts b/src/dev-app/google-map/google-map-demo.ts
index e10292504770..a56f6fe8cc86 100644
--- a/src/dev-app/google-map/google-map-demo.ts
+++ b/src/dev-app/google-map/google-map-demo.ts
@@ -24,7 +24,6 @@ import {
   MapDirectionsRenderer,
   MapDirectionsService,
   MapGroundOverlay,
-  MapHeatmapLayer,
   MapInfoWindow,
   MapKmlLayer,
   MapPolygon,
@@ -73,7 +72,6 @@ let apiLoadingPromise: Promise<unknown> | null = null;
     MapCircle,
     MapDirectionsRenderer,
     MapGroundOverlay,
-    MapHeatmapLayer,
     MapInfoWindow,
     MapKmlLayer,
     MapMarkerClusterer,
@@ -108,10 +106,6 @@ export class GoogleMapDemo {
     strokeOpacity: 0.8,
   };
 
-  heatmapData = this._getHeatmapData(5, 1);
-  heatmapOptions = {radius: 50};
-  isHeatmapDisplayed = false;
-
   isPolygonDisplayed = false;
   polygonOptions: google.maps.PolygonOptions = {
     paths: POLYGON_PATH,
@@ -234,22 +228,6 @@ export class GoogleMapDemo {
     }
   }
 
-  toggleHeatmapLayerDisplay() {
-    this.isHeatmapDisplayed = !this.isHeatmapDisplayed;
-  }
-
-  private _getHeatmapData(offset: number, increment: number) {
-    const result: google.maps.LatLngLiteral[] = [];
-
-    for (let lat = this.center.lat - offset; lat < this.center.lat + offset; lat += increment) {
-      for (let lng = this.center.lng - offset; lng < this.center.lng + offset; lng += increment) {
-        result.push({lat, lng});
-      }
-    }
-
-    return result;
-  }
-
   private _loadApi() {
     if (this.hasLoaded) {
       return;
diff --git a/src/google-maps/map-heatmap-layer/README.md b/src/google-maps/map-heatmap-layer/README.md
deleted file mode 100644
index ba64f2017132..000000000000
--- a/src/google-maps/map-heatmap-layer/README.md
+++ /dev/null
@@ -1,48 +0,0 @@
-# MapHeatmapLayer
-
-The `MapHeatmapLayer` directive wraps the [`google.maps.visualization.HeatmapLayer` class](https://developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayer) from the Google Maps Visualization JavaScript API. It displays
-a heatmap layer on the map when it is a content child of a `GoogleMap` component. Like `GoogleMap`,
-this directive offers an `options` input as well as a convenience input for passing in the `data`
-that is shown on the heatmap.
-
-## Example
-
-```typescript
-// google-map-demo.component.ts
-import {Component} from '@angular/core';
-import {GoogleMap, MapHeatmapLayer} from '@angular/google-maps';
-
-@Component({
-  selector: 'google-map-demo',
-  templateUrl: 'google-map-demo.html',
-  imports: [GoogleMap, MapHeatmapLayer],
-})
-export class GoogleMapDemo {
-  center = {lat: 37.774546, lng: -122.433523};
-  zoom = 12;
-  heatmapOptions = {radius: 5};
-  heatmapData = [
-    {lat: 37.782, lng: -122.447},
-    {lat: 37.782, lng: -122.445},
-    {lat: 37.782, lng: -122.443},
-    {lat: 37.782, lng: -122.441},
-    {lat: 37.782, lng: -122.439},
-    {lat: 37.782, lng: -122.437},
-    {lat: 37.782, lng: -122.435},
-    {lat: 37.785, lng: -122.447},
-    {lat: 37.785, lng: -122.445},
-    {lat: 37.785, lng: -122.443},
-    {lat: 37.785, lng: -122.441},
-    {lat: 37.785, lng: -122.439},
-    {lat: 37.785, lng: -122.437},
-    {lat: 37.785, lng: -122.435}
-  ];
-}
-```
-
-```html
-<!-- google-map-demo.component.html -->
-<google-map height="400px" width="750px" [center]="center" [zoom]="zoom">
-  <map-heatmap-layer [data]="heatmapData" [options]="heatmapOptions" />
-</google-map>
-```
diff --git a/src/google-maps/map-heatmap-layer/map-heatmap-layer.spec.ts b/src/google-maps/map-heatmap-layer/map-heatmap-layer.spec.ts
deleted file mode 100644
index e48449f488ed..000000000000
--- a/src/google-maps/map-heatmap-layer/map-heatmap-layer.spec.ts
+++ /dev/null
@@ -1,167 +0,0 @@
-import {Component, ViewChild, ChangeDetectionStrategy} from '@angular/core';
-import {TestBed} from '@angular/core/testing';
-
-import {DEFAULT_OPTIONS, GoogleMap} from '../google-map/google-map';
-
-import {
-  createHeatmapLayerConstructorSpy,
-  createHeatmapLayerSpy,
-  createLatLngConstructorSpy,
-  createLatLngSpy,
-  createMapConstructorSpy,
-  createMapSpy,
-} from '../testing/fake-google-map-utils';
-import {HeatmapData, MapHeatmapLayer} from './map-heatmap-layer';
-
-describe('MapHeatmapLayer', () => {
-  let mapSpy: jasmine.SpyObj<google.maps.Map>;
-  let latLngSpy: jasmine.SpyObj<google.maps.LatLng>;
-
-  beforeEach(() => {
-    mapSpy = createMapSpy(DEFAULT_OPTIONS);
-    latLngSpy = createLatLngSpy();
-    createMapConstructorSpy(mapSpy);
-    createLatLngConstructorSpy(latLngSpy);
-  });
-
-  afterEach(() => {
-    (window.google as any) = undefined;
-  });
-
-  it('initializes a Google Map heatmap layer', () => {
-    const heatmapSpy = createHeatmapLayerSpy();
-    const heatmapConstructorSpy = createHeatmapLayerConstructorSpy(heatmapSpy);
-
-    const fixture = TestBed.createComponent(TestApp);
-    fixture.detectChanges();
-
-    expect(heatmapConstructorSpy).toHaveBeenCalledWith({
-      data: [],
-      map: mapSpy,
-    });
-  });
-
-  it('should throw if the `visualization` library has not been loaded', () => {
-    createHeatmapLayerConstructorSpy(createHeatmapLayerSpy());
-    delete (window.google.maps as any).visualization;
-
-    expect(() => {
-      const fixture = TestBed.createComponent(TestApp);
-      fixture.detectChanges();
-    }).toThrowError(/Namespace `google.maps.visualization` not found, cannot construct heatmap/);
-  });
-
-  it('sets heatmap inputs', () => {
-    const options: google.maps.visualization.HeatmapLayerOptions = {
-      map: mapSpy,
-      data: [
-        new google.maps.LatLng(37.782, -122.447),
-        new google.maps.LatLng(37.782, -122.445),
-        new google.maps.LatLng(37.782, -122.443),
-      ],
-    };
-    const heatmapSpy = createHeatmapLayerSpy();
-    const heatmapConstructorSpy = createHeatmapLayerConstructorSpy(heatmapSpy);
-
-    const fixture = TestBed.createComponent(TestApp);
-    fixture.componentInstance.data = options.data!;
-    fixture.changeDetectorRef.markForCheck();
-    fixture.detectChanges();
-
-    expect(heatmapConstructorSpy).toHaveBeenCalledWith(options);
-  });
-
-  it('sets heatmap options, ignoring map', () => {
-    const options: Partial<google.maps.visualization.HeatmapLayerOptions> = {
-      radius: 5,
-      dissipating: true,
-    };
-    const data = [
-      new google.maps.LatLng(37.782, -122.447),
-      new google.maps.LatLng(37.782, -122.445),
-      new google.maps.LatLng(37.782, -122.443),
-    ];
-    const heatmapSpy = createHeatmapLayerSpy();
-    const heatmapConstructorSpy = createHeatmapLayerConstructorSpy(heatmapSpy);
-
-    const fixture = TestBed.createComponent(TestApp);
-    fixture.componentInstance.data = data;
-    fixture.componentInstance.options = options;
-    fixture.changeDetectorRef.markForCheck();
-    fixture.detectChanges();
-
-    expect(heatmapConstructorSpy).toHaveBeenCalledWith({...options, map: mapSpy, data});
-  });
-
-  it('exposes methods that provide information about the heatmap', () => {
-    const heatmapSpy = createHeatmapLayerSpy();
-    createHeatmapLayerConstructorSpy(heatmapSpy);
-
-    const fixture = TestBed.createComponent(TestApp);
-    fixture.detectChanges();
-
-    const heatmap = fixture.componentInstance.heatmap;
-
-    heatmapSpy.getData.and.returnValue([] as any);
-    expect(heatmap.getData()).toEqual([]);
-  });
-
-  it('should update the heatmap data when the input changes', () => {
-    const heatmapSpy = createHeatmapLayerSpy();
-    const heatmapConstructorSpy = createHeatmapLayerConstructorSpy(heatmapSpy);
-    let data = [
-      new google.maps.LatLng(1, 2),
-      new google.maps.LatLng(3, 4),
-      new google.maps.LatLng(5, 6),
-    ];
-
-    const fixture = TestBed.createComponent(TestApp);
-    fixture.componentInstance.data = data;
-    fixture.changeDetectorRef.markForCheck();
-    fixture.detectChanges();
-
-    expect(heatmapConstructorSpy).toHaveBeenCalledWith(jasmine.objectContaining({data}));
-    data = [
-      new google.maps.LatLng(7, 8),
-      new google.maps.LatLng(9, 10),
-      new google.maps.LatLng(11, 12),
-    ];
-    fixture.componentInstance.data = data;
-    fixture.changeDetectorRef.markForCheck();
-    fixture.detectChanges();
-
-    expect(heatmapSpy.setData).toHaveBeenCalledWith(data);
-  });
-
-  it('should create a LatLng object if a LatLngLiteral is passed in', () => {
-    const latLngConstructor = createLatLngConstructorSpy(latLngSpy);
-    createHeatmapLayerConstructorSpy(createHeatmapLayerSpy());
-    const fixture = TestBed.createComponent(TestApp);
-    fixture.componentInstance.data = [
-      {lat: 1, lng: 2},
-      {lat: 3, lng: 4},
-    ];
-    fixture.changeDetectorRef.markForCheck();
-    fixture.detectChanges();
-
-    expect(latLngConstructor).toHaveBeenCalledWith(1, 2);
-    expect(latLngConstructor).toHaveBeenCalledWith(3, 4);
-    expect(latLngConstructor).toHaveBeenCalledTimes(2);
-  });
-});
-
-@Component({
-  selector: 'test-app',
-  template: `
-    <google-map>
-      <map-heatmap-layer [data]="data" [options]="options" />
-    </google-map>
-  `,
-  imports: [GoogleMap, MapHeatmapLayer],
-  changeDetection: ChangeDetectionStrategy.Eager,
-})
-class TestApp {
-  @ViewChild(MapHeatmapLayer) heatmap!: MapHeatmapLayer;
-  options!: Partial<google.maps.visualization.HeatmapLayerOptions>;
-  data!: HeatmapData;
-}
diff --git a/src/google-maps/map-heatmap-layer/map-heatmap-layer.ts b/src/google-maps/map-heatmap-layer/map-heatmap-layer.ts
index 201b1acbd8f1..9560913c2917 100644
--- a/src/google-maps/map-heatmap-layer/map-heatmap-layer.ts
+++ b/src/google-maps/map-heatmap-layer/map-heatmap-layer.ts
@@ -6,132 +6,59 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {
-  Input,
-  OnDestroy,
-  OnInit,
-  NgZone,
-  Directive,
-  OnChanges,
-  SimpleChanges,
-  Output,
-  EventEmitter,
-  inject,
-} from '@angular/core';
+import {Input, Directive, Output, EventEmitter} from '@angular/core';
 
-import {GoogleMap} from '../google-map/google-map';
-
-/** Possible data that can be shown on a heatmap layer. */
-export type HeatmapData =
-  | google.maps.MVCArray<
-      google.maps.LatLng | google.maps.visualization.WeightedLocation | google.maps.LatLngLiteral
-    >
-  | (google.maps.LatLng | google.maps.visualization.WeightedLocation | google.maps.LatLngLiteral)[];
+/**
+ * Possible data that can be shown on a heatmap layer.
+ * @deprecated Google Maps no longer supports the heatmap API.
+ * @breaking-change 23.0.0
+ */
+export type HeatmapData = any;
 
 /**
  * Angular directive that renders a Google Maps heatmap via the Google Maps JavaScript API.
  *
  * See: https://developers.google.com/maps/documentation/javascript/reference/visualization
+ *
+ * @deprecated Google Maps no longer supports the heatmap API so this component is now a no-op that will be deleted.
+ * @breaking-change 23.0.0
  */
 @Directive({
   selector: 'map-heatmap-layer',
   exportAs: 'mapHeatmapLayer',
 })
-export class MapHeatmapLayer implements OnInit, OnChanges, OnDestroy {
-  private readonly _googleMap = inject(GoogleMap);
-  private _ngZone = inject(NgZone);
-
+export class MapHeatmapLayer {
   /**
    * Data shown on the heatmap.
    * See: https://developers.google.com/maps/documentation/javascript/reference/visualization
    */
   @Input()
-  set data(data: HeatmapData) {
-    this._data = data;
-  }
-  private _data!: HeatmapData;
+  set data(data: HeatmapData) {}
 
   /**
    * Options used to configure the heatmap. See:
    * developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayerOptions
    */
   @Input()
-  set options(options: Partial<google.maps.visualization.HeatmapLayerOptions>) {
-    this._options = options;
-  }
-  private _options!: Partial<google.maps.visualization.HeatmapLayerOptions>;
+  set options(options: any) {}
 
   /**
    * The underlying google.maps.visualization.HeatmapLayer object.
    *
    * See: https://developers.google.com/maps/documentation/javascript/reference/visualization
    */
-  heatmap?: google.maps.visualization.HeatmapLayer;
+  heatmap?: any;
 
   /** Event emitted when the heatmap is initialized. */
-  @Output() readonly heatmapInitialized: EventEmitter<google.maps.visualization.HeatmapLayer> =
-    new EventEmitter<google.maps.visualization.HeatmapLayer>();
-
-  ngOnInit() {
-    if (this._googleMap._isBrowser) {
-      if (
-        !window.google?.maps?.visualization &&
-        !window.google?.maps.importLibrary &&
-        (typeof ngDevMode === 'undefined' || ngDevMode)
-      ) {
-        throw Error(
-          'Namespace `google.maps.visualization` not found, cannot construct heatmap. ' +
-            'Please install the Google Maps JavaScript API with the "visualization" library: ' +
-            'https://developers.google.com/maps/documentation/javascript/visualization',
-        );
-      }
-
-      if (google.maps.visualization?.HeatmapLayer && this._googleMap.googleMap) {
-        this._initialize(this._googleMap.googleMap, google.maps.visualization.HeatmapLayer);
-      } else {
-        this._ngZone.runOutsideAngular(() => {
-          Promise.all([
-            this._googleMap._resolveMap(),
-            google.maps.importLibrary('visualization'),
-          ]).then(([map, lib]) => {
-            this._initialize(map, (lib as google.maps.VisualizationLibrary).HeatmapLayer);
-          });
-        });
-      }
-    }
-  }
-
-  private _initialize(
-    map: google.maps.Map,
-    heatmapConstructor: typeof google.maps.visualization.HeatmapLayer,
-  ) {
-    // Create the object outside the zone so its events don't trigger change detection.
-    // We'll bring it back in inside the `MapEventManager` only for the events that the
-    // user has subscribed to.
-    this._ngZone.runOutsideAngular(() => {
-      this.heatmap = new heatmapConstructor(this._combineOptions());
-      this._assertInitialized();
-      this.heatmap.setMap(map);
-      this.heatmapInitialized.emit(this.heatmap);
-    });
-  }
-
-  ngOnChanges(changes: SimpleChanges<this>) {
-    const {_data, heatmap} = this;
-
-    if (heatmap) {
-      if (changes['options']) {
-        heatmap.setOptions(this._combineOptions());
-      }
-
-      if (changes['data'] && _data !== undefined) {
-        heatmap.setData(this._normalizeData(_data));
-      }
-    }
-  }
-
-  ngOnDestroy() {
-    this.heatmap?.setMap(null);
+  @Output() readonly heatmapInitialized: EventEmitter<any> = new EventEmitter<any>();
+
+  constructor() {
+    console.error(
+      'As of May 2026, Google Maps no longer supports the heatmap layer APIs. ' +
+        'As a result, the `<map-heatmap-layer>` component is a no-op that will ' +
+        'be removed completely in Angular v23.\nMore information: ' +
+        'https://developers.google.com/maps/deprecations?utm_source=devtools&utm_campaign=stable#heatmap-layer-js-deprecation',
+    );
   }
 
   /**
@@ -139,52 +66,6 @@ export class MapHeatmapLayer implements OnInit, OnChanges, OnDestroy {
    * See: developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayer
    */
   getData(): HeatmapData {
-    this._assertInitialized();
-    return this.heatmap.getData();
-  }
-
-  /** Creates a combined options object using the passed-in options and the individual inputs. */
-  private _combineOptions(): google.maps.visualization.HeatmapLayerOptions {
-    const options = this._options || {};
-    return {
-      ...options,
-      data: this._normalizeData(this._data || options.data || []),
-      map: this._googleMap.googleMap,
-    };
-  }
-
-  /**
-   * Most Google Maps APIs support both `LatLng` objects and `LatLngLiteral`. The latter is more
-   * convenient to write out, because the Google Maps API doesn't have to have been loaded in order
-   * to construct them. The `HeatmapLayer` appears to be an exception that only allows a `LatLng`
-   * object, or it throws a runtime error. Since it's more convenient and we expect that Angular
-   * users will load the API asynchronously, we allow them to pass in a `LatLngLiteral` and we
-   * convert it to a `LatLng` object before passing it off to Google Maps.
-   */
-  private _normalizeData(data: HeatmapData) {
-    const result: (google.maps.LatLng | google.maps.visualization.WeightedLocation)[] = [];
-
-    data.forEach(item => {
-      result.push(isLatLngLiteral(item) ? new google.maps.LatLng(item.lat, item.lng) : item);
-    });
-
-    return result;
+    return null;
   }
-
-  /** Asserts that the heatmap object has been initialized. */
-  private _assertInitialized(): asserts this is {heatmap: google.maps.visualization.HeatmapLayer} {
-    if (typeof ngDevMode === 'undefined' || ngDevMode) {
-      if (!this.heatmap) {
-        throw Error(
-          'Cannot interact with a Google Map HeatmapLayer before it has been ' +
-            'initialized. Please wait for the heatmap to load before trying to interact with it.',
-        );
-      }
-    }
-  }
-}
-
-/** Asserts that an object is a `LatLngLiteral`. */
-function isLatLngLiteral(value: any): value is google.maps.LatLngLiteral {
-  return value && typeof value.lat === 'number' && typeof value.lng === 'number';
 }
diff --git a/src/google-maps/testing/fake-google-map-utils.ts b/src/google-maps/testing/fake-google-map-utils.ts
index 2b9d132f0901..ef7ec9497920 100644
--- a/src/google-maps/testing/fake-google-map-utils.ts
+++ b/src/google-maps/testing/fake-google-map-utils.ts
@@ -34,9 +34,7 @@ export interface TestingWindow extends Window {
       DirectionsRenderer?: jasmine.Spy;
       DirectionsService?: jasmine.Spy;
       LatLng?: jasmine.Spy;
-      visualization?: {
-        HeatmapLayer?: jasmine.Spy;
-      };
+      visualization?: {};
       marker?: {
         AdvancedMarkerElement?: jasmine.Spy;
       };
@@ -753,48 +751,6 @@ export function createDirectionsServiceConstructorSpy(
   return directionsServiceConstructorSpy;
 }
 
-/** Creates a jasmine.SpyObj for a `google.maps.visualization.HeatmapLayer`. */
-export function createHeatmapLayerSpy(): jasmine.SpyObj<google.maps.visualization.HeatmapLayer> {
-  const heatmapLayerSpy = jasmine.createSpyObj('google.maps.visualization.HeatmapLayer', [
-    'setMap',
-    'setOptions',
-    'setData',
-    'getData',
-  ]);
-  return heatmapLayerSpy;
-}
-
-/**
- * Creates a jasmine.Spy to watch for the constructor
- * of a `google.maps.visualization.HeatmapLayer`.
- */
-export function createHeatmapLayerConstructorSpy(
-  heatmapLayerSpy: jasmine.SpyObj<google.maps.visualization.HeatmapLayer>,
-): jasmine.Spy {
-  // The spy target function cannot be an arrow-function as this breaks when created through `new`.
-  const heatmapLayerConstructorSpy = jasmine
-    .createSpy('HeatmapLayer constructor', function () {
-      return heatmapLayerSpy;
-    })
-    .and.callThrough();
-  const testingWindow: TestingWindow = window;
-  if (testingWindow.google && testingWindow.google.maps) {
-    if (!testingWindow.google.maps.visualization) {
-      testingWindow.google.maps.visualization = {};
-    }
-    testingWindow.google.maps.visualization['HeatmapLayer'] = heatmapLayerConstructorSpy;
-  } else {
-    testingWindow.google = {
-      maps: {
-        visualization: {
-          'HeatmapLayer': heatmapLayerConstructorSpy,
-        },
-      },
-    };
-  }
-  return heatmapLayerConstructorSpy;
-}
-
 /** Creates a jasmine.SpyObj for a google.maps.LatLng. */
 export function createLatLngSpy(): jasmine.SpyObj<google.maps.LatLng> {
   return jasmine.createSpyObj('google.maps.LatLng', ['equals', 'lat', 'lng']);
diff --git a/src/universal-app/kitchen-sink/kitchen-sink.html b/src/universal-app/kitchen-sink/kitchen-sink.html
index 7b97a7860eca..fb481eadca92 100644
--- a/src/universal-app/kitchen-sink/kitchen-sink.html
+++ b/src/universal-app/kitchen-sink/kitchen-sink.html
@@ -641,14 +641,6 @@ <h2>Google Map</h2>
   <map-traffic-layer></map-traffic-layer>
   <map-transit-layer></map-transit-layer>
   <map-bicycling-layer></map-bicycling-layer>
-  <map-heatmap-layer
-    [data]="[
-      {lat: 37.782, lng: -122.447},
-      {lat: 37.782, lng: -122.445},
-      {lat: 37.782, lng: -122.443}
-    ]"
-  ></map-heatmap-layer>
-
   <deprecated-map-marker-clusterer
     imagePath="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m"
   >
diff --git a/src/universal-app/kitchen-sink/kitchen-sink.ts b/src/universal-app/kitchen-sink/kitchen-sink.ts
index 5b63d99e7f81..9155ecca9111 100644
--- a/src/universal-app/kitchen-sink/kitchen-sink.ts
+++ b/src/universal-app/kitchen-sink/kitchen-sink.ts
@@ -12,7 +12,6 @@ import {
   MapBicyclingLayer,
   MapCircle,
   MapGroundOverlay,
-  MapHeatmapLayer,
   MapInfoWindow,
   MapKmlLayer,
   MapMarker,
@@ -200,7 +199,6 @@ export class TestEntryComponent {}
     MapBicyclingLayer,
     MapCircle,
     MapGroundOverlay,
-    MapHeatmapLayer,
     MapInfoWindow,
     MapKmlLayer,
     MapMarker,