https://github.com/felipesousa/polyfleat-map
:leaves: A Polymer component to use Leaflet Map easily.
https://github.com/felipesousa/polyfleat-map
leafletjs maps polymer web-components
Last synced: 8 months ago
JSON representation
:leaves: A Polymer component to use Leaflet Map easily.
- Host: GitHub
- URL: https://github.com/felipesousa/polyfleat-map
- Owner: felipesousa
- Created: 2017-02-03T14:45:28.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2018-09-12T13:59:06.000Z (almost 8 years ago)
- Last Synced: 2025-01-27T10:11:33.069Z (over 1 year ago)
- Topics: leafletjs, maps, polymer, web-components
- Language: HTML
- Homepage:
- Size: 3.91 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# Polyfleat Map
Map Component created as example in GDG Hangouts Maceió using [Polymer](https://www.polymer-project.org/1.0/) and [LeafletJS](http://leafletjs.com/).
## Usage
1 - Install the element using Bower:
``` bash
$ bower install --save polyfleat-map
```
2 - Import the component to your file:
``` html
```
3 - Call the element:
``` html
```
## Properties
Property | Type | Default | Description
:--- |:--- |:--- |:---
`token` | *String* | `null` | *You can get your token access [here](https://www.mapbox.com/studio/).
`lat` | *Number* | `51.050` | *Latitude value.
`lng` | *Number* | `-0.09` | *Longitude value.
`zoom` | *Number* | `12` | Zoom at map.
`type` | *Number* | `streets` | set your map type, that can `pirates`, `streets`, `satellite`, `light` and `dark`.
### Custom Size Map
For default, the map is 400x400 px, but, you can set the size of map, using a simple override variables, see bellow:
``` html
polyfleat-map {
--map-size-height-custom: 300px;
--map-size-width-custom: 600px;
}
````
## Contributing
1. Fork it!
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -am 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D