<commit_before># Ember-g-map [![Build Status](https://travis-ci.org/asennikov/ember-g-map.svg?branch=master)](https://travis-ci.org/asennikov/ember-g-map)

An ember-cli add-on for easy integration with Google Maps.
Each object displayed on map is inserted via child component,
so you can easily declare which marker and when to display on map
using `{{#if}}` and `{{#each}}` on template level.

# Installation

* `ember install ember-g-map`

# Configuration

In `config/environment.js` you can specify additional Google Map libraries
to be loaded along with this add-on (check the full list [here](https://developers.google.com/maps/documentation/javascript/libraries))
and optional API key for your application (additional info could be found [here](https://developers.google.com/maps/web/)).

```javascript
ENV['g-map'] = {
  libraries: ['places', 'geometry'],
  key: 'your-unique-google-map-api-key'
}
```

# Usage

## Simple map

```handlebars
{{g-map lat=37.7833 lng=-122.4167 zoom=12}}
```

## Map with Markers

```handlebars
{{#g-map lat=37.7833 lng=-122.4167 zoom=12}}
  {{g-map-marker lat=37.7933 lng=-122.4167}}
  {{g-map-marker lat=37.7833 lng=-122.4267}}
  {{g-map-marker lat=37.7733 lng=-122.4067}}
{{/g-map}}
```

## Map with Markers and optional Info Windows

Markers can have optional Info Windows activated on click.
To provide content for Info Window you should call `g-map-marker`
in block form with `withInfowindow` flag set to `true`.

```handlebars
{{#g-map lat=37.7833 lng=-122.4167 zoom=12}}
  {{#g-map-marker lat=37.7833 lng=-122.4267 withInfowindow=true}}
    <h2>Infowindow header</h2>
    <p>Text with {{bound}} variables</p>
    <button {{action "do"}}>Do</button>
  {{/g-map-marker}}
{{/g-map}}
```

## Map with route between 2 locations

```handlebars
{{#g-map lat=37.7833 lng=-122.4167 zoom=12}}
  {{g-map-route originLat=37.7933 originLng=-122.4167
                destinationLat=37.7733 destinationLng=-122.4167}}
{{/g-map}}
```

# Planned Features

- Independent Info Windows
- Auto-closing Info Windows
- Polylines & Polygons

## Running

* `ember server`
* Visit your app at http://localhost:4200.

## Running Tests

* `ember test`
* `ember test --server`

## Building

* `ember build`

For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/).

## Legal

[Licensed under the MIT license](http://www.opensource.org/licenses/mit-license.php)
<commit_msg>Add a note about css requirements<commit_after># Ember-g-map [![Build Status](https://travis-ci.org/asennikov/ember-g-map.svg?branch=master)](https://travis-ci.org/asennikov/ember-g-map)

An ember-cli add-on for easy integration with Google Maps.
Each object displayed on map is inserted via child component,
so you can easily declare which marker and when to display on map
using `{{#if}}` and `{{#each}}` on template level.

# Installation

* `ember install ember-g-map`

# Configuration

You must define the size of the canvas in which the map is displayed.
Simply add something similar to this to your styles:

```css
.g-map-canvas {
  width: 600px;
  height: 400px;
}
```

In `config/environment.js` you can specify additional Google Map libraries
to be loaded along with this add-on (check the full list [here](https://developers.google.com/maps/documentation/javascript/libraries))
and optional API key for your application (additional info could be found [here](https://developers.google.com/maps/web/)).

```javascript
ENV['g-map'] = {
  libraries: ['places', 'geometry'],
  key: 'your-unique-google-map-api-key'
}
```

# Usage

## Simple map

```handlebars
{{g-map lat=37.7833 lng=-122.4167 zoom=12}}
```

## Map with Markers

```handlebars
{{#g-map lat=37.7833 lng=-122.4167 zoom=12}}
  {{g-map-marker lat=37.7933 lng=-122.4167}}
  {{g-map-marker lat=37.7833 lng=-122.4267}}
  {{g-map-marker lat=37.7733 lng=-122.4067}}
{{/g-map}}
```

## Map with Markers and optional Info Windows

Markers can have optional Info Windows activated on click.
To provide content for Info Window you should call `g-map-marker`
in block form with `withInfowindow` flag set to `true`.

```handlebars
{{#g-map lat=37.7833 lng=-122.4167 zoom=12}}
  {{#g-map-marker lat=37.7833 lng=-122.4267 withInfowindow=true}}
    <h2>Infowindow header</h2>
    <p>Text with {{bound}} variables</p>
    <button {{action "do"}}>Do</button>
  {{/g-map-marker}}
{{/g-map}}
```

## Map with route between 2 locations

```handlebars
{{#g-map lat=37.7833 lng=-122.4167 zoom=12}}
  {{g-map-route originLat=37.7933 originLng=-122.4167
                destinationLat=37.7733 destinationLng=-122.4167}}
{{/g-map}}
```

# Planned Features

- Independent Info Windows
- Auto-closing Info Windows
- Polylines & Polygons

## Running

* `ember server`
* Visit your app at http://localhost:4200.

## Running Tests

* `ember test`
* `ember test --server`

## Building

* `ember build`

For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/).

## Legal

[Licensed under the MIT license](http://www.opensource.org/licenses/mit-license.php)

{'fraction_non_alphanumeric': 0.1601339373645854, 'fraction_numerical': 0.05830214693716762, 'mean_word_length': 4.129292929292929, 'pattern_counts': {'":': 0, '<': 15, '<?xml version=': 0, '>': 15, 'https://': 8, 'lorem ipsum': 0, 'www.': 6, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5022814', 'n_tokens_mistral': 1947, 'n_tokens_neox': 1744, 'n_words': 492}