Switch radio globe imagery to NASA Blue Marble
This commit is contained in:
parent
54a53a98b7
commit
693f719abc
3 changed files with 28 additions and 5 deletions
BIN
web/public/nasa-blue-marble.jpg
Normal file
BIN
web/public/nasa-blue-marble.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 MiB |
|
|
@ -201,15 +201,11 @@ export default function RadioTab({ data }: { data: any }) {
|
||||||
// Read accent color from theme
|
// Read accent color from theme
|
||||||
const initStyle = getComputedStyle(containerRef.current.parentElement!);
|
const initStyle = getComputedStyle(containerRef.current.parentElement!);
|
||||||
const initRgb = initStyle.getPropertyValue('--accent-rgb').trim() || '230, 126, 34';
|
const initRgb = initStyle.getPropertyValue('--accent-rgb').trim() || '230, 126, 34';
|
||||||
const initAccent = initStyle.getPropertyValue('--accent').trim() || '#e67e22';
|
|
||||||
|
|
||||||
const globe = new Globe(containerRef.current)
|
const globe = new Globe(containerRef.current)
|
||||||
.backgroundColor('rgba(0,0,0,0)')
|
.backgroundColor('rgba(0,0,0,0)')
|
||||||
.atmosphereColor(`rgb(${initRgb})`)
|
.atmosphereColor(`rgb(${initRgb})`)
|
||||||
.atmosphereAltitude(0.12)
|
.atmosphereAltitude(0.12)
|
||||||
.globeImageUrl('/earth-night.jpg')
|
.globeImageUrl('/nasa-blue-marble.jpg')
|
||||||
.globeTileEngineUrl((x: number, y: number, z: number) => `/api/radio/tile/${z}/${x}/${y}`)
|
|
||||||
.globeTileEngineMaxLevel(9)
|
|
||||||
.pointsData(places)
|
.pointsData(places)
|
||||||
// Radio Garden geo format: [lng, lat]
|
// Radio Garden geo format: [lng, lat]
|
||||||
.pointLat((d: any) => d.geo[1])
|
.pointLat((d: any) => d.geo[1])
|
||||||
|
|
@ -615,6 +611,14 @@ export default function RadioTab({ data }: { data: any }) {
|
||||||
<div className="radio-counter">
|
<div className="radio-counter">
|
||||||
{'\u{1F4FB}'} {places.length.toLocaleString('de-DE')} Sender weltweit
|
{'\u{1F4FB}'} {places.length.toLocaleString('de-DE')} Sender weltweit
|
||||||
</div>
|
</div>
|
||||||
|
<a
|
||||||
|
className="radio-attribution"
|
||||||
|
href="https://science.nasa.gov/earth/earth-observatory/blue-marble-next-generation/"
|
||||||
|
target="_blank"
|
||||||
|
rel="noreferrer"
|
||||||
|
>
|
||||||
|
Imagery © NASA Blue Marble
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* ── Connection Details Modal ── */}
|
{/* ── Connection Details Modal ── */}
|
||||||
|
|
|
||||||
|
|
@ -1036,6 +1036,25 @@ html, body {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.radio-attribution {
|
||||||
|
position: absolute;
|
||||||
|
right: 16px;
|
||||||
|
bottom: 16px;
|
||||||
|
z-index: 10;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-faint);
|
||||||
|
background: rgba(30, 31, 34, 0.8);
|
||||||
|
padding: 4px 10px;
|
||||||
|
border-radius: 20px;
|
||||||
|
text-decoration: none;
|
||||||
|
transition: color var(--transition), background var(--transition);
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-attribution:hover {
|
||||||
|
color: var(--text-normal);
|
||||||
|
background: rgba(30, 31, 34, 0.92);
|
||||||
|
}
|
||||||
|
|
||||||
/* ── Spinner ── */
|
/* ── Spinner ── */
|
||||||
.radio-spinner {
|
.radio-spinner {
|
||||||
width: 24px;
|
width: 24px;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue