more star info, spectral color display
This commit is contained in:
parent
30d64a2942
commit
bc569f1c16
7 changed files with 3785 additions and 3737 deletions
72
index.html
72
index.html
|
@ -20,9 +20,8 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 20rem;
|
width: 22rem;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
padding: 0 1em;
|
|
||||||
background: #3368;
|
background: #3368;
|
||||||
backdrop-filter: blur(4px);
|
backdrop-filter: blur(4px);
|
||||||
border-right: 2px solid #336;
|
border-right: 2px solid #336;
|
||||||
|
@ -32,6 +31,29 @@
|
||||||
#info.hidden {
|
#info.hidden {
|
||||||
transform: translate(-22rem, 0);
|
transform: translate(-22rem, 0);
|
||||||
}
|
}
|
||||||
|
#info > header {
|
||||||
|
position: relative;
|
||||||
|
height: 8rem;
|
||||||
|
margin: 1em 0 0 0;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
#info > header h1 {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin: 6rem 0 0 0;
|
||||||
|
text-align: center;
|
||||||
|
mix-blend-mode: difference;
|
||||||
|
}
|
||||||
|
#info > header > .title-bg {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: -50%;
|
||||||
|
width: 44rem;
|
||||||
|
height: 44rem;
|
||||||
|
border-radius: 100%;
|
||||||
|
}
|
||||||
|
#info > p {
|
||||||
|
margin: 1em;
|
||||||
|
}
|
||||||
label {
|
label {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
@ -45,6 +67,10 @@
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: opacity .2s ease;
|
transition: opacity .2s ease;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
user-select: none;
|
||||||
}
|
}
|
||||||
label.highlighted {
|
label.highlighted {
|
||||||
color: yellow;
|
color: yellow;
|
||||||
|
@ -54,11 +80,47 @@
|
||||||
opacity: .3;
|
opacity: .3;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
}
|
}
|
||||||
|
.spectral-class-o {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #dedded 50%, #3774c1 90%);
|
||||||
|
}
|
||||||
|
.spectral-class-b {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #dedded 50%, #91b3df 90%);
|
||||||
|
}
|
||||||
|
.spectral-class-a {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #dedded 50%, #c7d2e6 90%);
|
||||||
|
}
|
||||||
|
.spectral-class-f {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #dedded 50%, #edecf4 90%);
|
||||||
|
}
|
||||||
|
.spectral-class-g, .spectral-class-d {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #dedded 40%, #fbebaf 90%);
|
||||||
|
}
|
||||||
|
.spectral-class-k {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #dedded 40%, #f9cf97 90%);
|
||||||
|
}
|
||||||
|
.spectral-class-m {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #dedded 40%, #f6936b 90%);
|
||||||
|
}
|
||||||
|
.spectral-class-l, .spectral-class-t, .spectral-class-y {
|
||||||
|
background: rgb(222,221,237);
|
||||||
|
background: radial-gradient(circle, #f6936b 40%, #532d1e 90%);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="info">
|
<div id="info">
|
||||||
|
<header>
|
||||||
|
<div class="title-bg spectral-class-{{ spectral-class }}">
|
||||||
<h1>{{ name }}</h1>
|
<h1>{{ name }}</h1>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
<p>
|
<p>
|
||||||
<span>Star Type:<span>
|
<span>Star Type:<span>
|
||||||
<strong>{{ type }}</strong>
|
<strong>{{ type }}</strong>
|
||||||
|
@ -67,6 +129,12 @@
|
||||||
<span>Spectral Type:<span>
|
<span>Spectral Type:<span>
|
||||||
<strong>{{ spectral }}</strong>
|
<strong>{{ spectral }}</strong>
|
||||||
</p>
|
</p>
|
||||||
|
<p>
|
||||||
|
<span>Additional Types:<span>
|
||||||
|
<ul>
|
||||||
|
{{ all-types }}
|
||||||
|
</ul>
|
||||||
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<span>Distance:<span>
|
<span>Distance:<span>
|
||||||
<strong>{{ distance }}</strong>
|
<strong>{{ distance }}</strong>
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
1 ;* 61 Cyg B;Er*;082.3171310715589 -05.8262372280102;K7V ;3.4964
|
1 ;* 61 Cyg B;Eruptive Variable ;Rotating Variable,Eruptive Variable,High Proper Motion Star,Variable Star,High Proper Motion Star,Eruptive Variable,Double or Multiple Star,Star,Star,Infra-Red Source,X-ray Source ;082.3171310715589 -05.8262372280102;K7V ;3.4964
|
||||||
2 ;* 61 Cyg A;BY*;082.3197403091576 -05.8181041502094;K5V ;3.4965
|
2 ;* 61 Cyg A;BY Dra Variable ;Rotating Variable,BY Dra Variable,High Proper Motion Star,Variable Star,High Proper Motion Star,Eruptive Variable,Double or Multiple Star,Star,Star,Infra-Red Source,UV-emission Source,X-ray Source,X-ray Source ;082.3197403091576 -05.8181041502094;K5V ;3.4965
|
||||||
3 ;GAT 1383 ;PM*;085.6450087237446 -07.3769487234860;M5.5V ;14.5094
|
3 ;GAT 1383 ;High Proper Motion Star;High Proper Motion Star,High Proper Motion Star,High Proper Motion Star,Star,Infra-Red Source ;085.6450087237446 -07.3769487234860;M5.5V ;14.5094
|
||||||
4 ;BD+40 4631;PM*;089.4905214280362 -08.8259946066449;K8V ;19.837
|
4 ;BD+40 4631;High Proper Motion Star;High Proper Motion Star,High Proper Motion Star,Star,Star,Infra-Red Source ;089.4905214280362 -08.8259946066449;K8V ;19.837
|
||||||
5 ;V* EV Lac ;Er*;100.6067176270883 -13.0693645782006;M4.0Ve;5.0515
|
5 ;V* EV Lac ;Eruptive Variable ;High Proper Motion Star,High Proper Motion Star,Eruptive Variable,High Proper Motion Star,Double or Multiple Star,Variable Star,High Proper Motion Star,Star,Star,Infra-Red Source,Radio Source,UV-emission Source,X-ray Source,X-ray Source,X-ray Source;100.6067176270883 -13.0693645782006;M4.0Ve;5.0515
|
||||||
6 ;G 216-43 ;PM*;107.6831520259098 -14.9929080409418;M4.5 ;35.6304
|
6 ;G 216-43 ;High Proper Motion Star;High Proper Motion Star,High Proper Motion Star,Double or Multiple Star,Star,Infra-Red Source ;107.6831520259098 -14.9929080409418;M4.5 ;35.6304
|
||||||
7 ;BD+45 4378;SB*;113.6133003656408 -15.1866691700906;K7V ;17.1213
|
7 ;BD+45 4378;Spectroscopic Binary ;High Proper Motion Star,High Proper Motion Star,High Proper Motion Star,Spectroscopic Binary,Variable Star,High Proper Motion Star,Spectroscopic Binary,Double or Multiple Star,Star,Infra-Red Source ;113.6133003656408 -15.1866691700906;K7V ;17.1213
|
||||||
8 ;LP 149-14 ;PM*;114.0239531748840 -14.2146886796646;M5.0V ;19.189
|
8 ;LP 149-14 ;High Proper Motion Star;High Proper Motion Star,High Proper Motion Star,High Proper Motion Star,Star,Infra-Red Source ;114.0239531748840 -14.2146886796646;M5.0V ;19.189
|
||||||
9 ;HD 38B ;PM*;114.6501340218375 -16.3243260935338;M0.5V ;11.518
|
9 ;HD 38B ;High Proper Motion Star;High Proper Motion Star,Double or Multiple Star,High Proper Motion Star,Star,Infra-Red Source ;114.6501340218375 -16.3243260935338;M0.5V ;11.518
|
||||||
10;HD 38A ;SB*;114.6505214717521 -16.3226459980874;K6V ;11.5207
|
10;HD 38A ;Spectroscopic Binary ;High Proper Motion Star,Double or Multiple Star,Spectroscopic Binary,High Proper Motion Star,Star,Infra-Red Source ;114.6505214717521 -16.3226459980874;K6V ;11.5207
|
||||||
11;BD+44 4548;PM*;114.5559641502924 -16.3315501979801;M2Ve ;11.5035
|
11;BD+44 4548;High Proper Motion Star;High Proper Motion Star,High Proper Motion Star,High Proper Motion Star,High Proper Motion Star,Double or Multiple Star,Star,Infra-Red Source,UV-emission Source,UV-emission Source ;114.5559641502924 -16.3315501979801;M2Ve ;11.5035
|
||||||
|
|
|
|
@ -3,7 +3,7 @@ import { readFile, writeFile } from 'fs/promises'
|
||||||
;(async () => {
|
;(async () => {
|
||||||
const content = await readFile('input.csv')
|
const content = await readFile('input.csv')
|
||||||
const records = []
|
const records = []
|
||||||
const columns = ['id', 'name', 'type', 'coords', 'spectral', 'distance']
|
const columns = ['id', 'name', 'type', 'allTypes', 'coords', 'spectral', 'distance']
|
||||||
const parser = parse(content, {
|
const parser = parse(content, {
|
||||||
bom: true,
|
bom: true,
|
||||||
delimiter: ';',
|
delimiter: ';',
|
||||||
|
@ -18,6 +18,8 @@ import { readFile, writeFile } from 'fs/promises'
|
||||||
if (record.spectral === '~') continue
|
if (record.spectral === '~') continue
|
||||||
|
|
||||||
const [phi, theta] = record.coords.split(' ').map((n) => parseFloat(n))
|
const [phi, theta] = record.coords.split(' ').map((n) => parseFloat(n))
|
||||||
|
// lots of duplicates in the allTypes field...
|
||||||
|
const allTypes = [...new Set(record.allTypes.split(','))]
|
||||||
|
|
||||||
records.push({
|
records.push({
|
||||||
id: parseInt(record.id),
|
id: parseInt(record.id),
|
||||||
|
@ -27,6 +29,7 @@ import { readFile, writeFile } from 'fs/promises'
|
||||||
radius: parseFloat(record.distance),
|
radius: parseFloat(record.distance),
|
||||||
phi,
|
phi,
|
||||||
theta,
|
theta,
|
||||||
|
allTypes,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -10,11 +10,14 @@ export class InfoDisplay {
|
||||||
const name = data.name.replace(/^NAME /, '')
|
const name = data.name.replace(/^NAME /, '')
|
||||||
const ly = Math.round(data.radius * 3.2615637 * 100) / 100
|
const ly = Math.round(data.radius * 3.2615637 * 100) / 100
|
||||||
const distance = `${data.radius} pc / ${ly} ly`
|
const distance = `${data.radius} pc / ${ly} ly`
|
||||||
|
const allTypes = '<li>' + data.allTypes.join('</li><li>') + '</li>'
|
||||||
|
|
||||||
const html = this.template
|
const html = this.template
|
||||||
.replace('{{ name }}', name)
|
.replace('{{ name }}', name)
|
||||||
.replace('{{ type }}', data.type)
|
.replace('{{ type }}', data.type)
|
||||||
.replace('{{ spectral }}', data.spectral)
|
.replace('{{ spectral }}', data.spectral)
|
||||||
|
.replace('{{ spectral-class }}', data.spectral[0].toLowerCase())
|
||||||
|
.replace('{{ all-types }}', allTypes)
|
||||||
.replace('{{ distance }}', distance)
|
.replace('{{ distance }}', distance)
|
||||||
|
|
||||||
this.container.innerHTML = html
|
this.container.innerHTML = html
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -15,6 +15,7 @@ export interface StarData {
|
||||||
id: number
|
id: number
|
||||||
name: string
|
name: string
|
||||||
type: string
|
type: string
|
||||||
|
allTypes: string[]
|
||||||
spectral: string
|
spectral: string
|
||||||
radius: number
|
radius: number
|
||||||
phi: number
|
phi: number
|
||||||
|
@ -148,6 +149,7 @@ export async function renderStars(maxRadius: number) {
|
||||||
id: 0,
|
id: 0,
|
||||||
name: 'Sol',
|
name: 'Sol',
|
||||||
type: 'White Dwarf',
|
type: 'White Dwarf',
|
||||||
|
allTypes: ['White Dwarf', 'Star'],
|
||||||
spectral: 'G2V',
|
spectral: 'G2V',
|
||||||
radius: 0.0,
|
radius: 0.0,
|
||||||
phi: 0.0,
|
phi: 0.0,
|
||||||
|
|
Loading…
Add table
Reference in a new issue