SxBarChart (柱状图)
NextUI 扩展图表。专门针对柱状图场景优化的封装组件,基于 Apache ECharts。
使用场景
- 统计类报表
- 数据对比与趋势展示
- 需要快速呈现的柱状图场景
约束说明
- 需要在运行环境中加载 ECharts 脚本。
- 未提供
Options时使用Data+Labels自动生成基础配置。
API
Parameters (参数)
| 状态 | 参数名 | 类型 | 默认值 | 描述 |
|---|---|---|---|---|
| Implemented | Options |
object? |
null |
覆盖底层 ECharts 配置。 |
| Implemented | Data |
double[]? |
null |
快速设置数据序列。 |
| Implemented | Labels |
string[]? |
null |
快速设置 X 轴分类标签。 |
| Implemented | Id (继承) |
string? |
null |
组件的物理 Id。 |
| Implemented | Class (继承) |
string? |
null |
自定义 CSS 类名。 |
| Implemented | Style (继承) |
string? |
null |
自定义样式。 |
| Implemented | Title (继承) |
string? |
null |
HTML title 属性。 |
| Not Implemented | TabIndex (继承) |
int? |
null |
TabIndex(未应用)。 |
| Not Implemented | AccessKey (继承) |
string? |
null |
AccessKey(未应用)。 |
| Implemented | Disabled (继承) |
bool |
false |
禁用状态(阻止刷新配置)。 |
| Implemented | Loading (继承) |
bool |
false |
加载状态(与 Disabled 等效)。 |
| Implemented | AdditionalAttributes (继承) |
IEnumerable<KeyValuePair<string, object>>? |
null |
捕获不匹配的 HTML 属性。 |
行为说明
Options优先级高于Data/Labels。Disabled为true时不会更新图表配置。
示例
<SxBarChart Data="@_data" Labels="@_labels" Style="height: 280px;" />
@code {
private readonly double[] _data = { 120, 200, 150 };
private readonly string[] _labels = { "Mon", "Tue", "Wed" };
}