weyne/DCSOlympus
1
0
Fork 0
mirror of https://github.com/Pax1601/DCSOlympus.git synced 2025-10-29 16:56:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added code for map creation and camera control

Browse Source
This commit is contained in:
Pax1601
2024-02-22 08:01:13 +01:00
parent 3c9af59051
commit 14679bd7d8
6 changed files with 164 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/website/src/constants/constants.ts
View File

@@ -190,6 +190,12 @@ export const mapLayers = {
minZoom: 1,
maxZoom: 20,
attribution: '<a href="https://github.com/cyclosm/cyclosm-cartocss-style/releases" title="CyclOSM - Open Bicycle render">CyclOSM</a> | Map data: &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
},
"DCS": {
urlTemplate: 'http://localhost:3000/maps/dcs/{z}/{x}/{y}.png',
minZoom: 16,
maxZoom: 16,
attribution: 'Eagle Dynamics'
}
}

26
frontend/website/src/map/map.ts
View File

@@ -7,7 +7,7 @@ import { AirbaseContextMenu } from "../contextmenus/airbasecontextmenu";
import { Dropdown } from "../controls/dropdown";
import { Airbase } from "../mission/airbase";
import { Unit } from "../unit/unit";
import { bearing, createCheckboxOption, polyContains } from "../other/utils";
import { bearing, createCheckboxOption, deg2rad, getGroundElevation, polyContains } from "../other/utils";
import { DestinationPreviewMarker } from "./markers/destinationpreviewmarker";
import { TemporaryUnitMarker } from "./markers/temporaryunitmarker";
import { ClickableMiniMap } from "./clickableminimap";
@@ -157,6 +157,7 @@ export class Map extends L.Map {
this.on('drag', (e: any) => this.#onMouseMove(e));
this.on('keydown', (e: any) => this.#onKeyDown(e));
this.on('keyup', (e: any) => this.#onKeyUp(e));
this.on('move', (e: any) => this.#broadcastPosition(e));
/* Event listeners */
document.addEventListener("toggleCoalitionVisibility", (ev: CustomEventInit) => {
@@ -704,6 +705,29 @@ export class Map extends L.Map {
this.#isZooming = false;
}
#broadcastPosition(e: any) {
getGroundElevation(this.getCenter(), (response: string) => {
var groundElevation: number | null = null;
try {
groundElevation = parseFloat(response);
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("PUT", "http://localhost:8080");
xmlHttp.setRequestHeader("Content-Type", "application/json");
const C = 40075016.686;
let mpp = C * Math.cos(deg2rad(this.getCenter().lat)) / Math.pow(2, this.getZoom() + 8);
let d = mpp * 1920;
let alt = d / 2 * 1 / Math.tan(deg2rad(40));
if (alt > 100000)
alt = 100000;
xmlHttp.send(JSON.stringify({lat: this.getCenter().lat, lng: this.getCenter().lng, alt: alt + groundElevation}));
} catch {
console.warn("broadcastPosition: could not retrieve ground elevation")
}
});
}
/* */
#panToUnit(unit: Unit) {
var unitPosition = new L.LatLng(unit.getPosition().lat, unit.getPosition().lng);