Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -5,15 +5,46 @@ import { useGoogleMapsResource } from './useGoogleMapsResource'
const props = defineProps<{
/**
* Configuration options for the heatmap layer visualization.
* @deprecated Google deprecated the Maps JavaScript API `HeatmapLayer` (May 2025) and removed it in v3.65 (May 2026). Consider [deck.gl HeatmapLayer](https://deck.gl/docs/api-reference/aggregation-layers/heatmap-layer) instead.
* @see https://developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayerOptions
*/
options?: Omit<google.maps.visualization.HeatmapLayerOptions, 'map'>
options?: Omit<HeatmapLayerOptions, 'map'>
}>()

const heatmapLayer = useGoogleMapsResource<google.maps.visualization.HeatmapLayer>({
if (import.meta.dev) {
console.warn(
'[nuxt-scripts] <ScriptGoogleMapsHeatmapLayer> is deprecated. '
+ 'Google deprecated the Maps JavaScript API HeatmapLayer (May 2025) and removed it in v3.65 (May 2026). '
+ 'Consider deck.gl HeatmapLayer instead: https://deck.gl/docs/api-reference/aggregation-layers/heatmap-layer',
)
}

/**
* Configuration options for the heatmap layer visualization.
*
* The `HeatmapLayer` types were removed from `@types/google.maps` in v3.65 as part of Google's
* deprecation (the runtime feature is still available until May 2026), so we type the surface locally.
* @see https://developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayerOptions
*/
interface HeatmapLayerOptions {
data?: unknown
dissipating?: boolean
gradient?: string[]
map?: google.maps.Map
maxIntensity?: number
opacity?: number
radius?: number
}
interface HeatmapLayer {
setMap: (map: google.maps.Map | null) => void
setOptions: (options: HeatmapLayerOptions) => void
}

const heatmapLayer = useGoogleMapsResource<HeatmapLayer>({
async create({ mapsApi, map }) {
await mapsApi.importLibrary('visualization')
return new mapsApi.visualization.HeatmapLayer({
const Layer = mapsApi.visualization.HeatmapLayer as unknown as new (opts: HeatmapLayerOptions) => HeatmapLayer
return new Layer({
map,
...props.options,
})
Expand Down
Loading