slContest.fromData = function(_contest, flightId) {
let turnpoints = ol.format.Polyline.decodeDeltas(_contest.turnpoints, 2);
let times = ol.format.Polyline.decodeDeltas(_contest.times, 1, 1);
let name = _contest.name;
let geometry = new ol.geom.LineString([]);
let turnpointsLength = turnpoints.length;
let triangle = name.search(/triangle/) !== -1 && turnpointsLength === 5 * 2;
if (triangle) {
for (let i = 2; i < turnpointsLength - 2; i += 2) {
let point = ol.proj.transform([turnpoints[i + 1], turnpoints[i]], 'EPSG:4326', 'EPSG:3857');
geometry.appendCoordinate(point);
}
geometry.appendCoordinate(geometry.getFirstCoordinate());
} else {
for (let i = 0; i < turnpointsLength; i += 2) {
let point = ol.proj.transform([turnpoints[i + 1], turnpoints[i]], 'EPSG:4326', 'EPSG:3857');
geometry.appendCoordinate(point);
}
}
let color = CONTEST_COLORS[name] || '#ff2c73';
return slContest.create({
flightId,
times,
name,
geometry,
color,
});
};
makeMap: function(options) {
this.collection.forEach(model => {
this.addLayer(model)
})
const view = new ol.View({
projection: ol.proj.get(properties.projection),
center: ol.proj.transform([0, 0], 'EPSG:4326', properties.projection),
zoom: options.zoom,
})
const config = {
target: options.element,
view: view,
interactions: ol.interaction.defaults({ doubleClickZoom: false }),
}
if (options.controls !== undefined) {
config.controls = options.controls
}
this.map = new ol.Map(config)
this.isMapCreated = true
return this.map
},
getFeatureFromModel: function(model) {
var sp = ol.proj.transform(
[model.get("start_latlng")[1], model.get("start_latlng")[0]],
'EPSG:4326', 'EPSG:3857');
var ep = ol.proj.transform(
[model.get("end_latlng")[1], model.get("end_latlng")[0]],
'EPSG:4326', 'EPSG:3857');
return new ol.Feature({
geometry: new ol.geom.LineString([sp, ep]),
name: 'Line'
});
},
modelToRectangle: function(model) {
//ensure that the values are numeric
//so that the openlayer projections
//do not fail
const north = parseFloat(model.get('mapNorth'))
const south = parseFloat(model.get('mapSouth'))
let east = parseFloat(model.get('mapEast'))
let west = parseFloat(model.get('mapWest'))
// If we are crossing the date line, we must go outside [-180, 180]
// for openlayers to draw correctly. This means we can't draw boxes
// that encompass more than half the world. This actually matches
// how the backend searches anyway.
if (east - west < -180) {
east += 360
} else if (east - west > 180) {
west += 360
}
const northWest = ol.proj.transform(
[west, north],
'EPSG:4326',
properties.projection
)
const northEast = ol.proj.transform(
[east, north],
'EPSG:4326',
properties.projection
)
const southWest = ol.proj.transform(
[west, south],
'EPSG:4326',
properties.projection
)
const southEast = ol.proj.transform(
[east, south],
'EPSG:4326',
properties.projection
)
const coords = []
coords.push(northWest)
coords.push(northEast)
coords.push(southEast)
coords.push(southWest)
coords.push(northWest)
const rectangle = new ol.geom.LineString(coords)
return rectangle
},
getPosition: function getPosition(point, srcProj, destUnits) {
switch (destUnits) {
case "degrees":
var lonLat = ol.proj.toLonLat(point.getCoordinates(), srcProj);
return {
lon: {
value: Math.round(lonLat[0] * 10000) / 10000,
direction: lonLat[0] > 0 ? 'E' : 'W'
},
lat: {
value: Math.round(lonLat[1] * 10000) / 10000,
direction: lonLat[1] > 0 ? 'N' : 'S'
}
};
default:
//this does not work
// var coords = point.getCoordinates();
// var sourceUnits = srcProj.getUnits();
// return {
// lon: {
// value: Math.round(this._convert(coords[0], sourceUnits, destUnits) * 1000) / 1000,
// direction: sourceUnits + ' Easting'
// }, lat: {
// value: Math.round(this._convert(coords[0], sourceUnits, destUnits) * 1000) / 1000,
// direction: sourceUnits + ' Northing'
// }
// };
}
},
function translateToOpenlayersCoordinate(coord) {
return ol.proj.transform(
[Number(coord[0]), Number(coord[1])],
'EPSG:4326',
properties.projection
)
}
.directive( directiveName, [ function() {
return {
scope: {
latLon: `=${directiveName}`
},
link( scope, element ) {
const view = new ol.View( {
center: ol.proj.transform( [ 6.0838618, 50.776351 ], 'EPSG:4326', 'EPSG:3857' ),
zoom: 13
} );
new ol.Map( {
target: element[ 0 ],
layers: [
new ol.layer.Tile( {
source: new ol.source.OSM()
} )
],
view
} );
scope.$watch( 'latLon', latLon => {
if( latLon && latLon.lat && latLon.lon ) {
view.setCenter( ol.proj.transform( [
parseFloat( latLon.lon ),
parseFloat( latLon.lat )
], 'EPSG:4326', 'EPSG:3857' ) );
view.setZoom( 13 );
}
}, true );
}
};
} ] ).name;
create: (options, map) => {
const urls = getWMSURLs(isArray(options.url) ? options.url : [options.url]);
const queryParameters = wmsToOpenlayersOptions(options) || {};
urls.forEach(url => SecurityUtils.addAuthenticationParameter(url, queryParameters));
if (options.singleTile) {
return new ol.layer.Image({
opacity: options.opacity !== undefined ? options.opacity : 1,
visible: options.visibility !== false,
zIndex: options.zIndex,
source: new ol.source.ImageWMS({
url: urls[0],
params: queryParameters
})
});
}
const mapSrs = map && map.getView() && map.getView().getProjection() && map.getView().getProjection().getCode() || 'EPSG:3857';
const extent = ol.proj.get(CoordinatesUtils.normalizeSRS(options.srs || mapSrs, options.allowedSRS)).getExtent();
return new ol.layer.Tile({
opacity: options.opacity !== undefined ? options.opacity : 1,
visible: options.visibility !== false,
zIndex: options.zIndex,
source: new ol.source.TileWMS(objectAssign({
urls: urls,
params: queryParameters,
tileGrid: new ol.tilegrid.TileGrid({
extent: extent,
resolutions: mapUtils.getResolutions(),
tileSize: options.tileSize ? options.tileSize : 256,
origin: options.origin ? options.origin : [extent[0], extent[1]]
})
}, (options.forceProxy) ? {tileLoadFunction: proxyTileLoadFunction} : {}))
});
},
var onSelectAddress = function(lat, lng){
if (window.console) console.log("TheApp.onSelectAddress()", "latitude", lat, "longitude", lng);
map.addInteraction(select_);
//map.addInteraction(modify_);
var coord = ol.proj.transform([lng, lat], 'EPSG:4326', 'EPSG:3857');
if (window.console) console.log("TheApp.onSelectAddress()", "coordinate", coord);
var thePoint = new ol.geom.Point(coord);
var feature = new ol.Feature();
feature.setId('feature'+featureid++);
feature.setGeometryName(config.geoavalanche.geometryName);
feature.setGeometry(thePoint);
if (window.console) {
console.log(formatWKT.writeFeature(feature));
console.log(formatWKT.writeGeometry(feature.getGeometry()));
console.log(formatGeoJSON.writeFeature(feature));
console.log(formatGeoJSON.writeGeometry(feature.getGeometry()));
}
var theFeature = JSON.parse(formatGeoJSON.writeFeature(feature));
if (theFeature.properties === null) {
delete theFeature.properties;
}
var theColl = {type: "FeatureCollection", features: [theFeature]};
if (window.console) console.log(JSON.stringify(theColl));
var datawps_ = datawps.replace("XXXX", JSON.stringify(theColl));
if (window.console) console.log('POST', config.geoavalanche.urlwps);
document.getElementById('map').style.cursor = 'wait';
$.ajax({
type: "POST",
url: config.geoavalanche.urlwps,
data: datawps_,
contentType: 'text/xml',
beforeSend: function (xhr) {
xhr.setRequestHeader('Authorization', 'Basic ' + btoa('admin:geoserver'));
},
success: function(data) {
document.getElementById('map').style.cursor = 'default';
if (window.console) console.log('success()');
var newfeatures = formatWFS.readFeatures(data, {dataProjection:'EPSG:4326', featureProjection:'EPSG:3857'});
if (window.console) console.log(newfeatures);
vectorSource.addFeatures(newfeatures);
//saveFeatures(newfeatures);
map.getView().fit(vector.getSource().getExtent(), map.getSize());
},
error: function(xhr, desc, err) {
document.getElementById('map').style.cursor = 'default';
if (window.console) console.log('error()', xhr, desc, err);
},
context: this
});
if (window.console) console.log("TheApp.onSelectAddress() ... done");
};
_.each(setArr, function(item) {
coords.push(
ol.proj.transform(
[item[0], item[1]],
'EPSG:4326',
properties.projection
)
)
})
const SI = opts => {
const imageExtent =
opts.imageExtent || ol.proj.get(properties.projection).getExtent()
return createTile(
{ ...opts, imageExtent, ...opts.parameters },
ol.source.ImageStatic,
ol.layer.Image
)
}
scope.$watch( 'latLon', latLon => {
if( latLon && latLon.lat && latLon.lon ) {
view.setCenter( ol.proj.transform( [
parseFloat( latLon.lon ),
parseFloat( latLon.lat )
], 'EPSG:4326', 'EPSG:3857' ) );
view.setZoom( 13 );
}
}, true );
panToRectangle: function(rectangle) {
var zoom = Openlayers.animation.zoom({
duration: 250,
resolution: map.getView().getResolution()
});
var northWest = Openlayers.proj.transform([rectangle.west, rectangle.north], 'EPSG:4326', properties.projection);
var southEast = Openlayers.proj.transform([rectangle.east, rectangle.south], 'EPSG:4326', properties.projection);
var coords = [];
coords.push(northWest[0]);
coords.push(southEast[1]);
coords.push(southEast[0]);
coords.push(northWest[1]);
var pan1 = Openlayers.animation.pan({
duration: 250,
source: map.getView().getCenter()
});
map.beforeRender(pan1);
map.getView().setCenter(coords);
},
getCircleFromModel: function(model) {
var ep = ol.proj.transform(
[model.get("end_latlng")[1], model.get("end_latlng")[0]],
'EPSG:4326', 'EPSG:3857');
console.log(ep);
return new ol.Feature({
geometry: new ol.geom.Circle(ep, 300000),
name: 'Circle'
});
}
setModelFromGeometry: function(geometry) {
const extent = geometry.getExtent()
const northWest = ol.proj.transform(
[extent[0], extent[3]],
properties.projection,
'EPSG:4326'
)
const southEast = ol.proj.transform(
[extent[2], extent[1]],
properties.projection,
'EPSG:4326'
)
this.model.set({
north: DistanceUtils.coordinateRound(northWest[1]),
south: DistanceUtils.coordinateRound(southEast[1]),
west: DistanceUtils.coordinateRound(northWest[0]),
east: DistanceUtils.coordinateRound(southEast[0]),
})
},
setModelFromGeometry: function(geometry) {
var extent = geometry.getExtent()
var northWest = ol.proj.transform(
[extent[0], extent[3]],
properties.projection,
'EPSG:4326'
)
var southEast = ol.proj.transform(
[extent[2], extent[1]],
properties.projection,
'EPSG:4326'
)
this.model.set({
north: northWest[1],
south: southEast[1],
west: northWest[0],
east: southEast[0],
})
},
getLength: function getLength(line, sourceProj, destUnits, useGeodisic) {
//used for transforming measurements to geodisic
var wgs84Sphere = new ol.Sphere(6378137);
var length;
if (useGeodisic !== false) {
var coordinates = line.getCoordinates();
length = 0;
for (var i = 0, ii = coordinates.length - 1; i < ii; ++i) {
var c1 = ol.proj.transform(coordinates[i], sourceProj, 'EPSG:4326');
var c2 = ol.proj.transform(coordinates[i + 1], sourceProj, 'EPSG:4326');
length += wgs84Sphere.haversineDistance(c1, c2);
}
} else {
length = line.getLength();
}
var sourceUnits = sourceProj.getUnits();
if (sourceUnits === destUnits) {
return length;
}
return this._convert(length, sourceUnits, destUnits);
},
_.each(coords, function(item) {
if (item[0].constructor === Array) {
coordinates.push(translateToOpenlayersCoordinates(item))
} else {
coordinates.push(
ol.proj.transform(
[item[0], item[1]],
'EPSG:4326',
properties.projection
)
)
}
})
_.each(coords, function(point) {
point = ol.proj.transform(
[point[0], point[1]],
properties.projection,
'EPSG:4326'
)
if (point[1] > 90) {
point[1] = 89.9
} else if (point[1] < -90) {
point[1] = -89.9
}
coordinates.push(point)
})
_.each(coords, function(point) {
point = ol.proj.transform(
[
DistanceUtils.coordinateRound(point[0]),
DistanceUtils.coordinateRound(point[1]),
],
properties.projection,
'EPSG:4326'
)
if (point[1] > 90) {
point[1] = 89.9
} else if (point[1] < -90) {
point[1] = -89.9
}
coordinates.push(point)
})
value.map(point => {
const mappedPoint = ol.proj.transform(
[
DistanceUtils.coordinateRound(point[0]),
DistanceUtils.coordinateRound(point[1]),
],
properties.projection,
'EPSG:4326'
)
if (mappedPoint[1] > 90) {
mappedPoint[1] = 89.9
} else if (mappedPoint[1] < -90) {
mappedPoint[1] = -89.9
}
return mappedPoint
})
exports.setMapLocation = function (coords, mapCount) {
console.log(coords);
lonLat = [coords.lon, coords.lat]
var webMercator = ol.proj.fromLonLat(lonLat);
console.log(webMercator);
map = new ol.Map({
target: 'map' + mapCount,
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
view: new ol.View({
center: webMercator,
zoom: 5
})
});
return map;
}
overlayImage: function(model) {
var metacardId = model.get('properties').get('id');
this.removeOverlay(metacardId);
var coords = model.get('geometry').getPolygon();
var array = _.map(coords, function(coord) {
return Openlayers.proj.transform([coord.longitude, coord.latitude], 'EPSG:4326', properties.projection);
});
var polygon = new Openlayers.geom.Polygon([array]);
var extent = polygon.getExtent();
var projection = Openlayers.proj.get(properties.projection);
var overlayLayer = new Openlayers.layer.Image({
source: new Openlayers.source.ImageStatic({
url: model.get('currentOverlayUrl'),
projection: projection,
imageExtent: extent
})
});
map.addLayer(overlayLayer);
overlays[metacardId] = overlayLayer;
},
overlayImage: function(model) {
const metacardId = model.get('properties').get('id')
this.removeOverlay(metacardId)
const coords = model.getPoints('location')
const array = _.map(coords, function(coord) {
return convertPointCoordinate(coord)
})
const polygon = new Openlayers.geom.Polygon([array])
const extent = polygon.getExtent()
const projection = Openlayers.proj.get(properties.projection)
const overlayLayer = new Openlayers.layer.Image({
source: new Openlayers.source.ImageStatic({
url: model.get('currentOverlayUrl'),
projection: projection,
imageExtent: extent,
}),
})
map.addLayer(overlayLayer)
overlays[metacardId] = overlayLayer
},
overlayImage: function(model) {
var metacardId = model.get('properties').get('id');
this.removeOverlay(metacardId);
var coords = model.getPoints('location');
var array = _.map(coords, function(coord) {
return convertPointCoordinate(coord);
});
var polygon = new Openlayers.geom.Polygon([array]);
var extent = polygon.getExtent();
var projection = Openlayers.proj.get(properties.projection);
var overlayLayer = new Openlayers.layer.Image({
source: new Openlayers.source.ImageStatic({
url: model.get('currentOverlayUrl'),
projection: projection,
imageExtent: extent
})
});
map.addLayer(overlayLayer);
overlays[metacardId] = overlayLayer;
},
function convertExtent(extent) {
return Openlayers.proj.transform(extent, 'EPSG:4326', properties.projection);
}
function convertPointCoordinate(point) {
var coords = [point[0], point[1]];
return Openlayers.proj.transform(coords, 'EPSG:4326', properties.projection);
}
style: htmlSafe(tag`width: ${'width'}; height: ${'height'}; position: relative`),
init() {
this._super(...arguments);
window.flightMap = this;
let interactions = ol.interaction.defaults({
altShiftDragRotate: false,
pinchRotate: false,
});
let map = new ol.Map({
view: new ol.View({
center: ol.proj.transform([10, 50], 'EPSG:4326', 'EPSG:3857'),
maxZoom: 17,
zoom: 5,
}),
controls: ol.control.defaults().extend([
new ol.control.ScaleLine(),
]),
interactions,
ol3Logo: false,
});
this.set('map', map);
map.getViewport().setAttribute('tabindex', '0');
$(map.getViewport()).click(function() {
$(this).focus();
});
function unconvertPointCoordinate(point) {
return Openlayers.proj.transform(point, properties.projection, 'EPSG:4326');
}
position: safeComputed('coordinate', coordinate => {
let lonlat = ol.proj.transform(coordinate, 'EPSG:3857', 'EPSG:4326');
return Cesium.Cartesian3.fromDegrees(lonlat[0], lonlat[1], lonlat[2]);
}),