Wondering what’s next for npm?Check out our public roadmap! »

ember-google-maps

3.3.0 • Public • Published

Ember Google Maps

A friendly Ember addon for working with Google Maps.

Version npm Ember Observer Score Build Status

What this addon is:
  • A lightweight Ember API for working with Google Maps.
  • An on-demand, asynchronous loader for the Google Maps API.
What this addon is not:
  • A bulky, verbose wrapper that reimplements the entire Google Maps API.
  • An option validator that is tightly coupled to Google's API.

📎 Documentation

View guide and documentation ↗️

🔗 Compatibility

  • Ember.js v2.18 or above
  • Ember CLI v3.11 or above
  • Node.js v10 or above

Features

Feature
Lightweight wrapper
Async API loading
Official Google API
Leverages templates
Contextual components
Minimal observer usage
Native Ember HTML markers

If you don't need the Google API specifically, check out ember-leaflet ↗️.

Examples of what to expect

Display a map centered around a set of coordinates 🗺.

{{g-map lat='51.508530' lng='-0.076132' zoom=10}}

Display an array of locations using markers 📍.

{{#g-map lat='51.508530' lng='-0.076132' zoom=10 as |g|}}
  {{#each locations as |l|}}
    {{g.marker lat=l.lat lng=l.lng onClick=(action 'showDetails' l)}}
  {{/each}}
{{/g-map}}

Display a custom overlay, like a custom HTML marker using template blocks 😱. This lets you do all sorts of fancy things, like adding CSS animations and binding data.

{{#g-map lat='51.508530' lng='-0.076132' zoom=10 as |g|}}
  {{#each rentals as |r|}}
    {{#g.overlay lat=r.lat lng=r.lng classNames='custom-marker'}}
      <div class="marker-content">
        <p class="price">{{r.price}}</p>
      </div>
    {{/g.overlay}}
  {{/each}}
{{/g-map}}

Learn more ↗️

👷 Maintainers

This addon is maintained by Sander Melnikov.

Contributing

See the Contributing guide for details.

For more information on using ember-cli, visit https://ember-cli.com/.

License

MIT © Sander Melnikov.

Disclaimer

This software and its maintainer are in no way affiliated, endorsed, maintained, or supported by Google LLC.

©2020 Google LLC All rights reserved. Google Maps™ is a trademark of Google LLC.

Install

npm i ember-google-maps

DownloadsWeekly Downloads

3,353

Version

3.3.0

License

MIT

Unpacked Size

79.1 kB

Total Files

118

Last publish

Collaborators

  • avatar
  • avatar