docs: add bullet component documentation#3004
Conversation
📝 WalkthroughWalkthrough本次变更主要对子弹图（Bullet Plot）相关的核心实现、类型定义、默认配置、示例与文档进行了重构和完善。包括参数访问方式的统一、布局属性的调整、图层顺序的明确、类型定义的精简、示例配置方式的更新，以及文档的全面扩充和结构化。 Changes
Sequence Diagram(s)sequenceDiagram
participant 用户
participant BulletPlot
participant Options
用户->>BulletPlot: 初始化（传入 options）
BulletPlot->>Options: 解构参数（统一提取 options）
BulletPlot->>Options: 判断 transpose 控制布局
BulletPlot->>Options: 设置 children、legend、zIndex 等属性
BulletPlot-->>用户: 渲染子弹图
Poem
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
site/examples/statistics/bullet/demo/bullet-group.jsOops! Something went wrong! :( ESLint: 8.57.1 ESLint couldn't find the plugin "eslint-plugin-react". (The package "eslint-plugin-react" was not found when loaded as a Node module from the directory "/site".) It's likely that the plugin isn't installed correctly. Try reinstalling by running the following: The plugin "eslint-plugin-react" was referenced from the config file in "site/.eslintrc.js » /node_modules/.pnpm/@umijs+fabric@2.14.1/node_modules/@umijs/fabric/dist/eslint.js". If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team. site/examples/statistics/bullet/demo/bullet-vertical.jsOops! Something went wrong! :( ESLint: 8.57.1 ESLint couldn't find the plugin "eslint-plugin-react". (The package "eslint-plugin-react" was not found when loaded as a Node module from the directory "/site".) It's likely that the plugin isn't installed correctly. Try reinstalling by running the following: The plugin "eslint-plugin-react" was referenced from the config file in "site/.eslintrc.js » /node_modules/.pnpm/@umijs+fabric@2.14.1/node_modules/@umijs/fabric/dist/eslint.js". If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team. ✨ Finishing Touches
🧪 Generate Unit Tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
packages/plots/src/core/plots/bullet/adaptor.ts(6 hunks)packages/plots/src/core/plots/bullet/index.ts(2 hunks)packages/plots/src/core/plots/bullet/type.ts(0 hunks)site/docs/components/plots/bullet.zh.md(2 hunks)site/examples/statistics/bullet/demo/bullet-group.js(1 hunks)site/examples/statistics/bullet/demo/bullet-vertical.js(1 hunks)
💤 Files with no reviewable changes (1)
- packages/plots/src/core/plots/bullet/type.ts
🧰 Additional context used
🧬 Code Graph Analysis (1)
packages/plots/src/core/plots/bullet/adaptor.ts (2)
packages/plots/src/core/utils/index.ts (3)
map(20-20)set(12-12)mergeWithArrayCoverage(37-37)packages/plots/src/core/utils/merge-with-array-coverage.ts (1)
mergeWithArrayCoverage(9-11)
🪛 markdownlint-cli2 (0.17.2)
site/docs/components/plots/bullet.zh.md
94-94: Table column count
Expected: 5; Actual: 4; Too few cells, row will be missing data
(MD056, table-column-count)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: deploy
🔇 Additional comments (8)
site/examples/statistics/bullet/demo/bullet-group.js (1)
35-37: API 改进看起来不错！从
color.targets映射改为直接在target.style设置样式属性，这种方式更加直观和一致。新的配置方式让用户能够直接控制目标元素的样式属性。site/examples/statistics/bullet/demo/bullet-vertical.js (1)
15-15: 布局配置简化得很好！使用
transpose: false替代layout: 'vertical'更加直观，明确表达了坐标转置的概念。这种简化让 API 更容易理解和使用。packages/plots/src/core/plots/bullet/index.ts (2)
28-28: 图例标记器逻辑更新合理！将条件从
'target'改为'targets'与数据字段命名保持一致，提高了 API 的连贯性。
39-39: 明确的图层顺序控制！为间隔元素添加明确的
zIndex属性（-2 和 -1）是个好的实践，确保了渲染顺序的可预测性和一致性。Also applies to: 44-44
packages/plots/src/core/plots/bullet/adaptor.ts (3)
104-104: 代码重构提升了可读性！在函数开始时提取
options并一致使用是个很好的实践，让代码更加清晰和易于维护。Also applies to: 113-113
171-173: 布局逻辑简化得当！使用
transpose布尔标志替代layout属性简化了 API，逻辑更加直观。默认值true的设置也很合理。
186-189: 配置适配器重构良好！统一的选项提取和使用模式提高了代码的一致性和可维护性。
site/docs/components/plots/bullet.zh.md (1)
11-105: 文档内容丰富全面！新增的子弹图文档非常详尽，包含了清晰的组件介绍、多个实用示例和完整的配置项说明。这将大大帮助用户理解和使用该组件。
1 participant
Summary by CodeRabbit
新功能
transpose布尔值切换坐标方向，替代原有的layout配置。修复与优化
文档
类型变更
BulletOptions类型中的layout属性，推荐使用transpose控制布局方向。