DagsHub-Datasets
/
hst-dataset


  
1

	
2

	
3

	
4

	
5

	
6

	
7

	
8

	
9

	
10

	
11

	
12

	
13

	
14

	
15

	
16

	
17

	
18

	
19

	
20

	
21

	
22

	
23

	
24

	
25

	
26

	
27

	
28

	
29

	
30

	
31

	
32

	
33

	
34

	
35

	
36

	
37

	
38

	
39

	
40

	
41

	
42

	
43

	
44

	
45

	
46

	
47

	
48

	
49

	
50

	
51

	
52

	
53

	
54

	
55

	
56

	
57

	
58

	
59

	
60

	
61

	
62

	
63

	
64

	
65

	
66

	
67

	
68

	
69

	
70

	
71

	
72

	
73

	
74

	
75

	
76

	
77

	
78

	
79

	
80

	
81

	
82

	
83

	
84

	
85

	
86

	
87

	
88

	
89

	
90

	
91

	
92

	
93

	
94

	
95

	
96

	
97

	
98

	
99

	
100

	
101

	
102

	
103

	
104

	
105

	
106

	
107

	
108

	
109

	
110

	
111

	
112

	
113

	
114

	
115

	
116

	
117

	
118

	
119

	
120

	
121

	
122

	
123

	
124

	
125

	
126

	
127

	
128

	
129

	
130

	
131

	
132

	
133

	
134

	
135

	
136

	
137

	
138

	
139

	
140

	
141

	
142

	
143

	
144

	
145

	
146

	
147

	
148

	
149

	
150

	
151

	
152

	
153

	
154

	
155

	
156

	
157

	
158

	
159

	
160

	
161

	
162

	
163

	
164

	
165

	
166

	
167

	
168

	
169

	
170

	
171

	
172

	
173

	
174

	
175

	
176

	
177

	
178

	
179

	
180

	
181

	
182

	
183

	
184

	
185

	
186

	
187

	
188

	
189

	
190

	
191

	
192

	
193

	
194

	
195

	
196

	
197

	
198

	
199

	
200

	
201

	
202

	
203

	
204

	
205

	
206

	
207

	
208

	
209

	
210

	
211

	
212

	
213

	
214

	
215

	
216

	
217

	
218

	
219

	
220

	
221

	
222

	
223

	
224

	
225

	
226

	
227

	
228

	
229

	
230

	
231

	
232

	
233

	
234

	
235

	
236

	
237

	
238

	
239

	
240

	
241

	
242

	
243

	
244

	
245

	
246

	
247

	
248

	
249

	
250

	
251

	
252

	
253

	
254

	
255

	
256

	
257

	
258

	
259

	
260

	
261

	
262

	
263

	
264

	
265

	
266

	
267

	
268

	
269

	
270

	
271

	
272

	
            <!DOCTYPE html>
<html>
<head>
   <title>FitsMap</title>
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />
   <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin=""/>
    <link rel='stylesheet' href='https://unpkg.com/leaflet-search@2.9.8/dist/leaflet-search.src.css'/>
    <link rel='stylesheet' href='css/MarkerCluster.Default.css'/>
    <link rel='stylesheet' href='css/MarkerCluster.css'/>
    <link rel='stylesheet' href='css/TileNearestNeighbor.css'/>
   <script src='https://unpkg.com/leaflet@1.3.4/dist/leaflet.js' integrity='sha512-nMMmRyTVoLYqjP9hrbed9S+FzjZHW5gY1TWCHA5ckwXZBadntCNs8kEqAWdrb9O7rxbCaA4lKTIWjDXZxflOcA==' crossorigin=''></script>
   <script type='text/javascript' src='https://code.jquery.com/jquery-3.6.0.slim.min.js' charset='utf-8'></script>
    <script src='https://unpkg.com/leaflet.markercluster@1.4.1/dist/leaflet.markercluster-src.js' crossorigin=''></script>
    <script src='https://unpkg.com/leaflet-search@2.9.8/dist/leaflet-search.src.js' crossorigin=''></script>
    <script src='js/phot.cat.js'></script>
    <script src='js/l.ellipse.min.js'></script>
   <style>
       html, body {
       height: 100%;
       margin: 0;
       }
       #map {
           width: 100%;
           height: 100%;
       }
   </style>
</head>
<body>
   <div id="map"></div>
   <script>
    L.CRS.FitsMap = L.extend({}, L.CRS.Simple, {
        transformation: new L.Transformation(1/16, 0, -1/16, 256)
    });
    var j002616p0121_f606w = L.tileLayer("j002616p0121_f606w/{z}/{y}/{x}.png", { attribution:"<a href='https://github.com/ryanhausen/fitsmap'>FitsMap</a>",minZoom: 2,maxZoom: 9,maxNativeZoom: 4,});
    var j002616p0121_f814w = L.tileLayer("j002616p0121_f814w/{z}/{y}/{x}.png", { attribution:"<a href='https://github.com/ryanhausen/fitsmap'>FitsMap</a>",minZoom: 2,maxZoom: 9,maxNativeZoom: 4,});
    var j002616p0121_f110w = L.tileLayer("j002616p0121_f110w/{z}/{y}/{x}.png", { attribution:"<a href='https://github.com/ryanhausen/fitsmap'>FitsMap</a>",minZoom: 2,maxZoom: 9,maxNativeZoom: 4,});
    var j002616p0121_f140w = L.tileLayer("j002616p0121_f140w/{z}/{y}/{x}.png", { attribution:"<a href='https://github.com/ryanhausen/fitsmap'>FitsMap</a>",minZoom: 2,maxZoom: 9,maxNativeZoom: 4,});
    var j002616p0121_ir = L.tileLayer("j002616p0121_ir/{z}/{y}/{x}.png", { attribution:"<a href='https://github.com/ryanhausen/fitsmap'>FitsMap</a>",minZoom: 2,maxZoom: 9,maxNativeZoom: 4,});
    var j002616p0121_seg = L.tileLayer("j002616p0121_seg/{z}/{y}/{x}.png", { attribution:"<a href='https://github.com/ryanhausen/fitsmap'>FitsMap</a>",minZoom: 2,maxZoom: 9,maxNativeZoom: 4,});
    var j002616p0121_rgb = L.tileLayer("j002616p0121_rgb/{z}/{y}/{x}.png", { attribution:"<a href='https://github.com/ryanhausen/fitsmap'>FitsMap</a>",minZoom: 2,maxZoom: 9,maxNativeZoom: 4,});

    var map = L.map("map", {
        crs: L.CRS.FitsMap,
        zoom: 2,
        minZoom: 2,
        preferCanvas: true,
        layers: j002616p0121_rgb,
    });

    var markers = [
        L.markerClusterGroup({ }),
    ];

    var markerList = [
        [],
    ];

    var collections = [
        phot_cat_var,
    ];

    var labels = [
        'phot',
    ];

    let colors = [
        "#4C72B0",
        "#DD8452",
        "#55A868",
        "#C44E52",
        "#8172B3",
        "#937860",
        "#DA8BC3",
        "#8C8C8C",
        "#CCB974",
        "#64B5CD",
    ];

    for (i = 0; i < collections.length; i++){
        collection = collections[i];

        for (j = 0; j < collection.length; j++){
            src = collection[j];

            var width = '650px';
            var include_img = src.include_img ? 2 : 1;
            var height = '440px';

            let p = L.popup({ maxWidth: "auto" })
                     .setLatLng([src.y, src.x])
                     .setContent("<iframe src='catalog_assets/" + src.cat_path + "/" + src.catalog_id + ".html' width='" + width + "' height='" + height + "'></iframe>");

            let marker;
            if (src.a==-1){
                marker = L.circleMarker([src.y, src.x], {
                    catalog_id: labels[i] + ':' + src.catalog_id + ':',
                    color: colors[i % colors.length]
                }).bindPopup(p);
            } else {
                marker = L.ellipse([src.y, src.x], [src.a, src.b], (src.theta * (180/Math.PI) * -1), {
                    catalog_id: labels[i] + ':' + src.catalog_id + ':',
                    color: colors[i % colors.length]
                }).bindPopup(p);
            }

            markerList[i].push(marker);
        }
    }

    for (i = 0; i < collections.length; i++){
        markers[i].addLayers(markerList[i]);
    }
    var marker_layers = L.layerGroup(markers);

    function searchHelp(e) {
        map.setView(e.latlng, 4);
        e.layer.addTo(map);
    };

    var searchBar = L.control.search({
        layer: marker_layers,
        initial: false,
        propertyName: 'catalog_id',
        textPlaceholder: 'Enter catalog_id ID',
        hideMarkerOnCollapse: true,
    });

    searchBar.on('search:locationfound', searchHelp);

    searchBar.addTo(map);

    // hack for turning off markers at start. Throws exception but doesn't
    // crash page. This should be updated when I understand this library better
    for (l of markers){
        l.remove()
    }
    var baseLayers = {
        "j002616p0121_f606w": j002616p0121_f606w,
        "j002616p0121_f814w": j002616p0121_f814w,
        "j002616p0121_f110w": j002616p0121_f110w,
        "j002616p0121_f140w": j002616p0121_f140w,
        "j002616p0121_ir": j002616p0121_ir,
        "j002616p0121_seg": j002616p0121_seg,
        "j002616p0121_rgb": j002616p0121_rgb,
    };
    var overlays = {}

    for(i = 0; i < markers.length; i++) {
        overlays[labels[i]] = markers[i];
    }

    var layerControl = L.control.layers(baseLayers, overlays);
    layerControl.addTo(map);
    
    urlParam = function(name){
        // Parse parameters from window.location, 
        // e.g., .../index.html?zoom=8
        // urlParam(zoom) = 8
        var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
        if (results==null){
           return null;
        }
        else{
           return decodeURI(results[1]) || 0;
        }
    }

    pixToSky = function(xy){
        // Convert from zero-index pixel to sky coordinate assuming 
        // simple North-up WCS
        if (xy.hasOwnProperty('lng')){
            var dx = xy.lng - crpix[0] + 1;
            var dy = xy.lat - crpix[1] + 1;        
        } else {
            var dx = xy[0] - crpix[0] + 1;
            var dy = xy[1] - crpix[1] + 1;
        }
        var dra = dx * cdmatrix[0][0];
        var ddec = dy * cdmatrix[1][1];
        var ra = crval[0] + dra / Math.cos(crval[1]/180*3.14159);
        var dec = crval[1] + ddec;
        return [ra, dec];
    }

    skyToPix = function(rd){
        // Convert from sky to zero-index pixel coordinate assuming 
        // simple North-up WCS
        var dx = (rd[0] - crval[0]) * Math.cos(crval[1]/180*3.14159);
        var dy = (rd[1] - crval[1]);
        var x = crpix[0] - 1 + dx / cdmatrix[0][0];
        var y = crpix[1] - 1 + dy / cdmatrix[1][1];
        return [x,y];
    }

    skyToLatLng = function(rd){
        // Convert from sky to Leaflet.latLng coordinate assuming 
        // simple North-up WCS    
        var xy = skyToPix(rd);
        return L.latLng(xy[1], xy[0]);
    }

    setZoomFromUrl = function(map){
        // Read "zoom" from url bar
        var zoom = urlParam('zoom');
        if (zoom !== null){
            // console.log("zoom to " + zoom);
            map.setZoom(zoom);
        }
    }

    panToSky = function(rd, map){
        // Pan map to celestial coordinates
        var ll = skyToLatLng(rd)
        map.panTo(ll, map.getZoom());
        console.log("pan to: " + rd + " / ll: " + ll.lng + ',' + ll.lat);
    }

    panFromUrl = function(map){
        // Pan map based on ra/dec/[zoom] variables in location bar
        var ra = urlParam('ra');
        var dec = urlParam('dec');
        if ((ra !== null) & (dec !== null)) {
            panToSky([ra,dec], map);
        } else {
            // Pan to crval
            panToSky(crval, map);
        }
        setZoomFromUrl(map);
    }

    updateLocationBar = function(){
        var rd = pixToSky(map.getCenter());
        var params = 'ra=' + rd[0].toFixed(7);
        params += '&dec=' + rd[1].toFixed(7);
        params += '&zoom=' + map.getZoom();
        var param_url = window.location.href.split('?')[0] + '?' + params;
        window.history.pushState('', '', param_url);
    }

    clearOverlays = function(){
        if (markers !== null){
            for(i = 0; i < markers.length; i++) {
                overlays[labels[i]].remove();
                console.log('clear overlays: ' + labels[i])
            }
        }
    }

    // WCS parameters
    var crpix = [2018.0, 2016.5]; 
    var crval = [6.566492082363771, 1.341782473802276];
    var cdmatrix = [[-2.7777777777777e-05, 0.0], [0.0, 2.77777777777777e-05]];

    $( document ).ready(function() {    
        // Set pan from URL bar, if ra/dec/zoom specified
        panFromUrl(map);
        
        // Clear any catalog overlays
        clearOverlays();
        
        // Event handlers to update location bar when view changes
        map.on('moveend', updateLocationBar);
        map.on('zoomend', updateLocationBar);

    });    
    </script>
    
   </script>
</body>
</html>