3lips/api/map/main.js
2024-02-12 13:46:57 +00:00

243 lines
No EOL
7.5 KiB
JavaScript

// default camera to Australia
var extent = Cesium.Rectangle.fromDegrees(138.44, -35.19, 138.93, -34.51);
Cesium.Camera.DEFAULT_VIEW_RECTANGLE = extent;
Cesium.Camera.DEFAULT_VIEW_FACTOR = 0;
var imageryProviders = [];
imageryProviders.push(new Cesium.ProviderViewModel({
name: "ESRI Adelaide",
iconUrl: './icon/esri.jpg',
tooltip: 'ESRI Adelaide Tiles',
category: 'Offline',
creationFunction: function() {
return new Cesium.UrlTemplateImageryProvider({
url: 'https://tile.datr.dev/data/esri-adelaide/{z}/{x}/{y}.jpg',
credit: 'Esri, Maxar, Earthstar Geographics, USDA FSA, USGS, Aerogrid, IGN, IGP, and the GIS User Community',
maximumLevel: 20,
});
}
}));
imageryProviders.push(new Cesium.ProviderViewModel({
name: "MapBox Streets v11",
iconUrl: './icon/mapBoxStreets.png',
tooltip: 'MapBox Streets v11 Tiles',
category: 'Offline',
creationFunction: function() {
return new Cesium.UrlTemplateImageryProvider({
url: 'https://tile.datr.dev/data/mapbox-streets-v11/{z}/{x}/{y}.png',
credit: '© <a href="https://www.mapbox.com/about/maps/">Mapbox</a> © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> <strong><a href="https://www.mapbox.com/map-feedback/" target="_blank">Improve this map</a></strong>',
maximumLevel: 16,
});
}
}));
imageryProviders.push(new Cesium.ProviderViewModel({
name: "MapBox Dark v10",
iconUrl: './icon/mapBoxDark.png',
tooltip: 'MapBox Dark v10 Tiles',
category: 'Offline',
creationFunction: function() {
return new Cesium.UrlTemplateImageryProvider({
url: 'https://tile.datr.dev/data/mapbox-dark-v10/{z}/{x}/{y}.png',
credit: '© <a href="https://www.mapbox.com/about/maps/">Mapbox</a> © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> <strong><a href="https://www.mapbox.com/map-feedback/" target="_blank">Improve this map</a></strong>',
maximumLevel: 16,
});
}
}));
imageryProviders.push(new Cesium.ProviderViewModel({
name: "ESRI",
iconUrl: './icon/esri.jpg',
tooltip: 'ESRI Tiles',
category: 'Offline',
creationFunction: function() {
return new Cesium.UrlTemplateImageryProvider({
url: 'https://tile.datr.dev/data/esri/{z}/{x}/{y}.jpg',
credit: 'Esri, Maxar, Earthstar Geographics, USDA FSA, USGS, Aerogrid, IGN, IGP, and the GIS User Community',
maximumLevel: 16,
});
}
}));
imageryProviders.push(new Cesium.ProviderViewModel({
name: "OpenTopoMap",
iconUrl: './icon/opentopomap.png',
tooltip: 'OpenTopoMap Tiles',
category: 'Offline',
creationFunction: function() {
return new Cesium.UrlTemplateImageryProvider({
url: 'https://tile.datr.dev/data/opentopomap/{z}/{x}/{y}.png',
credit: '<code>Kartendaten: © <a href="https://openstreetmap.org/copyright">OpenStreetMap</a>-Mitwirkende, SRTM | Kartendarstellung: © <a href="http://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)</code>',
maximumLevel: 8,
});
}
}));
var terrainProviders = [];
terrainProviders.push(new Cesium.ProviderViewModel({
name: "WGS84 Ellipsoid",
iconUrl: './icon/opentopomap.png',
tooltip: 'WGS84 Ellipsoid Terrain',
category: 'Offline',
creationFunction: function() {
return new Cesium.EllipsoidTerrainProvider({
});
}
}));
terrainProviders.push(new Cesium.ProviderViewModel({
name: "30m Adelaide",
iconUrl: './icon/opentopomap.png',
tooltip: '30m Adelaide Terrain',
category: 'Offline',
creationFunction: function() {
return Cesium.CesiumTerrainProvider.fromUrl(
'https://terrain.datr.dev/data/30m_adelaide/'
);
}
}));
terrainProviders.push(new Cesium.ProviderViewModel({
name: "90m Australia",
iconUrl: './icon/opentopomap.png',
tooltip: '90m Australia Terrain',
category: 'Offline',
creationFunction: function() {
return Cesium.CesiumTerrainProvider.fromUrl(
'https://terrain.datr.dev/data/90m_australia/'
);
}
}));
terrainProviders.push(new Cesium.ProviderViewModel({
name: "90m South Australia",
iconUrl: './icon/opentopomap.png',
tooltip: '90m South Australia Terrain',
category: 'Offline',
creationFunction: function() {
return Cesium.CesiumTerrainProvider.fromUrl(
'https://terrain.datr.dev/data/90m_south_australia/'
);
}
}));
var viewer = new Cesium.Viewer("cesiumContainer", {
baseLayerPicker: true,
imageryProviderViewModels: imageryProviders,
terrainProviderViewModels: terrainProviders,
geocoder: false,
shouldAnimate: true,
selectionIndicator: false
});
/**
* @brief Adds a point to Cesium viewer with specified parameters.
* @param {number} latitude - The latitude of the point in degrees.
* @param {number} longitude - The longitude of the point in degrees.
* @param {number} altitude - The altitude of the point in meters.
* @param {string} pointName - The name of the point.
* @param {string} pointColor - The color of the point in CSS color string format.
* @param {number} timestamp - The timestamp in UNIX milliseconds indicating when the point was added.
* @returns {Entity} The Cesium Entity representing the added point.
*/
function addPoint(latitude, longitude, altitude, pointName, pointColor, pointSize, type, timestamp) {
// Convert latitude, longitude, altitude to Cartesian coordinates (ECEF)
const position = Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude);
// Create a point entity
const pointEntity = viewer.entities.add({
position,
point: {
color: Cesium.Color.fromCssColorString(pointColor),
pixelSize: pointSize,
},
label: (type === "radar") ? {
text: pointName,
showBackground: true,
backgroundColor: Cesium.Color.BLACK,
font: '14px sans-serif',
pixelOffset: new Cesium.Cartesian2(0, -20),
} : undefined,
properties: {
timestamp,
type,
},
});
return pointEntity;
}
window.addEventListener('load', function () {
// add radar points
const radar_names = new URLSearchParams(
window.location.search).get('url').split('&');
var radar_config_url = radar_names.map(
url => `http://${url}/api/config`);
if (this.window.location.protocol === "https:") {
radar_config_url = radar_config_url.map(
url => url.replace(/^http:/, 'https:'));
}
var style_radar = {};
style_radar.color = 'rgba(0, 0, 0, 1.0)';
style_radar.pointSize = 10;
style_radar.type = "radar";
style_radar.timestamp = Date.now();
radar_config_url.forEach(url => {
console.log(url);
fetch(url)
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
// add radar rx and tx
// todo: check not duplicating points
addPoint(
data.location.rx.latitude,
data.location.rx.longitude,
data.location.rx.altitude,
data.location.rx.name,
style_radar.color,
style_radar.pointSize,
style_radar.type,
style_radar.timestamp
);
addPoint(
data.location.tx.latitude,
data.location.tx.longitude,
data.location.tx.altitude,
data.location.tx.name,
style_radar.color,
style_radar.pointSize,
style_radar.type,
style_radar.timestamp
);
})
.catch(error => {
// Handle errors during fetch
console.error('Error during fetch:', error);
});
});
// get detection data URL
// get truth URL
// call event loop
event_loop();
})
function event_loop() {
//console.log(Date.now());
setTimeout(event_loop, 1000);
}