114 lines
3.5 KiB
JavaScript
114 lines
3.5 KiB
JavaScript
import { Control } from "./Control";
|
|
import * as dom from '../core/domUtil';
|
|
import { Vector3 } from 'three/src/math/Vector3';
|
|
import proj4 from 'proj4/dist/proj4';
|
|
import * as util from '../core/utilities';
|
|
import { PerspectiveCamera } from 'three/src/cameras/PerspectiveCamera';
|
|
|
|
import './Coordinates.css';
|
|
|
|
export class Coordinates extends Control {
|
|
|
|
options = {
|
|
position: 'bottomright',
|
|
separator: ' : ',
|
|
emptyString: 'Unavailable',
|
|
lngFirst: false,
|
|
numDigits: 5,
|
|
lngFormatter: undefined,
|
|
latFormatter: undefined,
|
|
prefix: "",
|
|
camera: new PerspectiveCamera()
|
|
};
|
|
map;
|
|
visible = false;
|
|
|
|
constructor(options) {
|
|
super(options);
|
|
|
|
util.setOptions(this, options);
|
|
}
|
|
// get options() {
|
|
// return this.#options;
|
|
// }
|
|
|
|
// set options(defaults) {
|
|
// this.#options = util.extend(this.#options, defaults);
|
|
// }
|
|
// set options(defaults) {
|
|
// this.#options = defaults;
|
|
// }
|
|
|
|
onAdd(map) {
|
|
proj4.defs("EPSG:3034", "+proj=lcc +lat_1=35 +lat_2=65 +lat_0=52 +lon_0=10 +x_0=4000000 +y_0=2800000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs");
|
|
|
|
this.map = map;
|
|
let container = this._container = dom.createDom("div", { "class": "gba-control-coordinates" });
|
|
this.visible = false;
|
|
map.addListener('mouse-move', this._onMouseMove, this);
|
|
return container;
|
|
}
|
|
|
|
onRemove(map) {
|
|
map.removeListener('mouse-move', this._onMouseMove, this);
|
|
}
|
|
|
|
_onMouseMove(event) {
|
|
let canvasOffset = this._getOffset(this.map.domElement);
|
|
let xClickedOnCanvas = event.clientX - canvasOffset.left;
|
|
let yClickedonCanvas = event.clientY - canvasOffset.top;
|
|
let width = this._map.domElement.clientWidth;
|
|
let height = this._map.domElement.clientHeight;
|
|
|
|
let x = (xClickedOnCanvas / width) * 2 - 1;
|
|
let y = -(yClickedonCanvas / height) * 2 + 1;
|
|
let mouse = new Vector3(x, y);
|
|
mouse.unproject(this.options.camera);
|
|
// vector.sub(this.options.camera.position);
|
|
// vector.normalize();
|
|
this.emit('onPoint', mouse);
|
|
|
|
let dest = new proj4.Proj("EPSG:4326");
|
|
let source = new proj4.Proj("EPSG:3034");
|
|
let point84 = proj4.transform(source, dest, mouse);
|
|
let koordx = this._dec2sex(point84.x, 'X');
|
|
let koordy = this._dec2sex(point84.y, 'y');
|
|
this._container.innerHTML = "LON: " + koordx + ", " + "LAT: " + koordy;
|
|
}
|
|
|
|
_getOffset(element) {
|
|
if (!element.getClientRects().length) {
|
|
return { top: 0, left: 0 };
|
|
}
|
|
|
|
let rect = element.getBoundingClientRect();
|
|
let win = element.ownerDocument.defaultView;
|
|
return (
|
|
{
|
|
top: rect.top + win.pageYOffset,
|
|
left: rect.left + win.pageXOffset
|
|
});
|
|
}
|
|
|
|
_dec2sex(dec, dir) {
|
|
let plus = Math.abs(dec);
|
|
let degr = Math.floor(plus);
|
|
let minu = Math.floor(60 * (plus - degr));
|
|
let sec = Math.floor(60 * (60 * (plus - degr) - minu));
|
|
let compass = "?";
|
|
if (minu < 10) {
|
|
minu = "0" + minu.toString();;
|
|
}
|
|
if (sec < 10) {
|
|
sec = "0" + sec.toString();
|
|
}
|
|
if (dir === 'y') {
|
|
compass = dec < 0 ? "S" : "N";
|
|
}
|
|
else {
|
|
compass = dec < 0 ? "W" : "E";
|
|
}
|
|
return "" + degr + "° " + minu + "' " + sec + '" ' + compass;
|
|
}
|
|
|
|
}
|