for ortho, zoom on screen center only

This commit is contained in:
mige 2025-09-08 14:09:22 +04:00
parent 4427647388
commit 3adc8da7a2
3 changed files with 79 additions and 72 deletions

View File

@ -4,63 +4,48 @@
<title>OpenStreetMap Base Layer</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../../lib/og.css" type="text/css" />
<link rel="stylesheet" href="../../lib/og.css" type="text/css"/>
</head>
<body>
<div id="earth" style="width:100%;height:100%"></div>
<script type="module" id="og-sandbox-script">
import {
XYZ,
Globe,
Extent,
LonLat,
GlobusRgbTerrain,
control
} from "../../lib/og.es.js";
<div id="earth" style="width:100%;height:100%"></div>
<script type="module" id="og-sandbox-script">
import {
XYZ,
Globe,
Extent,
LonLat,
GlobusRgbTerrain,
control
} from "../../lib/og.es.js";
let osm = new XYZ("osm", {
isBaseLayer: true,
url: "http://tile.openstreetmap.org/{z}/{x}/{y}.png",
visibility: true,
attribution: 'Data @ OpenStreetMap contributors, ODbL',
maxNativeZoom: 19,
defaultTextures: [{ color: "#AAD3DF" }, { color: "#F2EFE9" }],
isSRGB: false,
shininess: 18,
specular: [0.00063, 0.00055, 0.00032],
ambient: [0.2, 0.2, 0.3],
diffuse: [0.9, 0.9, 0.7],
});
let osm = new XYZ("osm", {
isBaseLayer: true,
url: "http://tile.openstreetmap.org/{z}/{x}/{y}.png",
visibility: true,
attribution: 'Data @ OpenStreetMap contributors, ODbL',
maxNativeZoom: 19,
defaultTextures: [{color: "#AAD3DF"}, {color: "#F2EFE9"}],
isSRGB: false,
shininess: 18,
specular: [0.00063, 0.00055, 0.00032],
ambient: [0.2, 0.2, 0.3],
diffuse: [0.9, 0.9, 0.7],
});
var globus = new Globe({
target: "earth",
name: "Earth",
maxAltitude: 15000000,
terrain: new GlobusRgbTerrain(),
layers: [osm],
resourcesSrc: "../../external/og/lib/@openglobus/res",
fontsSrc: "../../external/og/lib/@openglobus/res/fonts"
});
var globus = new Globe({
target: "earth",
name: "Earth",
maxAltitude: 15000000,
terrain: new GlobusRgbTerrain(),
layers: [osm],
resourcesSrc: "../../external/og/lib/@openglobus/res",
fontsSrc: "../../external/og/lib/@openglobus/res/fonts"
});
globus.planet.viewExtent(new Extent(new LonLat(158.31010, 54.45445), new LonLat(158.55687, 54.56659)));
globus.planet.addControl(new control.DrawingSwitcher({
cornerStyle: {
color: "#0000FF",
},
centerStyle: {
color: "#00FF00",
},
outlineStyle: {
color: "#FF0000",
},
fillStyle: {
fillColor: "#00FFFF",
fillOpacity: 0.3,
},
}));
</script>
globus.planet.addControl(new control.DebugInfo());
globus.planet.addControl(new control.ToggleWireframe());
</script>
</body>
</html>

View File

@ -991,9 +991,14 @@ class Camera {
* @returns {number} - Size factor.
*/
public projectedSize(p: Vec3, r: number): number {
//
//@todo: orthographic
//
// if (this.isOrthographic) {
// const m = this.frustums[0].projectionMatrix._m;
// const orthoScale = this._height * m[5] * 0.5;
// return r * orthoScale;
// }
return Math.atan(r / this.eye.distance(p)) * this._projSizeConst;
}

View File

@ -363,31 +363,44 @@ export class MouseNavigation extends Control {
this._targetRotationPoint = null;
this._targetDragPoint = null;
let _targetZoomPoint = this._getTargetPoint(e.pos);
if (!_targetZoomPoint)
return;
let sx = e.x,
sy = e.y;
let cam = this.planet.camera;
this._targetZoomPoint = _targetZoomPoint;
this._grabbedSphere.radius = this._targetZoomPoint.length();
if (cam.isOrthographic) {
if(cam.isOrthographic) {
let zoomDist = this.renderer!.getDistanceFromPixel(e.pos)!;
//
//@todo make map coordinates under the pointer
//
sx = this.renderer!.handler.getWidth() * 0.5;
sy = this.renderer!.handler.getHeight() * 0.5;
let _targetZoomPoint = this._getTargetPoint(new Vec2(sx, sy));
if (!_targetZoomPoint) return;
this._targetZoomPoint = _targetZoomPoint;
this._grabbedSphere.radius = this._targetZoomPoint.length();
let zoomDist = this.renderer!.getDistanceFromPixel(new Vec2(sx, sy))!;
let dist = zoomDist;
let p1 = new Vec3();
let dir = cam.unproject(e.x, e.y, dist, p1);
let dir = cam.unproject(sx, sy, dist, p1);
const p0 = p1.sub(dir.scaleTo(dist));
const _targetZoomPoint = new Ray(p0, dir).hitSphere(this._grabbedSphere);
if (!_targetZoomPoint) {
return;
}
_targetZoomPoint = new Ray(p0, dir).hitSphere(this._grabbedSphere);
if (!_targetZoomPoint) return;
this._targetZoomPoint = _targetZoomPoint;
} else {
let _targetZoomPoint = this._getTargetPoint(new Vec2(sx, sy));
if (!_targetZoomPoint) return;
this._targetZoomPoint = _targetZoomPoint;
this._grabbedSphere.radius = this._targetZoomPoint.length();
}
this._curPitch = cam.getPitch();
@ -396,12 +409,12 @@ export class MouseNavigation extends Control {
if (Math.sign(e.wheelDelta) !== this._wheelDirection) {
this.vel.scale(0.3);
this._currScreenPos.set(e.x, e.y);
this._currScreenPos.set(sx, sy);
this._wheelDirection = Math.sign(e.wheelDelta);
return;
}
this._currScreenPos.set(e.x, e.y);
this._currScreenPos.set(sx, sy);
this._wheelDirection = Math.sign(e.wheelDelta);
let scale = 20;
this._velInertia = 0.83;
@ -473,7 +486,7 @@ export class MouseNavigation extends Control {
}
protected _onLHold = (e: IMouseState) => {
if (this._grabbedPoint && this.planet && e.moving) {
if (this._grabbedPoint && this.planet) {
let cam = this.planet.camera;
@ -610,8 +623,6 @@ export class MouseNavigation extends Control {
let vel_normal = this.vel.getNormal();
let velDir = Math.sign(vel_normal.dot(cam.getForward()));
cam.focusDistance = cam.getAltitude();
let d_v = this.vel.scaleTo(this.dt);
// if camera eye position under the dome of the grabbed sphere
@ -666,7 +677,13 @@ export class MouseNavigation extends Control {
// let px0 = new Ray(cam.eye, dirCurr).hitSphere(this._grabbedSphere)!;
// let px1 = new Ray(cam.eye, dirNew).hitSphere(this._grabbedSphere)!;
}
cam.checkTerrainCollision();
if (cam.isOrthographic) {
//@todo make map coordinates under the pointer
cam.focusDistance = cam.getAltitude();
}
}
}