{"id":13776364,"url":"https://github.com/dburles/meteor-google-maps","last_synced_at":"2025-10-12T13:06:38.866Z","repository":{"id":24268334,"uuid":"27662517","full_name":"dburles/meteor-google-maps","owner":"dburles","description":"🗺 Meteor package for the Google Maps Javascript API v3","archived":false,"fork":false,"pushed_at":"2019-04-18T10:03:50.000Z","size":45,"stargazers_count":196,"open_issues_count":11,"forks_count":50,"subscribers_count":14,"default_branch":"master","last_synced_at":"2025-10-12T13:03:49.570Z","etag":null,"topics":["google-maps","google-maps-api","meteor","meteor-package"],"latest_commit_sha":null,"homepage":"https://atmospherejs.com/dburles/google-maps","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dburles.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-12-07T07:18:22.000Z","updated_at":"2023-07-21T16:59:14.000Z","dependencies_parsed_at":"2022-08-22T06:00:14.707Z","dependency_job_id":null,"html_url":"https://github.com/dburles/meteor-google-maps","commit_stats":null,"previous_names":[],"tags_count":16,"template":false,"template_full_name":null,"purl":"pkg:github/dburles/meteor-google-maps","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dburles%2Fmeteor-google-maps","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dburles%2Fmeteor-google-maps/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dburles%2Fmeteor-google-maps/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dburles%2Fmeteor-google-maps/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dburles","download_url":"https://codeload.github.com/dburles/meteor-google-maps/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dburles%2Fmeteor-google-maps/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279011468,"owners_count":26084947,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-12T02:00:06.719Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["google-maps","google-maps-api","meteor","meteor-package"],"created_at":"2024-08-03T18:00:23.973Z","updated_at":"2025-10-12T13:06:38.849Z","avatar_url":"https://github.com/dburles.png","language":"JavaScript","funding_links":[],"categories":["Uncategorized"],"sub_categories":["Uncategorized"],"readme":"Meteor Google Maps\n==================\n\n[![Join the chat at https://gitter.im/dburles/meteor-google-maps](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/dburles/meteor-google-maps?utm_source=badge\u0026utm_medium=badge\u0026utm_campaign=pr-badge\u0026utm_content=badge)\n\nLatest version of the [Google Maps Javascript API](https://developers.google.com/maps/documentation/javascript/tutorial) with an interface designed for Meteor.\n\n- Supports multiple map instances\n- Ability to only load the API when it's required\n- Provides callbacks for individual maps when they render\n- API key + libraries\n- StreetViewPanorama support\n\n## Table of Contents\n\n- [Installation](https://github.com/dburles/meteor-google-maps#installation)\n- [Examples](https://github.com/dburles/meteor-google-maps#examples)\n- [Usage Overview](https://github.com/dburles/meteor-google-maps#usage-overview)\n- [API](https://github.com/dburles/meteor-google-maps#api)\n  - [Blaze Template](https://github.com/dburles/meteor-google-maps#blaze-template)\n  - [create](https://github.com/dburles/meteor-google-maps#create)\n  - [load](https://github.com/dburles/meteor-google-maps#load)\n  - [loadUtilityLibrary](https://github.com/dburles/meteor-google-maps#loadutilitylibrary)\n  - [loaded](https://github.com/dburles/meteor-google-maps#loaded)\n  - [ready](https://github.com/dburles/meteor-google-maps#ready)\n  - [initialize](https://github.com/dburles/meteor-google-maps#initialize)\n- [Mobile Platforms](https://github.com/dburles/meteor-google-maps#mobile-platforms)\n- [License](https://github.com/dburles/meteor-google-maps#license)\n\n## Note\n\nThe maps API is *client-side only*. Server side support may be added soon.\n\n## Installation\n\n```sh\n$ meteor add dburles:google-maps\n```\n\nAlternatively if you wish to add the package from within another package and have `GoogleMaps` available outside of package scope, use [api.imply](http://docs.meteor.com/#/full/pack_api_imply) in your `package.js`.\n\n## Examples\n\n[Reactive geolocation](http://meteorcapture.com/reactive-geolocation-with-google-maps)\n\n[How to create a reactive Google map](http://meteorcapture.com/how-to-create-a-reactive-google-map)\n\n[React example](https://github.com/dburles/meteor-google-maps-react-example)\n\n[Demo project for the examples below](https://github.com/dburles/meteor-google-maps-demo)\n\n## Usage Overview\n\nCall the `load` method to load the maps API.\n\n```js\nif (Meteor.isClient) {\n  Meteor.startup(function() {\n    GoogleMaps.load();\n  });\n}\n```\n\nIf you prefer to load the maps API only once it's required, you may do so from within a Template `onRendered` hook.\n\n```js\nTemplate.contact.onRendered(function() {\n  GoogleMaps.load();\n});\n```\n\nWrap the map template to set the width and height.\n\n```html\n\u003cbody\u003e\n  \u003cdiv class=\"map-container\"\u003e\n    {{\u003e googleMap name=\"exampleMap\" options=exampleMapOptions}}\n  \u003c/div\u003e\n\u003c/body\u003e\n```\n\n```css\n.map-container {\n  width: 800px;\n  max-width: 100%;\n  height: 500px;\n}\n```\n\nPass through the map initialization options by creating a template helper. This will only run once.\n\n```js\nTemplate.body.helpers({\n  exampleMapOptions: function() {\n    // Make sure the maps API has loaded\n    if (GoogleMaps.loaded()) {\n      // Map initialization options\n      return {\n        center: new google.maps.LatLng(-37.8136, 144.9631),\n        zoom: 8\n      };\n    }\n  }\n});\n```\n\nPlace the `ready` callback within the template `onCreated` callback. This is also where you handle map events and reactive updates.\n\n```js\nTemplate.body.onCreated(function() {\n  // We can use the `ready` callback to interact with the map API once the map is ready.\n  GoogleMaps.ready('exampleMap', function(map) {\n    // Add a marker to the map once it's ready\n    var marker = new google.maps.Marker({\n      position: map.options.center,\n      map: map.instance\n    });\n  });\n});\n```\n\nAccess a map instance any time by using the `maps` object.\n\n```js\nGoogleMaps.maps.exampleMap.instance\n```\n\n## API\n\n### Blaze Template\n\n`{{\u003e googleMap [type=String] name=String options=Object}}`\n\n- type (Optional)\n  - Currently supported types: Map, StreetViewPanorama (defaults to 'Map')\n- name\n  - Provide a name to reference this map\n- options\n  - Map initialization options\n\n### create\n\n`GoogleMaps.create({object})`\n\nAn alternative to using the `googleMap` Blaze template. Call this function to create a new map instance and attach it to a DOM element.\n\nOptions:\n\n- `name` - Name to reference this map.\n- `element` - A DOM element to attach the map to.\n- `options` - The map options.\n- `type` (optional) - Map or StreetViewPanorama. Defaults to Map.\n\nExample:\n\n```js\nGoogleMaps.create({\n  name: 'exampleMap',\n  element: document.getElementById('exampleMap'),\n  options: {\n    center: new google.maps.LatLng(-37.8136, 144.9631),\n    zoom: 8\n  }\n});\n```\n\n### load\n\n`GoogleMaps.load([options])`\n\nLoads the map API. Options passed in are automatically appended to the maps url. \nBy default `v3.exp` will be loaded. For full documentation on these options see https://developers.google.com/maps/documentation/javascript/tutorial#Loading_the_Maps_API\n\nExample:\n\n```js\nGoogleMaps.load({ v: '3', key: '12345', libraries: 'geometry,places' });\n```\n\n### loadUtilityLibrary\n\n`GoogleMaps.loadUtilityLibrary('/path/to/library.js')`\n\nA method to ease loading external [utility libraries](https://code.google.com/p/google-maps-utility-library-v3/wiki/Libraries). These libraries will load once the Google Maps API has initialized.\n\n### loaded\n\n`GoogleMaps.loaded()`\n\nReactive method which returns `true` once the maps API has loaded, or after manually calling `GoogleMaps.initialize()` (See further down).\n\n### ready\n\n`GoogleMaps.ready('name', callback)`\n\nRuns once the specified map has rendered.\n\n- `name` *String*\n- `callback` *Function*\n\nExample:\n\n```js\nGoogleMaps.ready('exampleMap', function(map) {\n  // map.instance, map.options\n});\n```\n\nThe callback function returns an object containing two properties:\n\n- instance\n  - The Google map instance\n- options\n  - The options passed through from the Template helper (see Usage Overview above)\n\nYou can also access this object directly by name:\n\n```js\nGoogleMaps.maps.exampleMap\n```\n\n### initialize\n\n`GoogleMaps.initialize()`\n\nThis function is passed into the Google maps URL as the callback parameter when calling `GoogleMaps.load()`.\nIn the case where the maps library has already been loaded by some other means, calling `GoogleMaps.initialize()` will set `GoogleMaps.loaded()` to `true`.\n\n## Mobile platforms\n\nIf you're targeting mobile platforms you'll need to configure the following access rules in `mobile-config.js`.\n\n```js\nApp.accessRule('*.google.com/*');\nApp.accessRule('*.googleapis.com/*');\nApp.accessRule('*.gstatic.com/*');\n```\n\nFor more refer to the [official documentation](http://docs.meteor.com/#/full/mobileconfigjs).\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdburles%2Fmeteor-google-maps","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdburles%2Fmeteor-google-maps","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdburles%2Fmeteor-google-maps/lists"}