Skip to content

Commit

Permalink
restore zooming out feature
Browse files Browse the repository at this point in the history
  • Loading branch information
@bmatthieu3
bmatthieu3 committed Oct 10, 2024
1 parent 278bba0 commit d196fec
Show file tree
Hide file tree
Showing 12 changed files with 94 additions and 80 deletions.
7 changes: 4 additions & 3 deletions examples/al-adass2022.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,9 @@
import A from '../src/js/A.js';
let aladin;
A.init.then(() => {
aladin = A.aladin('#aladin-lite-div', {showSettingsControl: true, survey: "P/PanSTARRS/DR1/color-z-zg-g", showReticle: false, projection: "AIT", cooFrame: 'icrs', target: "stephan's quintet", fov: 1000, showGotoControl: false, showFrame: false, fullScreen: true, showLayersControl: true, showCooGridControl: false});
aladin.showHealpixGrid(true);
let startFov = 1000;
aladin = A.aladin('#aladin-lite-div', {showSettingsControl: true, survey: "P/PanSTARRS/DR1/color-z-zg-g", showReticle: false, projection: "AIT", cooFrame: 'icrs', target: "stephan's quintet", fov: startFov, showGotoControl: false, showFrame: false, fullScreen: true, showLayersControl: true, showCooGridControl: false});

const chft = aladin.createImageSurvey('CFHT', "CFHT deep view of NGC7331 and Stephan's quintet u+g+r", "https://cds.unistra.fr/~derriere/PR_HiPS/2022_Duc/", null, null, {imgFormat: 'png'});
const nircamJWST = aladin.createImageSurvey('Nircam', "Stephans Quintet NIRCam+MIRI", "http://alasky.cds.unistra.fr/JWST/CDS_P_JWST_Stephans-Quintet_NIRCam+MIRI/", null, null, {imgFormat: 'png', colormap: "viridis"});

Expand All @@ -21,7 +22,7 @@
aladin.getOverlayImageLayer("CFHT").toggle();
aladin.getOverlayImageLayer("Nircam").toggle();

let fov = 360;
let fov = startFov;
let rotation = 0;

setInterval(function zoom() {
Expand Down
6 changes: 3 additions & 3 deletions src/core/src/app.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -902,12 +902,12 @@ impl App {
//let fbo_view = &self.fbo_view;
//catalogs.draw(&gl, shaders, camera, colormaps, fbo_view)?;
//catalogs.draw(&gl, shaders, camera, colormaps, None, self.projection)?;
gl.blend_func_separate(
/*gl.blend_func_separate(
WebGl2RenderingContext::SRC_ALPHA,
WebGl2RenderingContext::ONE,
WebGl2RenderingContext::ONE,
WebGl2RenderingContext::ONE,
);
);*/
moc.draw(camera, projection, shaders)?;

gl.blend_func_separate(
Expand Down Expand Up @@ -1399,7 +1399,7 @@ impl App {
}

pub(crate) fn set_grid_cfg(&mut self, cfg: GridCfg) -> Result<(), JsValue> {
self.grid.set_cfg(cfg, &self.camera, &self.projection)?;
self.grid.set_cfg(cfg)?;
self.request_redraw = true;

Ok(())
Expand Down
51 changes: 32 additions & 19 deletions src/core/src/camera/viewport.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -337,7 +337,7 @@ impl CameraViewPort {
self.last_user_action
};

let _can_unzoom_more = match proj {
let can_unzoom_more = match proj {
ProjectionType::Tan(_)
| ProjectionType::Mer(_)
//| ProjectionType::Air(_)
Expand All @@ -351,32 +351,45 @@ impl CameraViewPort {

let aperture_start: Angle<f64> = ArcDeg(proj.aperture_start()).into();

self.aperture = aperture.min(aperture_start);
// Compute the new clip zoom factor
let a = aperture.abs();

let v0 = math::lonlat::radec_to_xyzw(-a / 2.0, Angle(0.0));
let v1 = math::lonlat::radec_to_xyzw(a / 2.0, Angle(0.0));

// Vertex in the WCS of the FOV
self.clip_zoom_factor = if self.width < self.height {
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
self.clip_zoom_factor = if aperture > aperture_start {
//al_core::log(&format!("a: {:?}, as: {:?}", aperture, aperture_start));
if can_unzoom_more {
aperture.0 / aperture_start.0
} else {
1.0
}
} else {
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
// Compute the new clip zoom factor
let a = aperture.abs();

let v0 = math::lonlat::radec_to_xyzw(-a / 2.0, Angle(0.0));
let v1 = math::lonlat::radec_to_xyzw(a / 2.0, Angle(0.0));

// Vertex in the WCS of the FOV
if self.width < self.height {
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
} else {
1.0
}
} else {
1.0
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
} else {
1.0
}
}
};

self.aperture = aperture.min(aperture_start);
//self.aperture = aperture;

//al_core::log(&format!("zoom factor {:?}", self.clip_zoom_factor));

//console_log(&format!("clip factor {:?}", self.aperture));

// Project this vertex into the screen
Expand Down
2 changes: 0 additions & 2 deletions src/core/src/lib.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -505,11 +505,9 @@ impl WebClient {
/// * `fov` - The field of view in degrees
#[wasm_bindgen(js_name = setFieldOfView)]
pub fn set_fov(&mut self, fov: f64) -> Result<(), JsValue> {
//let fov = fov as f32;
let fov = ArcDeg(fov).into();

self.app.set_fov(fov);
//self.projection.set_fov(&mut self.app, ArcDeg(fov).into());

Ok(())
}
Expand Down
11 changes: 1 addition & 10 deletions src/core/src/renderable/grid/mod.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,12 +114,7 @@ impl ProjetedGrid {
Ok(grid)
}

pub fn set_cfg(
&mut self,
new_cfg: GridCfg,
_camera: &CameraViewPort,
_projection: &ProjectionType,
) -> Result<(), JsValue> {
pub fn set_cfg(&mut self, new_cfg: GridCfg) -> Result<(), JsValue> {
let GridCfg {
color,
opacity,
Expand Down Expand Up @@ -165,10 +160,6 @@ impl ProjetedGrid {

if let Some(enabled) = enabled {
self.enabled = enabled;

/*if !self.enabled {
self.text_renderer.clear_text_canvas();
}*/
}

Ok(())
Expand Down
8 changes: 3 additions & 5 deletions src/js/DefaultActionsForContextMenu.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -229,12 +229,10 @@ export let DefaultActionsForContextMenu = (function () {
},
{
label: "HiPS2FITS cutout", action(o) {
let hips2fitsUrl = 'https://alasky.cds.unistra.fr/hips-image-services/hips2fits#';
let radec = a.getRaDec();
let fov = Math.max.apply(null, a.getFov());
let hips2fitsUrl = 'https://alasky.cds.unistra.fr/hips-image-services/hips2fits?';
let hipsId = a.getBaseImageLayer().id;
let proj = a.getProjectionName();
hips2fitsUrl += 'ra=' + radec[0] + '&dec=' + radec[1] + '&fov=' + fov + '&projection=' + proj + '&hips=' + encodeURIComponent(hipsId);
let wcs = JSON.stringify(a.getViewWCS());
hips2fitsUrl += 'wcs=' + encodeURIComponent(wcs) + '&hips=' + encodeURIComponent(hipsId);
window.open(hips2fitsUrl, '_blank');
}
},
Expand Down
8 changes: 4 additions & 4 deletions src/js/ProjectionEnum.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,9 @@ export let ProjectionEnum = {
// Zenithal
TAN: {id: 1, fov: 150, label: "Tangential"}, /* Gnomonic projection */
STG: {id: 2, fov: 240, label: "Stereographic"}, /* Stereographic projection */
SIN: {id: 3, fov: 180, label: "Spheric"}, /* Orthographic */
SIN: {id: 3, fov: 1000, label: "Spheric"}, /* Orthographic */
// TODO: fix why the projection disappears at fov = 360.0
ZEA: {id: 4, fov: 359.999, label: "Zenital equal-area"}, /* Equal-area */
ZEA: {id: 4, fov: 1000, label: "Zenital equal-area"}, /* Equal-area */
//FEYE: {id: 5, fov: 190, label: "fish eye"},
//AIR: {id: 6, fov: 360, label: "airy"},
//AZP: {fov: 180},
Expand All @@ -45,10 +45,10 @@ export let ProjectionEnum = {
//CEA: {id: 11, fov: 360, label: "cylindrical equal area"},
//CYP: {id: 12, fov: 360, label: "cylindrical perspective"},
// Pseudo-cylindrical
AIT: {id: 13, fov: 360, label: "Hammer-Aïtoff"},
AIT: {id: 13, fov: 1000, label: "Hammer-Aïtoff"},
//PAR: {id: 14, fov: 360, label: "parabolic"},
//SFL: {id: 15, fov: 360, label: "sanson-flamsteed"},
MOL: {id: 16, fov: 360, label: "Mollweide"},
MOL: {id: 16, fov: 1000, label: "Mollweide"},
// Conic
//COD: {id: 17, fov: 360, label: "conic equidistant"},
// Hybrid
Expand Down
40 changes: 28 additions & 12 deletions src/js/View.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,9 @@ export let View = (function () {
// MOCs
this.mocs = [];

this.outsideFov = 0;
this.outside = false;

self.redrawClbk = this.redraw.bind(this);
// Init the WebGL context
// At this point, the view has been created so the image canvas too
Expand Down Expand Up @@ -195,8 +198,7 @@ export let View = (function () {
this.setProjection(projName)

// Then set the zoom properly once the projection is defined
this.wasm.setFieldOfView(initialFov);
this.updateZoomState();
this.setZoom(initialFov)

// Target position settings
this.viewCenter = { lon, lat }; // position of center of view
Expand Down Expand Up @@ -398,6 +400,7 @@ export let View = (function () {
this.imageCtx.canvas.style.width = this.width + "px";
this.imageCtx.canvas.style.height = this.height + "px";
this.wasm.resize(this.width, this.height);
this.setZoom(this.fov)

pixelateCanvasContext(this.imageCtx, this.aladin.options.pixelateCanvas);

Expand Down Expand Up @@ -1207,7 +1210,6 @@ export let View = (function () {

if (isTouchPad) {
if (!view.throttledTouchPadZoom) {
//let radec;
view.throttledTouchPadZoom = () => {
/*if (!view.zoom.isZooming && !view.wheelTriggered) {
// start zooming detected
Expand All @@ -1217,7 +1219,9 @@ export let View = (function () {
const factor = 2.0;
let newFov = view.delta > 0 ? view.fov * factor : view.fov / factor;

// inside case
view.zoom.apply({
//start: view.zoom.fov,
stop: newFov,
duration: 100
});
Expand All @@ -1233,6 +1237,7 @@ export let View = (function () {
// standard mouse wheel zooming

view.zoom.apply({
//start: view.zoom.fov,
stop: newFov,
duration: 300
});
Expand Down Expand Up @@ -1588,7 +1593,7 @@ export let View = (function () {
}

this.wasm.setFieldOfView(fov);
this.updateZoomState();
this.updateZoomState(fov);
};

View.prototype.increaseZoom = function () {
Expand All @@ -1613,9 +1618,7 @@ export let View = (function () {
this.gridCfg = {...this.gridCfg, ...options};
this.wasm.setGridOptions(this.gridCfg);

if (!this.gridCfg.enabled) {
this.mustClearCatalog = true;
}
this.mustClearCatalog = true;

ALEvent.COO_GRID_UPDATED.dispatchedTo(this.aladinDiv, this.gridCfg);

Expand All @@ -1626,12 +1629,24 @@ export let View = (function () {
return this.gridCfg;
}

View.prototype.updateZoomState = function () {
View.prototype.updateZoomState = function (fov) {
// Get the new zoom values from the backend
let fov = this.wasm.getFieldOfView();
const newFov = fov || this.wasm.getFieldOfView()

// Disable the coo grid labels if we are too unzoomed
const maxFovGridLabels = 360;
if (this.fov <= maxFovGridLabels && newFov > maxFovGridLabels) {
let gridOptions = this.getGridOptions()
if (gridOptions) {
this.originalShowLabels = gridOptions.showLabels;
this.aladin.setCooGrid({showLabels: false});
}

} else if (this.fov > maxFovGridLabels && newFov <= maxFovGridLabels) {
this.aladin.setCooGrid({showLabels:this.originalShowLabels});
}

// Save it
this.fov = fov;
this.fov = newFov;
this.computeNorder();

let fovX = this.fov;
Expand Down Expand Up @@ -1942,7 +1957,8 @@ export let View = (function () {

// Change the projection here
this.wasm.setProjection(projName);
this.updateZoomState();
let newProjFov = Math.min(this.fov, this.projection.fov);
this.setZoom(newProjFov)

const projFn = this.aladin.callbacksByEventName['projectionChanged'];
(typeof projFn === 'function') && projFn(projName);
Expand Down
41 changes: 19 additions & 22 deletions src/js/Zoom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,8 +43,7 @@ import { requestAnimFrame } from "./libs/RequestAnimationFrame.js";
return;

// clamp the zoom to the view params minFov and maxFov and the projection bounds
finalZoom = Math.min(finalZoom, this.view.projection.fov);

//finalZoom = Math.min(finalZoom, this.view.projection.fov);
// then clamp the fov between minFov and maxFov
const minFoV = this.view.minFoV;
const maxFoV = this.view.maxFoV;
Expand Down Expand Up @@ -94,31 +93,29 @@ import { requestAnimFrame } from "./libs/RequestAnimationFrame.js";
let self = this;
// Recursive function to perform interpolation for each frame
function interpolateFrame() {
//fps = 1000 / self.dt;
//totalFrames = interpolationDuration * fps; // Total number of frames
self.x = ( performance.now() - self.startTime ) / interpolationDuration;
// Calculate step size for each frame
//stepSize = (desiredZoom - currentZoom) / totalFrames;
interpolatedZoom = Zoom.hermiteCubic.f(self.x, self.x1, self.x2, self.y1, self.y2, self.m1, self.m2);
// Clamp the interpolation in case it is < 0 for a time
interpolatedZoom = Math.max(0, interpolatedZoom);

// Apply zoom level to map or perform any necessary rendering
self.view.setZoom(interpolatedZoom);

self.fov = interpolatedZoom;

// Check if interpolation is complete
if (self.stop) {
self.isZooming = false;
self.stop = false;
} else if (self.x >= self.x2 || Math.abs(interpolatedZoom - self.finalZoom) < 1e-4) {
self.view.setZoom(self.finalZoom);

self.isZooming = false;
} else {
// Request the next frame
self.requestAnimID = requestAnimFrame(interpolateFrame);
self.x = ( performance.now() - self.startTime ) / interpolationDuration;
interpolatedZoom = Zoom.hermiteCubic.f(self.x, self.x1, self.x2, self.y1, self.y2, self.m1, self.m2);
// Clamp the interpolation in case it is < 0 for a time
interpolatedZoom = Math.max(0, interpolatedZoom);

// Apply zoom level to map or perform any necessary rendering
self.view.setZoom(interpolatedZoom);

self.fov = interpolatedZoom;

if (self.x >= self.x2 || Math.abs(interpolatedZoom - self.finalZoom) < 1e-4) {
self.view.setZoom(self.finalZoom);

self.isZooming = false;
} else {
// Request the next frame
self.requestAnimID = requestAnimFrame(interpolateFrame);
}
}
}

Expand Down
Binary file modified tests/run-examples.spec.ts-snapshots/GW-MOC-plot-1-chromium-darwin.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified tests/run-examples.spec.ts-snapshots/GW-MOC-plot-1-webkit-darwin.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...shots/multiple-HiPS-display-each-referenced-by-an-ID-string-1-webkit-darwin.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit d196fec

Please sign in to comment.