数据可视化学习笔记

这是一个基于 WebGL 的实时数据可视化学习项目，支持百万级数据点的流畅渲染与交互分析。项目整合了 Three.js 的 3D 渲染能力和 D3.js 的数据绑定机制，实现了高性能、高交互性的可视化体验。

项目采用 TypeScript 开发，React 作为前端框架，支持多种可视化类型：散点图、热力图、网络图、地理信息图等，并提供丰富的交互功能如缩放、筛选、联动分析。

• 大规模数据渲染：百万级数据点的实时渲染，帧率保持 60fps
• 多种可视化类型：2D/3D 图表自由切换，支持自定义样式
• 智能聚合算法：数据量超阈值时自动聚合，保证渲染性能
• 交互式分析：缩放、平移、筛选、点击详情、区域选择
• 实时数据流：WebSocket 推送，支持动态数据更新
• 导出分享：PNG/SVG 导出，分享链接生成

GPU 加速

利用 WebGL 的 GPU 并行计算能力，将数据点渲染从 CPU 移至 GPU，通过自定义着色器实现高效批量渲染。

数据分片

采用 Apache Arrow 格式存储数据，结合 WebWorker 进行后台解析，避免主线程阻塞。

视口裁剪

根据当前视口范围动态裁剪数据，只渲染可见区域的数据点，显著降低渲染压力。