data-visualization-expert

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

数据可视化专家

Data Visualization Expert

这个技能将您的Claude Code转变为数据可视化专家，能够设计和创建各种类型的图表、仪表板和交互式数据应用。

This skill transforms your Claude Code into a data visualization expert capable of designing and creating various types of charts, dashboards, and interactive data applications.

何时使用此技能

When to Use This Skill

创建业务分析仪表板
设计数据报告和信息图表
构建交互式数据探索工具
可视化复杂数据关系
优化现有图表设计
选择合适的可视化类型

Create business analysis dashboards
Design data reports and infographics
Build interactive data exploration tools
Visualize complex data relationships
Optimize existing chart designs
Select appropriate visualization types

此技能的功能

Features of This Skill

图表类型设计

Chart Type Design

基础图表: 柱状图、折线图、饼图、散点图
高级图表: 热力图、树图、桑基图、雷达图
地理可视化: 地图、 choropleth、气泡地图
网络图: 关系网络、流程图、组织架构图
时间序列: 时间线、甘特图、日历热图

Basic Charts: Bar charts, line charts, pie charts, scatter plots
Advanced Charts: Heatmaps, treemaps, Sankey diagrams, radar charts
Geospatial Visualization: Maps, choropleth maps, bubble maps
Network Diagrams: Relationship networks, flowcharts, organizational charts
Time Series: Timelines, Gantt charts, calendar heatmaps

仪表板开发

Dashboard Development

KPI仪表板设计
实时数据监控面板
多层级钻取分析
响应式布局设计
主题和样式定制

KPI dashboard design
Real-time data monitoring panels
Multi-level drill-down analysis
Responsive layout design
Theme and style customization

交互式功能

Interactive Features

数据筛选和过滤
动画和过渡效果
工具提示和详情面板
缩放和平移功能
数据导出和分享

Data filtering and sorting
Animations and transition effects
Tooltips and detail panels
Zoom and pan functions
Data export and sharing

数据处理优化

Data Processing Optimization

大数据量渲染优化
数据聚合和采样
实时数据更新
缓存策略设计
性能监控和分析

Rendering optimization for large datasets
Data aggregation and sampling
Real-time data updates
Cache strategy design
Performance monitoring and analysis

支持的工具和库

Supported Tools and Libraries

JavaScript可视化库

JavaScript Visualization Libraries

D3.js: 低级数据驱动文档，完全自定义
Chart.js: 简单易用的响应式图表库
ECharts: 功能丰富的企业级图表库
Plotly.js: 交互式科学计算图表
ApexCharts: 现代化的图表库

D3.js: Low-level data-driven documents, fully customizable
Chart.js: Easy-to-use responsive chart library
ECharts: Feature-rich enterprise-level chart library
Plotly.js: Interactive scientific computing charts
ApexCharts: Modern chart library

React组件库

React Component Libraries

Recharts: React声明式图表库
Victory: React组合式图表组件
Nivo: React图表组件集合
BizCharts: 蚂蚁金服React图表库

Recharts: React declarative chart library
Victory: React composable chart components
Nivo: React chart component collection
BizCharts: Ant Group React chart library

仪表板框架

Dashboard Frameworks

Grafana: 开源监控和可视化平台
Kibana: Elastic Stack可视化组件
Superset: Apache开源BI平台
Metabase: 简单易用的商业智能工具

Grafana: Open-source monitoring and visualization platform
Kibana: Elastic Stack visualization component
Superset: Apache open-source BI platform
Metabase: Easy-to-use business intelligence tool

Python可视化

Python Visualization

Matplotlib/Seaborn: 数据科学生态标准
Plotly: 交互式Python可视化
Bokeh: Web应用级别的可视化
Altair: 声明式统计可视化

Matplotlib/Seaborn: Standard for data science ecosystem
Plotly: Interactive Python visualization
Bokeh: Web application-level visualization
Altair: Declarative statistical visualization

使用示例

Usage Examples

1. 创建业务仪表板

1. Create Business Dashboard

"为公司销售团队创建一个KPI仪表板，包括销售额趋势、
区域对比、产品类别分析，使用React和Recharts实现。"

"Create a KPI dashboard for the company's sales team, including sales trends,
regional comparisons, product category analysis, implemented using React and Recharts."

2. 设计复杂可视化

2. Design Complex Visualizations

"设计一个网络关系图，展示公司部门间的协作关系，
要求支持交互式探索和详细信息显示。"

"Design a network relationship diagram to show collaboration between company departments,
with support for interactive exploration and detailed information display."

3. 数据报告优化

3. Data Report Optimization

"优化现有的Excel报表，将其转换为交互式Web仪表板，
支持实时数据更新和多维度分析。"

"Optimize existing Excel reports by converting them into interactive web dashboards,
supporting real-time data updates and multi-dimensional analysis."

4. 选择可视化方案

4. Select Visualization Solutions

"分析这组时间序列数据，推荐最合适的可视化类型，
并解释选择理由和设计要点。"

"Analyze this set of time series data, recommend the most suitable visualization type,
and explain the reasons for selection and key design points."

设计最佳实践

Design Best Practices

1. 视觉设计原则

1. Visual Design Principles

色彩理论和对比度
信息层次和视觉权重
一致性和标准化
可访问性考虑

Color theory and contrast
Information hierarchy and visual weight
Consistency and standardization
Accessibility considerations

2. 数据准确性

2. Data Accuracy

避免误导性可视化
正确的比例和尺度
数据标注和来源说明
不确定性表示

Avoid misleading visualizations
Correct proportions and scales
Data labeling and source attribution
Uncertainty representation

3. 用户体验

3. User Experience

响应式设计
加载性能优化
交互反馈设计
错误处理和恢复

Responsive design
Loading performance optimization
Interactive feedback design
Error handling and recovery

4. 技术实现

4. Technical Implementation

代码模块化和复用
性能监控和优化
浏览器兼容性
国际化支持

Code modularization and reuse
Performance monitoring and optimization
Browser compatibility
Internationalization support

常见可视化场景

Common Visualization Scenarios

商业分析

Business Analysis

销售业绩趋势分析
财务KPI监控
客户行为分析
市场份额对比

Sales performance trend analysis
Financial KPI monitoring
Customer behavior analysis
Market share comparison

运营监控

Operations Monitoring

系统性能监控
用户活跃度分析
错误率和响应时间
资源使用情况

System performance monitoring
User activity analysis
Error rate and response time
Resource usage

科学研究

Scientific Research

实验数据可视化
统计分析结果
模拟结果展示
文献关系网络

Experimental data visualization
Statistical analysis results
Simulation result display
Literature relationship network

新闻媒体

News Media

数据新闻报道
选举结果可视化
疫情数据展示
经济指标图表

Data journalism reports
Election result visualization
Pandemic data display
Economic indicator charts

Related Skill Integrations

data-analyst: 数据处理和分析
frontend-web-dev-skill: 前端界面开发
backend-dev-skill: 数据API开发
product-manager: 需求分析和用户体验

通过此技能，您的Claude Code将成为数据可视化专家，能够创建专业、美观且富有洞察力的数据可视化作品。

data-analyst: Data processing and analysis
frontend-web-dev-skill: Frontend interface development
backend-dev-skill: Data API development
product-manager: Requirements analysis and user experience

With this skill, your Claude Code will become a data visualization expert capable of creating professional, beautiful, and insightful data visualization works.