Sha256: f4832cd9eb02754498f76a60a2b951fa966f43671fc21d60039536fe44f8941d
Contents?: true
Size: 1.24 KB
Versions: 7
Compression:
Stored size: 1.24 KB
Contents
// map_controller.js
import ApplicationController from "../../../../frontend/controllers/application_controller"
import L from "leaflet"
export default class extends ApplicationController {
static targets = ["container"]
static values = { urls: String, latitude: Number, longitude: Number, zoomLevel: Number, geoJsonUrl: String }
connect() {
super.connect()
// Example https://leafletjs.com/examples/choropleth/
// Data https://public.opendatasoft.com/explore/?sort=modified&q=netherlands
this.map = L.map(this.containerTarget).setView([this.latitudeValue, this.longitudeValue], this.zoomLevelValue)
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' }).addTo(this.map)
// this.map.setView() etc... as normal.
// Load layers and setup event handlers, for example:
fetch(this.geoJsonUrlValue)
.then((response) => response.json())
.then((data) => {
L.geoJSON(data, {
onEachFeature: (feature, layer) => {
layer.on("click", () => this.onClick(layer))
},
}).addTo(this.map)
})
}
disconnect() {
this.map.remove()
}
onClick(layer) {}
}
Version data entries
7 entries across 7 versions & 1 rubygems