【Code with SOLO】VibeViz-最实用轻量化在线可视化平台,5分钟制作15种图表!

:milky_way: VibeViz (Feel Your Data)

React ECharts Web Worker Gemini AI

:globe_with_meridians: 在线体验 (Live Demo)


VibeViz 是一款轻量化智能数据可视化引擎

无需付费无需注册无需下载无需网络无需代码,10分掌握15种图表制作

Web Worker 极限算力Gemini 3.0 智能洞察沉浸式雨天模拟音乐频谱律动

image-20260302233127049

:sparkles: 核心黑科技 (Core Features)

:rocket: 1. 纯前端数据处理引擎 (Local Web Worker Engine)

  • 零后端依赖,数据绝对安全:支持 CSV, Excel, JSON 文件,毫秒级本地解析。
  • 10+ 数据处理管线:内置极其强大的分析操作,包括:分组聚合 (Group By)、数据透视表 (Pivot)、频数统计、自适应分箱 (Binning)、时间序列处理、相关系数矩阵 (Pearson) 等。
  • 自动防卡死:超过 10,000 条数据自动开启渲染保护,支持滑动条 DataZoom 按需探索。

:bar_chart: 2. 商业级图表渲染 (Professional Charting)

  • 15 种核心图表:涵盖柱状、折线、饼图、雷达、漏斗,直方、热力乃至专业的 股票 K 线图国家地图
  • 自适应长尾截断直方图 (Winsorized Binning):独创算法,自动剥离极端异常值,完美呈现正态分布的“山峰形态”,并支持双路热力映射。
  • 中国地图“双重注入”防丢白板机制:自动匹配各类 GeoJSON 地图数据,无惧行政区划全称/简称差异。
  • 智能防重叠引擎 (Smart Labeling):自研动态抽样算法,图表数据再密集也能保持呼吸感,并永远强制保留 Max/Min 极值大头针标注。

:robot: 3. AI 智能辅助 (Gemini AI Integration)

  • AI 策略建议:基于上传数据的字段与类型分布,AI 自动为你推荐 2-3 个最有价值的数据分析方向。
  • AI 商业洞察:一键对当前渲染的图表数据进行深度解读,自动总结极值、趋势与业务结论。
  • 智能语境标题:无需手动输入,系统会根据 X/Y 轴的维度属性(时间、地理、分类)自动生成专业的商业图表文案。

:gem_stone: 4. 极致沉浸美学 (Immersive Glassmorphism UI)

  • 毛玻璃视效 (Glassmorphism):全局采用半透明磨砂玻璃材质设计,配合莫兰迪冷暖色调的视觉隐喻。
  • 音乐律动模式:上传音乐或使用内置白噪声(雨声/雷声),让 3D 柱状图 随着音频频谱实时跳动,打造沉浸式数据汇报体验。

:camera_with_flash: 界面&效果预览 (Screenshots)

image-20260303101901915

image-20260303003659962

:hammer_and_wrench: 技术栈 (Tech Stack)

  • 框架: React 18 + Vite
  • UI/样式: Tailwind CSS + 自定义 Glassmorphism 特效
  • 图表引擎: Apache ECharts 5 (含 echarts-gl 及自定义中国地图)
  • 数据处理: Web Worker + Lodash (实现非阻塞的本地数据流转)
  • AI 接口: Google Gemini API