Sha256: b1bc5914df5ae3df7211cb2b1de2e6cec7aeb99719f79c0d77b1903f8aa998d5
Contents?: true
Size: 1.31 KB
Versions: 36
Compression:
Stored size: 1.31 KB
Contents
// map_controller.js
import ApplicationController from "satis/controllers/application_controller"
import L from "leaflet"
export default class MapComponentController 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.
if(this.geoJsonUrlValue) {
// 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
36 entries across 36 versions & 1 rubygems