-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathd3-celestial.html
179 lines (155 loc) · 9.45 KB
/
d3-celestial.html
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
<!DOCTYPE html>
<html lang="en-us">
<head>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-B13NZ97YS4"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-B13NZ97YS4');
</script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="On this web page you can look at images of astronomical objects.">
<title>Space Safari</title>
<link href="https://fonts.googleapis.com/css?family=Faster+One" rel="stylesheet">
<link rel="stylesheet" href="https://unpkg.com/modern-css-reset/dist/reset.min.css" />
<!-- <script type="module" src="./scriptAstro.js"></script> -->
<script src="./d3-celestial/lib/d3.min.js"></script>
<script src="./d3-celestial/lib/d3.geo.projection.min.js"></script>
<script src="./d3-celestial/celestial.min.js"></script>
<link rel="stylesheet" href="./d3-celestial/celestial.css">
<link rel="stylesheet" href="./style-d3.css">
</head>
<body>
<div class="container">
<header>
<h1>Space Safari</h1>
<nav>
<a class="menu-button" href="./index.html">Start</a>
<a class="menu-button" href="./d3-celestial.html">Skymap</a>
</nav>
</header>
<main>
<div>
<div id="celestial-map"></div>
</div>
<div id="celestial-form"></div>
<script>
/* D3-Celestial sky map
Copyright 2015-20 Olaf Frohn https://github.com/ofrohn, see LICENSE
*/
var config = {
/* location: true, */
interactive: true,
controls: true,
projection: "equirectangular",
transform: "equatorial",
zoomlevel: 1,
zoomextend: 300,
form: true,
/* location: false, */
/* form: true,
projection: "aitoff",
center: null, */
/* center: [55.6002, 13.0094], */
/* orientationfixed: true, */
/* geopos: null, */
//follow: "zenith", //zenith
//datapath: "../space-safari-v2/data/",
datapath: "../data/",
// datapath: "https://paubel.github.io/space-safari-v2/data/",
/* adaptable: true, */
/* geopos: [55.6002, 13.0094], */
/* advanced: true, */
formFields: {
"location": false, // Set visiblity for each group of fields with the respective id
"general": true,
"stars": false,
"dsos": false,
"constellations": false,
"lines": false,
"other": false,
"download": false
},
stars: {
show: false, // Show stars
limit: 6, // Show only stars brighter than limit magnitude
colors: true, // Show stars in spectral colors, if not use "color"
style: { fill: "#ffffff", opacity: 1 }, // Default style for stars
names: false, // Show star names (Bayer, Flamsteed, Variable star, Gliese, whichever applies first)
proper: false, // Show proper name (if present)
desig: false, // Show all names, including Draper and Hipparcos
namelimit: 2.5, // Show only names for stars brighter than namelimit
namestyle: { fill: "#ddddbb", font: "11px Georgia, Times, 'Times Roman', serif", align: "left", baseline: "top" },
size: 4, // Maximum size (radius) of star circle in pixels
data: 'stars.8.json' // Data source for stellar data
//data: 'stars.8.json' // Alternative deeper data source for stellar data
},
dsos: {
show: true, // Show Deep Space Objects
limit: 1000, // Show only DSOs brighter than limit magnitude
names: true, // Show DSO names
colors: true,
namesType: "name",
desig: true, // Show short DSO names
namelimit: 15, // Show only names for DSOs brighter than namelimit
namestyle: { fill: "#cccccc", font: "11px Helvetica, Arial, serif", align: "left", baseline: "top" },
data: 'dsos.ss.json', // Data source for DSOs
//data: 'dsos.6.json' // Alternative broader data source for DSOs
//data: 'dsos.14.json' // Alternative deeper data source for DSOs
symbols: { //DSO symbol styles
gg: { shape: "circle", fill: "#ff0000" }, // Galaxy cluster
g: { shape: "ellipse", fill: "#ff0000" }, // Generic galaxy
s: { shape: "ellipse", fill: "#ff0000" }, // Spiral galaxy
s0: { shape: "ellipse", fill: "#ff0000" }, // Lenticular galaxy
sd: { shape: "ellipse", fill: "#ff0000" }, // Dwarf galaxy
e: { shape: "ellipse", fill: "#ff0000" }, // Elliptical galaxy
i: { shape: "ellipse", fill: "#ff0000" }, // Irregular galaxy
oc: { shape: "circle", fill: "#ffcc00", stroke: "#ffcc00", width: 1.5 }, // Open cluster
gc: { shape: "circle", fill: "#ff9900" }, // Globular cluster
en: { shape: "square", fill: "#ff00cc" }, // Emission nebula
bn: { shape: "square", fill: "#ff00cc", stroke: "#ff00cc", width: 2 }, // Generic bright nebula
sfr: { shape: "square", fill: "#cc00ff", stroke: "#cc00ff", width: 2 }, // Star forming region
rn: { shape: "square", fill: "#00ooff" }, // Reflection nebula
pn: { shape: "diamond", fill: "#00cccc" }, // Planetary nebula
snr: { shape: "diamond", fill: "#ff00cc" }, // Supernova remnant
dn: { shape: "square", fill: "#999999", stroke: "#999999", width: 2 }, // Dark nebula grey
pos: { shape: "marker", fill: "#cccccc", stroke: "#cccccc", width: 1.5 } // Generic marker
}
},
constellations: {
show: true, // Show constellations
names: true, // Show constellation names
namesType: "iau",
desig: false, // Show short constellation names (3 letter designations)
namestyle: { fill: "#cccc99", font: "12px Helvetica, Arial, sans-serif", align: "center", baseline: "middle" },
lines: true, // Show constellation lines
linestyle: { stroke: "#cccccc", width: 1, opacity: 0.6 },
bounds: true, // Show constellation boundaries
boundstyle: { stroke: "#cccc00", width: 0.5, opacity: 0.8, dash: [2, 4] }
},
mw: {
show: true, // Show Milky Way as filled polygons
style: { fill: "#ffffff", opacity: "0.15" }
},
lines: {
graticule: { show: false, stroke: "#cccccc", width: 0.6, opacity: 0.8 }, // Show graticule lines
equatorial: { show: false, stroke: "#aaaaaa", width: 1.3, opacity: 0.7 }, // Show equatorial plane
ecliptic: { show: false, stroke: "#66cc66", width: 1.3, opacity: 0.7 }, // Show ecliptic plane
galactic: { show: false, stroke: "#cc6666", width: 1.3, opacity: 0.7 }, // Show galactic plane
supergalactic: { show: false, stroke: "#cc66cc", width: 1.3, opacity: 0.7 } // Show supergalactic plane
}
};
Celestial.display(config);
</script>
<footer id="d3-celestial-footer">
<p><a href="https://github.com/ofrohn/d3-celestial"><b>D3-Celestial</b></a> released under <a
href="http://opensource.org/licenses/BSD-3-Clause">BSD license</a>. Copyright 2015-20 <a
href="http://armchairastronautics.blogspot.com/" rel="author">Olaf Frohn</a>.</p>
</footer>
</main>
</div>
</body>
</html>