# @evotecit/canopyx 中文文档

规范地址：https://npmcn.com/package/%40evotecit/canopyx/

版本：0\.4\.13
npm 元数据更新时间：2026-11-12T10:07:33.598Z
中文译文更新时间：2026-11-14T02:42:05.030Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40evotecit/canopyx
原文对照：https://npmcn.com/package/%40evotecit/canopyx/?lang=original
项目主页：https://github.com/EvotecIT/CanopyX#readme
源码仓库：https://github.com/EvotecIT/CanopyX

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：7 MB，203 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=18
- 运行依赖：0 个
- 首次发布：2026-10-13T07:00:27.302Z
- 最新版本发布：2026-11-12T10:07:32.957Z
- 近 30 天下载量：5708（2026-10-14 至 2026-11-12，npm 官方下载统计）
- 已发布版本数：40（近 12 个月 40 个）

## 中文简介

与虚拟行,搜索,过滤和离线HTML报告交互树格和数据表.

## 安装

```sh
npm install @evotecit/canopyx
```

也可以使用：`pnpm add @evotecit/canopyx`、`yarn add @evotecit/canopyx`、`bun add @evotecit/canopyx`

## README

# 顶罩X

对你自己记录的互动视图,用C#来写:树网格,数据网格,平地,板子,日历,计划,状态矩阵,变化评论和被引导流. 保存一个从磁盘中打开的报表, 服务您的应用程序的视图, 或将其变成电子邮件和打印的无脚本表 .

**[现场演示](https://canopyx.dev/views/)** • 妇女 **[文档](https://canopyx.dev/docs/)** • 妇女 **[开始](https://canopyx.dev/docs/getting-started/)** • 妇女 **[GitHub 图像](https://github.com/EvotecIT/CanopyX)**

![A CanopyX data grid of 1,200 devices grouped by site, with health strips, patch-level bars, sign-in sparklines and a grand total](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/inventory-light.png)

## 选择一个视图

|  |  |  |
| --- | --- | --- |
| [![Tree grid](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/files-light.png)](https://canopyx.dev/views/files/)  
**树网格**  
`CanopyTreeView` | [![Data grid](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/inventory-light.png)](https://canopyx.dev/views/inventory/)  
**数据网格**  
`CanopyDataGridView` | [![Pivot](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/pivot-light.png)](https://canopyx.dev/views/pivot/)  
**关键**  
`CanopyGridPivot` |
| [![Board](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/board-light.png)](https://canopyx.dev/views/board/)  
**董事会**  
`CanopyBoard` | [![Calendar](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/calendar-light.png)](https://canopyx.dev/views/calendar/)  
**日历**  
`CanopyCalendar` | [![Plan](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/plan-light.png)](https://canopyx.dev/views/plan/)  
**计划**  
`CanopyPlan` |
| [![Resource timeline](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/timeline-light.png)](https://canopyx.dev/views/timeline/)  
**资源时间表**  
`CanopyCalendarResources` | [![Status matrix](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/matrix-light.png)](https://canopyx.dev/views/matrix/)  
**状态矩阵**  
`CanopyMatrix` | [![Change review](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/changes-light.png)](https://canopyx.dev/views/changes/)  
**改革审查**  
`CanopyChangeList`, (中文(简体) ), `CanopyTextDiff` |
| [![Dataset compare](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/compare-light.png)](https://canopyx.dev/views/compare/)  
**数据集比较**  
`CanopyDatasetComparer` | [![Time slider](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/time-light.png)](https://canopyx.dev/views/time/)  
**时间滑动器**  
`CanopyTimeSlider` | [![Guided flow](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/flow-light.png)](https://canopyx.dev/views/flow/)  
**引导流量**  
`CanopyFlow` |
| [![Approval path](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/path-light.png)](https://canopyx.dev/views/path/)  
**批准路径**  
`CanopyPath` | [![Layer stack](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/stack-light.png)](https://canopyx.dev/views/stack/)  
**层堆栈**  
`CanopyStack` | [![Script-free table](https://raw.githubusercontent.com/EvotecIT/CanopyX/main/docs/images/views/email-light.png)](https://canopyx.dev/views/email/)  
**无脚本表格**  
`CanopyStaticHtml` |

## 开始吧

```shell
dotnet add package CanopyX.Html
```

`CanopyX.Html` 带进来 `CanopyX` 和浏览器资产。 安装 `CanopyX` 单当您只需要模型,捆绑的编剧或无脚本渲染器时.

### 从磁盘打开的报表

```csharp
using CanopyX;
using CanopyX.Html;

var items = new[] { new Item("Archive", 2048, DateTime.UtcNow), new Item("Documents", 512, DateTime.UtcNow) };
CanopyDataGridView.From(items, x => x.Name).SaveHtmlPage("inventory.html");

record Item(string Name, long Size, DateTime Modified);
```

每个公共财产都变成一栏: `Size` 排序为数字和 `Modified` 作为约会. `[CanopyColumn(Title = "…", Format = "N0")]`, (中文(简体) ), `[CanopyIgnore]` 财务报告和审定财务报表 `[CanopyKey]` 调整它们 `From` 还需要一个 `DataTable` 或者词典行。 要自己选择栏目, 从其成员中逐一命名, 所以重新命名的地产失败 :

```csharp
var inventory = new CanopyDataGridView<Item>("inventory", "Inventory", x => x.Name);
inventory.Column(x => x.Name, configure: column => column.Sortable = true);
inventory.Column(x => x.Size, cell: bytes => new CanopyCell(bytes) { Text = $"{bytes:N0} bytes" });
inventory.AddRows(items).SaveHtmlPage("inventory.html");
```

打开 `inventory.html` 在任何浏览器中。 它携带着自己的运行时间和数据,因此可以将其附在一张票上或者放入文件共享. 数值驱动排序; `Text` 这是读者所看到的.

### 文件探索器

```csharp
var files = new CanopyTreeView("files", "Project files") { Search = new CanopySearchOptions() };
files.Columns.Add(new CanopyColumn("name", "Name") { Sortable = true });
files.Columns.Add(new CanopyColumn("size", "Size") { Kind = CanopyColumnKind.Number, Sortable = true });

var projects = new CanopyNode("projects", "Projects");
var report = new CanopyNode("quarterly-report", "Quarterly report.pdf");
report.Cells["size"] = new CanopyCell(2048L) { Text = "2 KiB" };
projects.Children.Add(report);
files.Roots.Add(projects);

files.SaveHtmlPage("files.html");     // one file
files.SaveHtmlBundle("file-report");  // or a folder that loads branches on demand
```

### 电子邮件和打印表

```csharp
using CanopyX.Rendering;

string table = inventory.ToStaticHtml();
```

结果是一个HTML表,内含样式而无脚本,准备用于邮件正文,打印版式或Word.

## 选择快递

| 你想这样 | 写入 | 你得到的东西 |
| --- | --- | --- |
| 要附加或归档的文件 | `view.SaveHtmlPage("report.html")` | 单页的数据和运行时间 |
| 文件共享上的大树或网格 | `view.SaveHtmlBundle("report")` | 一个将分行加载为阅读器滚动的文件夹 |
| 百万个数据库行 | `CanopyX.Data` + 键 `CanopyX.AspNetCore` | 您的服务器已回复的呼声、 过滤器、 摘要、 导出和编辑 |
| 电子邮件中的表格 | `view.ToStaticHtml()` | 在邮件客户端幸存下来的无脚本表格 |

## 指南

-   [开始](https://canopyx.dev/docs/getting-started/):一个文件探索者和一个目录表,一步一步地.
-   [汇报网](https://canopyx.dev/docs/reporting/): 分组,过滤器,聚合物,演示人和导出.
-   [电子邮件和打印](https://canopyx.dev/docs/static-tables/) 财务报告和审定财务报表 [发送模式](https://canopyx.dev/docs/delivery/)。 。 。 .
-   [.NET 的服务器端数据](https://github.com/EvotecIT/CanopyX/blob/main/docs/remote-dotnet.md)数字 : `CanopyX.Data` 财务报告和审定财务报表 `CanopyX.AspNetCore`。 。 。 .
-   [日历](https://github.com/EvotecIT/CanopyX/blob/main/docs/calendar.md), (中文(简体) ), [董事会](https://github.com/EvotecIT/CanopyX/blob/main/docs/board.md), (中文(简体) ), [计划](https://github.com/EvotecIT/CanopyX/blob/main/docs/plan.md), (中文(简体) ), [矩阵](https://github.com/EvotecIT/CanopyX/blob/main/docs/matrix.md), (中文(简体) ), [更改视图](https://github.com/EvotecIT/CanopyX/blob/main/docs/changes.md) 财务报告和审定财务报表 [指导性流动](https://github.com/EvotecIT/CanopyX/blob/main/docs/flow.md)。 。 。 .
-   [编辑](https://github.com/EvotecIT/CanopyX/blob/main/docs/editing.md), (中文(简体) ), [有条件的格式](https://github.com/EvotecIT/CanopyX/blob/main/docs/conditional-formatting.md), (中文(简体) ), [标签包](https://github.com/EvotecIT/CanopyX/blob/main/docs/labels.md) 财务报告和审定财务报表 [警卫](https://github.com/EvotecIT/CanopyX/blob/main/docs/security.md)。 。 。 .

## 所需资源

| 目标 | 支助 |
| --- | --- |
| .NET 8和.NET 10 | 窗口、 Linux 和 macOS |
| .NET 标准 2.0 | 兼容的.NET应用程序 |
| .NET 框架 4.7.2 | 窗口 |

软件包没有添加第三方运行时依赖性,生成报表需要节点.js,npm或构建步骤.

## 社区和许可证

CanopyX是一个Evotec项目,在麻省理工学院下获得许可. 欢迎各代表团提问和反馈 [Discord上的Evotec社区](https://evo.yt/discord)更多的Evotec项目正在进行中 [evotec.xyz (英语)](https://evotec.xyz/hub)。 。 。 .

## 常见问题

### @evotecit/canopyx 是什么？

与虚拟行,搜索,过滤和离线HTML报告交互树格和数据表\.

### 如何安装 @evotecit/canopyx？

在项目目录运行 npm install @evotecit/canopyx，或使用 pnpm add / yarn add / bun add。

### @evotecit/canopyx 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @evotecit/canopyx 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @evotecit/canopyx 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js \>=18。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @evotecit/canopyx 可以商用吗？

@evotecit/canopyx 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @evotecit/canopyx 的下载量有多少？

根据 npm 官方下载统计，@evotecit/canopyx 在 2026/10/14 – 2026/11/12 这 30 天内被下载 5,708 次，日均约 190 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @evotecit/canopyx 还在维护吗？

最新版本 0\.4\.13 发布于 2026/11/12（1 天前）；至今共发布 40 个版本，其中过去 12 个月发布了 40 个；首次发布于 2026/10/13。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。