Air-Quality-Web/client_src/js/Overlay/VoronoiManager.mjs

77 lines
1.9 KiB
JavaScript

"use strict";
import chroma from 'chroma-js';
import Config from '../Config.mjs';
import VoronoiOverlay from './VoronoiOverlay.mjs';
import VoronoiCell from './VoronoiCell.mjs';
import Guage from '../Guage.mjs';
import Specs from './OverlaySpecs.mjs';
import Vector2 from '../Helpers/Vector2.mjs';
import GetFromUrl from '../Helpers/GetFromUrl.mjs';
class VoronoiManager {
constructor(in_device_data, in_map) {
this.device_data = in_device_data;
this.map = in_map;
this.layer = null;
this.setup_guage();
this.setup_overlay();
}
setup_overlay() {
this.overlay = new VoronoiOverlay();
this.set_data(new Date(), "PM25"); // TODO: Make this customisable
}
setup_guage() {
this.guage = new Guage(document.getElementById("canvas-guage"));
}
async set_data(datetime, reading_type) {
this.spec = Specs[reading_type];
if(typeof this.spec.chroma == "undefined")
this.spec.chroma = chroma.scale(Object.values(this.spec.gradient))
.domain(Object.keys(this.spec.gradient));
this.guage.set_spec(this.spec);
this.guage.render();
let dataset = JSON.parse(await GetFromUrl(
`${Config.api_root}?action=fetch-data&datetime=${encodeURIComponent(datetime.toISOString())}&reading_type=${encodeURIComponent(reading_type)}`
));
let result = [];
for(let row of dataset) {
let device = this.device_data.get_by_id(row.device_id);
if(typeof device.latitude != "number" || typeof device.longitude != "number")
continue;
result.push(new VoronoiCell(
new Vector2(
device.longitude,
device.latitude
),
// See https://gka.github.io/chroma.js/
this.spec.chroma(row.value).toString()
));
}
this.overlay.set_cells(result);
if(this.layer !== null)
this.layer.remove(); // Remove the old layer if it exists
// Generate & add the new layer
this.layer = this.overlay.generate_layer();
this.layer.addTo(this.map);
console.log(result);
}
}
export default VoronoiManager;