Fix radio globe texture rendering

This commit is contained in:
Daniel 2026-03-06 11:55:04 +01:00
parent fef207e9df
commit b8268b4999
2 changed files with 17 additions and 3 deletions

View file

@ -1,6 +1,6 @@
import { useState, useEffect, useRef, useCallback } from 'react';
import Globe from 'globe.gl';
import { CanvasTexture, LinearFilter } from 'three';
import { CanvasTexture, Color, LinearFilter, SRGBColorSpace } from 'three';
import { TileTextureManager } from './TileTextureManager';
// ── Types ──
@ -160,7 +160,7 @@ export default function RadioTab({ data }: { data: any }) {
const accentRgb = style.getPropertyValue('--accent-rgb').trim();
globeRef.current
.pointColor(() => `rgba(${accentRgb}, 0.85)`)
.atmosphereColor(`rgba(${accentRgb}, 0.25)`);
.atmosphereColor(`rgb(${accentRgb})`);
}
}, [theme]);
@ -215,7 +215,7 @@ export default function RadioTab({ data }: { data: any }) {
const globe = new Globe(containerRef.current)
.backgroundColor('rgba(0,0,0,0)')
.atmosphereColor(`rgba(${initRgb}, 0.25)`)
.atmosphereColor(`rgb(${initRgb})`)
.atmosphereAltitude(0.12)
.pointsData(places)
// Radio Garden geo format: [lng, lat]
@ -237,9 +237,11 @@ export default function RadioTab({ data }: { data: any }) {
const texture = new CanvasTexture(tileMgr.canvas);
texture.minFilter = LinearFilter;
texture.generateMipmaps = false;
texture.colorSpace = SRGBColorSpace;
tileTextureRef.current = texture;
const mat = globe.globeMaterial() as any;
mat.map = texture;
mat.color = new Color(0xffffff);
mat.needsUpdate = true;
// Start loading tiles (progressive: zoom 1 → 2 → 3)