Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Devin/1737021322 add statistics feature #8981

Open
wants to merge 8 commits into
base: master
Choose a base branch
from

Conversation

ChengranYan
Copy link

🔥 ProTable Statistics Feature

🚀 What problem does this PR solve?

This PR adds a powerful statistics feature to ProTable, allowing users to analyze column data directly from the table interface. The feature provides:

  • Statistical analysis for numeric and categorical columns
  • Interactive distribution visualizations
  • Automatic data type detection
  • Performance optimized calculations
  • Non-intrusive UI with column header icons

🔍 Screenshots

+-------+--------+-------------+
| Name  | Age ⚡ | Status ⚡   |
+-------+--------+-------------+
| User1 | 25     | Active      |
| User2 | 30     | Inactive    |
| User3 | 28     | Pending     |
+-------+--------+-------------+

📝 Usage Example

import { ProTable } from '@ant-design/pro-components';

const columns = [
  {
    title: 'Age',
    dataIndex: 'age',
    statistics: {
      average: true,
      median: true,
      distribution: true,
      chartType: 'bar'
    }
  },
  {
    title: 'Status',
    dataIndex: 'status',
    statistics: {
      mode: true,
      distribution: true,
      chartType: 'pie'
    }
  }
];

export default () => (
  <ProTable
    columns={columns}
    // ... other props
  />
);

🛠 Implementation Details

  1. Added StatisticsConfig interface for column configuration:
interface StatisticsConfig {
  average?: boolean;
  median?: boolean;
  mode?: boolean;
  distribution?: boolean;
  chartType?: 'bar' | 'pie' | 'line';
}
  1. Enhanced column rendering with statistics icon and modal:
  • Added statistics icon to column headers
  • Implemented data analysis modal
  • Added distribution visualization
  1. Performance optimizations:
  • Memoized calculations
  • Efficient data type detection
  • Optimized for large datasets

🔗 Demo

You can try out the feature at our deployed demo:
https://antd-pro-table-app-4bsubyvg.devinapps.com

📚 Documentation

Added comprehensive documentation:

  • API reference in typing.ts
  • Usage examples in demo file
  • Implementation details in component files

🎯 Breaking Changes

None. This is a non-breaking enhancement that maintains backward compatibility.

Link to Devin run

https://app.devin.ai/sessions/9922c522576e4bc9bf310af8101a7ae5

devin-ai-integration bot and others added 7 commits January 16, 2025 09:59
- Add statistics property to ProColumns interface
- Implement statistics icon in column headers
- Create StatisticsChart component for data visualization
- Add demo and documentation with examples
- Skip custom render columns for statistics

Co-Authored-By: 成冉闫 <[email protected]>
Copy link

github-actions bot commented Jan 17, 2025

⚡️ Deploying PR Preview...

- Add range filters for numeric columns (Age, Score)
- Add categorical filters for Status column
- Implement date-based sorting and filtering
- Add comprehensive documentation with examples
- Include toolbar with search and density controls
- Add interactive demo with sample data

Co-Authored-By: 成冉闫 <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant