flyCartesian amplitude fix

This commit is contained in:
Aigars Zeiza 2025-07-29 10:15:20 +03:00
parent 6b14ad627b
commit 6972ca3612
3 changed files with 119 additions and 1 deletions

View File

@ -0,0 +1,67 @@
<html>
<head>
<title>Camera Fly Easing</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="./fly.js" type="module"></script>
<link rel="stylesheet" href="../../css/og.css" type="text/css" />
<style>
body {
padding: 0;
margin: 0;
}
button {
margin: 5px;
display: block;
}
</style>
</head>
<body>
<div id="earth" style="position: absolute; width: 100%; height: 100%"></div>
<div style="position: absolute; margin: 10px;">
<button id="SineIn">Sine In</button>
<button id="SineOut">Sine Out</button>
<button id="SineInOut">Sine In Out</button>
<br />
<button id="QuadIn">Quad In</button>
<button id="QuadOut">Quad Out</button>
<button id="QuadInOut">Quad In Out</button>
<br />
<button id="CubicIn">Cubic In</button>
<button id="CubicOut">Cubic Out</button>
<button id="CubicInOut">Cubic In Out</button>
<br />
<button id="QuartIn">Quart In</button>
<button id="QuartOut">Quart Out</button>
<button id="QuartInOut">Quart In Out</button>
<br />
<button id="QuintIn">Quint In</button>
<button id="QuintOut">Quint Out</button>
<button id="QuintInOut">Quint In Out</button>
<br />
<button id="Linear">Linear</button>
</div>
<div style="position: absolute; left: 150px; margin: 10px;">
<button id="ExpoIn">Expo In</button>
<button id="ExpoOut">Expo Out</button>
<button id="ExpoInOut">Expo In Out</button>
<br />
<button id="CircIn">Circ In</button>
<button id="CircOut">Circ Out</button>
<button id="CircInOut">Circ In Out</button>
<br />
<button id="BackIn">Back In</button>
<button id="BackOut">Back Out</button>
<button id="BackInOut">Back In Out</button>
<br />
<button id="ElasticIn">Elastic In</button>
<button id="ElasticOut">Elastic Out</button>
<button id="ElasticInOut">Elastic In Out</button>
<br />
<button id="BounceIn">Bounce In</button>
<button id="BounceOut">Bounce Out</button>
<button id="BounceInOut">Bounce In Out</button>
</div>
</body>
</html>

51
sandbox/cameraFly/fly.js Normal file
View File

@ -0,0 +1,51 @@
/* eslint-disable no-undef */
import {
Globe,
LonLat,
OpenStreetMap,
GlobusRgbTerrain,
Bing,
Easing
} from "../../lib/og.es.js";
const globus = new Globe({
target: "earth",
name: "Earth",
terrain: new GlobusRgbTerrain(),
layers: [new OpenStreetMap(), new Bing()],
atmosphereEnabled: false,
fontsSrc: "../../res/fonts"
});
let i = 0;
let positions = [
[new LonLat(10.13176, 46.18868, 10779), new LonLat(9.98464, 46.06157, 3039)],
[new LonLat(11, 45, 10779), new LonLat(10, 44.9, 0)],
];
const performFlight = (ease) => {
let ell = globus.planet.ellipsoid;
i++;
let destPos = positions[i % positions.length][0];
let viewPoi = positions[i % positions.length][1];
let lookCart = ell.lonLatToCartesian(viewPoi);
let upVec = ell.lonLatToCartesian(destPos).normalize();
globus.planet.camera.flyLonLat(destPos, {
look: lookCart,
up: upVec,
amplitude: 0,
ease
});
}
const buttons = document.getElementsByTagName("button");
for (let bi = 0; bi < buttons.length; bi++) {
const btn = buttons[bi];
btn.addEventListener("click", () => {
performFlight(Easing[btn.id]);
});
}
globus.planet.renderer.controls.SimpleSkyBackground.colorOne = "black";
globus.planet.renderer.controls.SimpleSkyBackground.colorTwo = "black";

View File

@ -396,7 +396,7 @@ class PlanetCamera extends Camera {
this.planet.layerLock.lock(this._keyLock);
this.planet.terrainLock.lock(this._keyLock);
this.planet.normalMapCreator.lock(this._keyLock);
params.amplitude = params.amplitude || 1.0;
params.amplitude = params.amplitude != undefined ? params.amplitude : 1.0;
params.look = params.look || Vec3.ZERO;
params.up = params.up || Vec3.NORTH;
params.duration = params.duration || DEFAULT_FLIGHT_DURATION;