Skip to content
Snippets Groups Projects
Commit 8ca99c8b authored by Tor-Einar Skog's avatar Tor-Einar Skog
Browse files

Add support for sphere map [IDEC-416]

parent 9118c1d8
No related branches found
No related tags found
No related merge requests found
......@@ -578,7 +578,8 @@ function destroyDataSourceMap(containerId)
* @param {String} containerId
* @param {JSON} geoJson
* @param {Array} countryCodeList
* @param {Function} featureClickedCallback Callback function taking parameters ({String} id, {Array<Float>} coordinate)
* @param {Boolean} clickable if null or false; clicking does nothing
* @param {Function} featureClickedCallback Callback function taking parameters ({String} id, {Array<Float>} coordinate). If null => do nothing when user clicks in map
*/
async function initDataSourceMap(containerId, geoJson, countryCodeList, featureClickedCallback)
{
......@@ -592,7 +593,7 @@ async function initDataSourceMap(containerId, geoJson, countryCodeList, featureC
}
// If no data, no map
if((isEmpty(geoJson) || isEmpty(geoJson.features) || geoJson.features.length == 0) && (countryCodeList == null || countryCodeList.length == 0))
if((isEmpty(geoJson) || ((isEmpty(geoJson.features) || geoJson.features.length == 0) && ! (geoJson.type != undefined && geoJson.type.toLowerCase() == "sphere")) ) && (countryCodeList == null || countryCodeList.length == 0))
{
document.getElementById(containerId).innerHTML = "NO GEODATA PROVIDED BY WEATHER DATA SOURCE";
return;
......@@ -627,9 +628,10 @@ async function initDataSourceMap(containerId, geoJson, countryCodeList, featureC
map.setView(view);
// Read the datasource's geoJson features
let features = new ol.Collection();
let drawnFeatures = undefined;
let features = new ol.Collection();
let format = new ol.format.GeoJSON();
let drawnFeatures = await format.readFeatures(
drawnFeatures = await format.readFeatures(
await getDatasourceFeatures(geoJson, countryCodeList),
{
dataProjection: 'EPSG:4326',
......@@ -639,55 +641,66 @@ async function initDataSourceMap(containerId, geoJson, countryCodeList, featureC
// Add any features to the featureOverlay
let featureOverlay = undefined;
if(drawnFeatures != undefined)
{
// Create an empty layer
featureOverlay = new ol.layer.Vector({
source: new ol.source.Vector({
features: features
}),
style: styleUnselected
});
// Add the stations or area
// Create an empty layer
featureOverlay = new ol.layer.Vector({
source: new ol.source.Vector({
features: features
}),
style: styleUnselected
});
// Add the stations or area
if(drawnFeatures != undefined && drawnFeatures.length > 0)
{
featureOverlay.getSource().addFeatures(drawnFeatures);
featureOverlay.setMap(map);
// Fit the features to the extent of the map
extent = featureOverlay.getSource().getExtent();
let extent = featureOverlay.getSource().getExtent();
map.getView().fit(extent, map.getSize());
}
// If no stations / area: show the world
else
{
map.getView().setZoom(1);
map.getView().setCenter(ol.proj.transform([0.0,15.0], 'EPSG:4326', map.getView().getProjection().getCode()));
}
featureOverlay.setMap(map);
if(featureClickedCallback != undefined && featureClickedCallback != null)
{
/*
* A little bit of this and that to make feature selection work the way we want
* - Highlight a selected station (but only one station, multiple select is not allowed)
* - If user clicks on multiple stations, zoom in to make it easy to pick the right one
*/
/*
* A little bit of this and that to make feature selection work the way we want
* - Highlight a selected station (but only one station, multiple select is not allowed)
* - If user clicks on multiple stations, zoom in to make it easy to pick the right one
*/
let selectInteraction = new ol.interaction.Select({
toggleCondition: ol.events.condition.never // Only one can be selected at a time
});
map.addInteraction(selectInteraction);
selectInteraction.on("select", function(e){
// If it's an area (id == undefined), don't mark it as selected
if(e.target.getFeatures().getLength() > 0 && e.target.getFeatures().item(0).getId() == undefined)
{
e.target.getFeatures().clear();
}
else if(e.target.getFeatures().getLength() == 1)
{
let feature = e.target.getFeatures().item(0);
featureClickedCallback(feature.getId(), undefined);
}
});
// We add this in order to detect if multiple features were clicked on, since the selectInteraction
// does not catch that
map.on('singleclick', function(evt) {
var pixel = map.getEventPixel(evt.originalEvent);
var coordinate = map.getEventCoordinate(evt.originalEvent);
handleMapClicked(map, featureOverlay, pixel, coordinate, featureClickedCallback);
});
let selectInteraction = new ol.interaction.Select({
toggleCondition: ol.events.condition.never // Only one can be selected at a time
});
map.addInteraction(selectInteraction);
selectInteraction.on("select", function(e){
// If it's an area (id == undefined), don't mark it as selected
if(e.target.getFeatures().getLength() > 0 && e.target.getFeatures().item(0).getId() == undefined)
{
e.target.getFeatures().clear();
}
else if(e.target.getFeatures().getLength() == 1)
{
let feature = e.target.getFeatures().item(0);
featureClickedCallback(feature.getId(), undefined);
}
});
// We add this in order to detect if multiple features were clicked on, since the selectInteraction
// does not catch that
map.on('singleclick', function(evt) {
var pixel = map.getEventPixel(evt.originalEvent);
var coordinate = map.getEventCoordinate(evt.originalEvent);
handleMapClicked(map, featureOverlay, pixel, coordinate, featureClickedCallback);
});
}
}
/**
......@@ -699,8 +712,12 @@ async function initDataSourceMap(containerId, geoJson, countryCodeList, featureC
*/
async function getDatasourceFeatures(geoJson, countryCodeList)
{
if(geoJson != null && geoJson.type != undefined && geoJson.type.toLowerCase() == "sphere")
{
return {"type": "FeatureCollection","features": []};
}
// If we have geoJson available, we display that
if (geoJson != null && geoJson.features !== undefined && geoJson.features.length > 0) {
if (geoJson != null && geoJson.features !== undefined && geoJson.features.length > 0) {
return geoJson;
}
return await getCountryBoundaries(countryCodeList);
......@@ -747,9 +764,9 @@ function handleMapClicked(map, layer, pixel, coordinate, featureClickedCallback)
features.push(feature);
});
if (features.length == 1) {
// Area
if(features[0].getId() === undefined)
if (features.length == 1 || layer.getSource().getFeatures().length == 0) {
// Area / sphere (whole globe)
if(layer.getSource().getFeatures().length == 0 || features[0].getId() === undefined)
{
// We must place a marker where the user clicked
let marker = map.getOverlayById("marker");
......@@ -787,7 +804,7 @@ function handleMapClicked(map, layer, pixel, coordinate, featureClickedCallback)
{
map.getView().setCenter(coordinate);
map.getView().setZoom(map.getView().getZoom() + 2);
}
}
};
function createMarkerOverlay(coordinate)
......
......@@ -300,12 +300,12 @@
let geoJson = JSON.parse(currentForecastWeatherDatasource.spatial.geoJSON);
// Display map
// Display non-interactive map
initDataSourceMap(
"forecastDatasourceMap",
geoJson,
currentForecastWeatherDatasource.spatial.countries,
function(){} // We don't do nothing, right?
null // We don't do nothing, right?
);
let sourceInfo = document.getElementById("forecastSourceInfo");
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment