https://github.com/r-dent/berlinlocals
A map of local businesses with delivery service in Berlin.
https://github.com/r-dent/berlinlocals
berlin covid-19 delivery local local-business local-search localbusiness location-data map restaurant shopping
Last synced: 8 months ago
JSON representation
A map of local businesses with delivery service in Berlin.
- Host: GitHub
- URL: https://github.com/r-dent/berlinlocals
- Owner: r-dent
- License: mit
- Created: 2020-04-11T21:13:41.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2020-04-15T12:10:44.000Z (about 6 years ago)
- Last Synced: 2025-04-10T09:12:42.212Z (about 1 year ago)
- Topics: berlin, covid-19, delivery, local, local-business, local-search, localbusiness, location-data, map, restaurant, shopping
- Language: JavaScript
- Homepage: https://r-dent.github.io/BerlinLocals/
- Size: 372 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## Berlin Locals - Map
This project is taking [data about local businesses](https://daten.berlin.de/datensaetze/gastronomien-laden-und-andere-gesch%C3%A4fte-mit-liefer-und-abholservice) from the [Berlin Open Data](https://daten.berlin.de) project and displays it in a customizable map that can be embedded on a website.
You can embed the map on your own website by adding the following code:
```html
```
If you want to customize the map, you can pass some options to the initializer.
```html
var localsMap = new LocalBusinessMap('mapid', {
mapBoxKey: 'your_mapbox_key',
mapBoxStyle: 'username/your_style_id',
clusterBelowZoom: 15,
showLocateButton: true,
showCategorySelection: true
})
```
### Initializer options
Option | Type | Description | Default
--- | --- | --- | ---
`showLocateButton` | `boolean` | If you want to show a button that let´s the user zoom to his/her own location. | `false`
`showCategorySelection` | `boolean` | Show a category selection dropdown in the top right corner of the map. | `true`
`clusterBelowZoom` | `number` | You can use clustering to group multiple markers into one for a better overview. To do that just provide a zoom level below which items will get clustered. | `undefined`
`onDataReady` | `function` | A Handler that will be called after loading is done and the map is ready. The resutling categories will be passed as data. | `undefined`
`mapBoxStyle` | `string` | If you have customized your own map style with [Mapbox](https://www.mapbox.com/), you can use it for rendering by providing this parameter together with your Mapbox API key. If your Mapbox Style URL is something like `mapbox://styles/username/your_style_id`, use `username/your_style_id` for this parameter. If you don´t have a Mapbox account, [OpenStreetMap](https://www.openstreetmap.org) will be used as fallback. | `undefined`
`mapBoxKey` | `string` | Your API key from [Mapbox](https://www.mapbox.com/). | `undefined`
### Custom category selection
Here´s an example how to create custom controls for the category selection.
```html
var map = new LocalBusinessMap('mapid', {
showCategorySelection: false,
onDataReady: function(categories) {
var buttonsHTML = ''
for (index in categories) {
category = categories[index]
buttonsHTML += '<button onclick="map.selectCategory(\''+ category +'\')">'+ category +'</button>\n'
}
document.getElementById('button-container').innerHTML = buttonsHTML
}
})
```
Please [file an issue](https://github.com/r-dent/BerlinLocals/issues/new) or [contact me](https://romangille.com/#contact) if you have feedback.