{"id":14605,"library":"googlemaps-v3-utility-library-latest","title":"Google Maps V3 Utility Libraries (Community Fork)","description":"This package is a community-maintained fork of the Google Maps JavaScript API v3 utility libraries, initially updated around 2018. It bundles a collection of client-side JavaScript components such as MarkerClusterer, InfoBox, InfoBubble, KeyDragZoom, and RouteBoxer. These utilities are designed to extend the core functionality of Google Maps v3 by providing enhanced marker management, custom information windows, and map interaction tools. Despite its `latest` moniker, the package's content reflects updates from 2018, making its compatibility with recent Google Maps API versions potentially limited. The current version is 1.0.1, and it does not appear to follow an active release cadence, suggesting it is in a frozen or abandoned state, differing from the potentially more current official Google Maps utility library repositories.","status":"abandoned","version":"1.0.1","language":"javascript","source_language":"en","source_url":"https://github.com/nblavoie/v3-utility-library","tags":["javascript"],"install":[{"cmd":"npm install googlemaps-v3-utility-library-latest","lang":"bash","label":"npm"},{"cmd":"yarn add googlemaps-v3-utility-library-latest","lang":"bash","label":"yarn"},{"cmd":"pnpm add googlemaps-v3-utility-library-latest","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"The `googlemaps-v3-utility-library-latest` package's main entry point directly exports the MarkerClusterer class. It is a default export for ESM purposes, but often consumed via CommonJS `require`.","wrong":"import { MarkerClusterer } from 'googlemaps-v3-utility-library-latest';\n// Or (incorrect path):\nimport MarkerClusterer from 'googlemaps-v3-utility-library-latest/markerclusterer';\n","symbol":"MarkerClusterer","correct":"import MarkerClusterer from 'googlemaps-v3-utility-library-latest';\n// Or for CommonJS:\nconst MarkerClusterer = require('googlemaps-v3-utility-library-latest');"},{"note":"Other utility libraries like InfoBox are located in the `lib` subdirectory and must be imported via their specific path within the package. These are typically default exports for their respective modules.","wrong":"import { InfoBox } from 'googlemaps-v3-utility-library-latest';\n// Or (incorrect path):\nimport InfoBox from 'googlemaps-v3-utility-library-latest/InfoBox';","symbol":"InfoBox","correct":"import InfoBox from 'googlemaps-v3-utility-library-latest/lib/InfoBox';\n// Or for CommonJS:\nconst InfoBox = require('googlemaps-v3-utility-library-latest/lib/InfoBox');"},{"note":"Similar to InfoBox, utilities other than MarkerClusterer are found in the `lib` folder. Always specify the full path to the desired utility module.","wrong":"import { KeyDragZoom } from 'googlemaps-v3-utility-library-latest';","symbol":"KeyDragZoom","correct":"import KeyDragZoom from 'googlemaps-v3-utility-library-latest/lib/KeyDragZoom';\n// Or for CommonJS:\nconst KeyDragZoom = require('googlemaps-v3-utility-library-latest/lib/KeyDragZoom');"}],"quickstart":{"code":"import MarkerClusterer from 'googlemaps-v3-utility-library-latest';\n\nfunction initMap() {\n  const map = new google.maps.Map(document.getElementById('map'), {\n    zoom: 3,\n    center: { lat: -28.024, lng: 140.887 },\n    mapId: 'DEMO_MAP_ID' // Replace with your Map ID\n  });\n\n  const markers = [];\n  // Create some random markers\n  for (let i = 0; i < 100; i++) {\n    const latLng = new google.maps.LatLng(\n      -28.024 + Math.random() * 10,\n      140.887 + Math.random() * 10\n    );\n    markers.push(new google.maps.Marker({\n      position: latLng\n    }));\n  }\n\n  // Add a marker clusterer to the map.\n  new MarkerClusterer(map, markers, {\n    imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'\n  });\n}\n\n// Ensure the global `google` object is available (e.g., via script tag in HTML)\n// For demonstration purposes, if not using a global callback, call directly:\n// This assumes the Google Maps API script is loaded globally and defines `google`\n// For a real application, follow Google's recommended async loading with a callback.\nwindow.addEventListener('DOMContentLoaded', () => {\n  if (typeof google !== 'undefined' && google.maps) {\n    initMap();\n  } else {\n    console.warn('Google Maps API not loaded. Ensure the script tag is present.');\n    // You might want to dynamically load it here or handle the missing global differently\n    const script = document.createElement('script');\n    script.src = `https://maps.googleapis.com/maps/api/js?key=${process.env.GOOGLE_MAPS_API_KEY ?? 'YOUR_API_KEY'}&callback=initMap`;\n    script.async = true;\n    document.head.appendChild(script);\n    window.initMap = initMap; // Attach to window for the callback\n  }\n});\n","lang":"javascript","description":"Demonstrates initializing a Google Map and adding a MarkerClusterer with random markers, using the package's primary export. Includes conditional loading for the Google Maps API."},"warnings":[{"fix":"Review the official Google Maps v3-utility-library for more current alternatives or be prepared to fork and adapt the code for newer API versions. Consider using `@googlemaps/markerclusterer` from the official Google Maps organization for a maintained MarkerClusterer.","message":"This specific `googlemaps-v3-utility-library-latest` package reflects updates from 2018. It may not be fully compatible with newer versions of the Google Maps JavaScript API (e.g., v3.40+ or changes after 2018), potentially leading to unexpected behavior or breakage.","severity":"breaking","affected_versions":">=1.0.1"},{"fix":"Avoid using the deprecated Google Earth API integration. Look for modern alternatives for 3D globe visualization if needed, potentially outside the Google Maps API context.","message":"The 'Google Earth API for Google Maps v3' utility included in this collection is explicitly marked as deprecated within the package's own README. Using it may lead to errors or unsupported functionality.","severity":"deprecated","affected_versions":">=1.0.1"},{"fix":"When using in a modern ESM project, ensure your bundler (Webpack, Rollup, Vite) is configured to handle CommonJS modules. For Node.js, consider dynamic `import()` or stick to `require()` if feasible.","message":"This package is primarily designed for CommonJS/UMD environments. Direct ESM `import` statements may require bundler configuration or specific import paths (e.g., `import * as pkg from 'package'`) to resolve correctly, especially if relying on Node.js module resolution.","severity":"gotcha","affected_versions":">=1.0.1"},{"fix":"Always verify the actual last update date and maintenance status of libraries. For the most up-to-date Google Maps utilities, consult the official Google Maps Platform documentation and packages from `@googlemaps`.","message":"The package name `googlemaps-v3-utility-library-latest` can be misleading. While it implies 'latest', its contents are from 2018. Relying on this package for 'latest' features or bug fixes from the Google Maps API can lead to outdated functionality.","severity":"gotcha","affected_versions":">=1.0.1"},{"fix":"Be aware that this package might not receive direct issue support or updates. Consider migrating to officially maintained libraries if active support is crucial for your project.","message":"The project's GitHub link in the README (github.com/nblavoie/v3-utility-library) appears to be broken or redirects. Support is directed to the main Google Maps GitHub repository, implying this specific npm package might not have dedicated support channels.","severity":"gotcha","affected_versions":">=1.0.1"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Ensure the Google Maps JavaScript API script tag is loaded before your application code, and that you are importing `MarkerClusterer` directly from the package: `const MarkerClusterer = require('googlemaps-v3-utility-library-latest');`","cause":"The Google Maps API global object (`google`) is not loaded or the MarkerClusterer utility is not correctly imported and attached to the `google.maps` namespace.","error":"TypeError: google.maps.MarkerClusterer is not a constructor"},{"fix":"Make sure to include the Google Maps JavaScript API script tag in your HTML `head` or `body` with your API key and `callback` parameter, before any code that attempts to use the `google` object. Example: `<script src=\"https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap\"></script>`","cause":"The Google Maps JavaScript API has not been loaded into the browser environment.","error":"ReferenceError: google is not defined"},{"fix":"Double-check the exact casing and path for the desired utility library. Ensure the package is correctly installed via `npm i`. The `/lib` directory contains most individual utilities.","cause":"Incorrect path specified for a utility library or the file does not exist at the expected location after installation.","error":"Error: Cannot find module 'googlemaps-v3-utility-library-latest/lib/InfoBox'"}],"ecosystem":"npm"}