Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/coreyauger/scalajs-google-maps
Type-safe and Scala-friendly library over Google Maps.
https://github.com/coreyauger/scalajs-google-maps
google-maps scalajs
Last synced: about 2 months ago
JSON representation
Type-safe and Scala-friendly library over Google Maps.
- Host: GitHub
- URL: https://github.com/coreyauger/scalajs-google-maps
- Owner: coreyauger
- License: mit
- Created: 2015-05-13T19:04:44.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-09-08T14:01:15.000Z (over 7 years ago)
- Last Synced: 2023-06-03T23:55:16.385Z (over 1 year ago)
- Topics: google-maps, scalajs
- Language: Scala
- Homepage:
- Size: 48.8 KB
- Stars: 21
- Watchers: 4
- Forks: 19
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# scalajs-google-maps
Type-safe and Scala-friendly library over Google Maps.
## Dependency Info
[Scala.js](https://www.scala-js.org/).
[Google Maps api v3](https://developers.google.com/maps/documentation/javascript/)
## Get started
I assume that you have setup a ScalaJS project before. If this is not the case you can follow the instructions and some basic example on the [Scala.js](https://www.scala-js.org/) homepage.
To get started you will need a google maps api key. You can [get an api key here](https://developers.google.com/maps/documentation/javascript/tutorial#api_key).
### Include google maps on your page
```html
```
### Build.sbt
Add the following dependency to your porject.
`resolvers += "Sonatype OSS Snapshots" at "https://oss.sonatype.org/content/repositories/snapshots"`
`"io.surfkit" %%% "scalajs-google-maps" % "0.0.3-SNAPSHOT",`
## Some Examples
Here are some of the google maps examples demonstrated in a type safe scalaJS way.
### Simple Map
Initialize a map to a location and zoom level.
```scala
object ScalaJSGMapExample extends js.JSApp {
def main(): Unit = {
def initialize() = js.Function {
val opts = google.maps.MapOptions(
center = new LatLng(51.201203, -1.724370),
zoom = 8,
panControl = false,
streetViewControl = false,
mapTypeControl = false)
val gmap = new google.maps.Map(document.getElementById("map-canvas"), opts)
}
google.maps.event.addDomListener(window, "load", initialize)
}
}
```
### Place a marker
Add a marker to the map.
```scala
object ScalaJSGMapExample extends js.JSApp {
def main(): Unit = {
def initialize() = js.Function {
val opts = google.maps.MapOptions(
center = new LatLng(51.201203, -1.724370),
zoom = 8,
panControl = false,
streetViewControl = false,
mapTypeControl = false)
val gmap = new google.maps.Map(document.getElementById("map-canvas"), opts)
val marker = new google.maps.Marker(google.maps.MarkerOptions(
position = gmap.getCenter(),
map = gmap,
title = "Marker"
))
}
google.maps.event.addDomListener(window, "load", initialize)
}
}
```
### Respond to events + Info Window
```scala
object ScalaJSGMapExample extends js.JSApp {
def main(): Unit = {
def initialize() = js.Function {
val opts = google.maps.MapOptions(
center = new LatLng(51.201203, -1.724370),
zoom = 8,
panControl = false,
streetViewControl = false,
mapTypeControl = false)
val gmap = new google.maps.Map(document.getElementById("map-canvas"), opts)
val marker = new google.maps.Marker(google.maps.MarkerOptions(
position = gmap.getCenter(),
map = gmap,
title = "Marker"
))
val contentString = """
Hello World !!
"""
val infowindow = new google.maps.InfoWindow(google.maps.InfoWindowOptions(
content=contentString
))
google.maps.event.addListener(marker, "click", () => {
println("Marker click !")
infowindow.open(gmap,marker)
})
}
google.maps.event.addDomListener(window, "load", initialize)
}
}
```