mirror of
https://github.com/cds-astro/aladin-lite.git
synced 2025-12-12 07:40:26 -08:00
63 lines
2.1 KiB
HTML
63 lines
2.1 KiB
HTML
|
|
<!doctype html>
|
|
<html>
|
|
<head>
|
|
</head>
|
|
<body>
|
|
|
|
<script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>
|
|
|
|
|
|
Image Opacity: <br/> <input id="slider" type="range" value=1 min=0 max=1 step=0.05 ; style="width:120px;height:5px;line-height:0%">
|
|
<br/>
|
|
<br/>
|
|
<div id="aladin-lite-div" style="width:440px;height:300px"></div>
|
|
|
|
<input id="DSS" type="radio" name="survey" value="P/DSS2/Color" checked><label for="DSS">Optical (DSS2) <label>
|
|
<input id="2MASS" type="radio" name="survey" value="P/2MASS/Color"><label for="2MASS">Infrared (2MASS)<label>
|
|
|
|
<script type="module">
|
|
import A from '../src/js/A.js';
|
|
let aladin;
|
|
A.init.then(() => {
|
|
aladin = A.aladin('#aladin-lite-div', {target: "0 0", cooFrame: "gal"});
|
|
|
|
var callback = function(ra, dec, fov) {
|
|
A.catalogFromSimbad( {ra: ra, dec: dec} , 1 , {shape: 'circle', color: '#5d5', onClick: 'showTable'}, (cat) => {
|
|
aladin.addCatalog(cat)
|
|
});
|
|
// we must return true, so that the default action (set view to center of image) is performed
|
|
return true;
|
|
}
|
|
|
|
$("#slider").on('input', function() {
|
|
const opacity = $(this).val();
|
|
aladin.getOverlayImageLayer().setOpacity(opacity);
|
|
});
|
|
aladin.setBaseImageLayer('P/Mellinger/color');
|
|
|
|
//let fits = aladin.displayFITS('http://goldmine.mib.infn.it/data//B/fits/A04_VC1316_ooooog.fits', 'overlay');
|
|
let jpg = aladin.displayJPG(
|
|
// the JPG to transform to HiPS
|
|
'https://noirlab.edu/public/media/archives/images/large/noirlab1912a.jpg',
|
|
// no options
|
|
{
|
|
transparency: 1.0,
|
|
},
|
|
// A callback fn once the overlay is set
|
|
callback
|
|
);
|
|
|
|
$('input[name=survey]').change(function() {
|
|
let surveyName = $(this).val();
|
|
if (surveyName === "P/2MASS/Color") {
|
|
aladin.setBaseImageLayer("CDS/P/2MASS/color");
|
|
} else if (surveyName === "P/DSS2/Color") {
|
|
aladin.setBaseImageLayer("CDS/P/DSS2/color");
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|