[点我直接玩] https://www.radiosphere.live/
这玩意是干啥的？
一个 3D 交互式地球，上面每一个绿点都是一个真实在线的网络广播电台（ Shoutcast / Icecast ）。
你旋转/缩放地球，随便点一个点，就能听到那个地区的广播——可能是音乐、新闻、甚至是半夜的脱口秀。
技术栈
- Three.js (r128) – 地球主体、标注点、光晕效果
- Web Audio API – 音频流播放、音量控制、跨域处理
- 自建数据层 – 爬取了全球约 8000+ 个公开电台，包含经纬度、流地址、国家等
- 前端框架 – Vue + Vite
- 坐标转换 – 地理坐标 (lat, lon) → 三维空间向量
目前遇到的坑（也是我想在 V2EX 求助的重点）
-
性能
地球上的标记点目前是 8000+ 个独立的PointsMaterial，帧率在低端设备上会掉到 30 以下。
试过用BufferGeometry合并，但动态光晕（播放中的电台要单独高亮）就不好做了。
求教：有没有在“大量静态点 + 少数动态高亮点”场景下的最佳实践？ -
音频流的 CORS & 混合内容
很多电台流是 HTTP 的，我的网站是 HTTPS ，浏览器会 block 。
目前用了一个公共 CORS 代理（https://cors-anywhere.herokuapp.com/），但不稳定而且慢。
有没有更轻量的方案？或者自己搭一个简单的代理，成本大概多少？ -
数据更新
电台经常失效（流地址 404 或者超时），我是半手工检测 + 脚本定期跑。
想知道有没有比较稳定的全球公开电台 API ？不想一直维护死链。
接下来想加的功能
- 用户自定义导入电台（粘贴流地址，自动推算经纬度）
- “随机漫游”模式：每 30 秒自动跳到另一个随机电台
- 录音片段分享（录 15 秒存成 WebM 并生成分享链接）
我需要你帮忙做的事
- 戳一下网站，看看在你设备上卡不卡（手机 / 老笔记本尤其需要反馈）
- 如果你知道 本地或小众地区的网络电台流地址，直接评论丢给我（国家 + 流地址），我批量加进去
- 对上面那几个技术坑有思路的直接留言，跪谢 🙏
最后说句心里话
这个项目不是为了赚钱，纯粹想做点炫酷的东西。
做出来之后自己每天都会随便点几个没听过的国家，感觉很奇妙。
如果你也觉得有意思，欢迎转发给朋友；如果发现 bug 或者卡顿，直接喷，我改。
➡️ https://www.radiosphere.live/
（网站目前没有广告，也没有用户系统，打开即用）
可选的“沙发”自问自答
问：为什么不用 Cesium ？
答：Cesium 太重了，Three.js 更可控，而且我想保持打包后不到 2MB （不含纹理）。
问：电台数据会不会涉及版权问题？
答：所有流地址都是电台自己公开的 Shoutcast 入口，我只是做了一个播放器外壳，类似浏览器。
Select Language