Graphic Walker

(opens in a new tab) (opens in a new tab) (opens in a new tab)

Graphic Walker 是一个开源的 Tableau 替代方案，通过拖拽操作将数据转化为交互式可视化。它是一个轻量级、可嵌入的 React 组件，无需依赖庞大的 BI 平台。

核心特性

• 拖拽式探索 — 将字段拖入视觉编码通道（行、列、颜色、大小、形状、透明度）即可构建可视化
• 图形语法驱动 — 基于 vega-lite (opens in a new tab) 引擎，支持柱状图、折线图、面积图、散点图、热力图、箱线图和地理图表
• 多种组件 — GraphicWalker 提供完整的探索功能，GraphicRenderer 用于只读图表展示，PureRenderer 用于嵌入，TableWalker 用于数据表格
• 客户端或服务端计算 — 默认在 WebWorker 中运行计算，也可委托给服务端处理大规模数据集
• 主题定制 — 内置主题（vega、g2、streamlit），支持暗色模式，UI 颜色完全可定制
• 地理可视化 — 支持 GeoJSON/TopoJSON 的等值区域图和散点地图
• 图表导出 — 通过 ref API 将图表导出为 SVG 或 PNG
• 国际化 — 内置支持英文、中文和日文，同时支持自定义翻译
• 不用 React？没问题 — 提供原生 JS 嵌入函数，适用于任何 Web 框架

快速开始

npm install @kanaries/graphic-walker

import { GraphicWalker } from '@kanaries/graphic-walker';
 
const fields = [
  { fid: 'date', name: 'Date', semanticType: 'temporal', analyticType: 'dimension' },
  { fid: 'category', name: 'Category', semanticType: 'nominal', analyticType: 'dimension' },
  { fid: 'sales', name: 'Sales', semanticType: 'quantitative', analyticType: 'measure' },
];
 
function App() {
  return <GraphicWalker data={data} fields={fields} />;
}

查看快速开始指南获取完整教程。

文档

在线试用

无需安装即可体验 Graphic Walker：Graphic Walker 在线版 (opens in a new tab)

许可证

Graphic Walker 基于 Apache-2.0 许可证 (opens in a new tab) 发布。