# @ebi-gene-expression-group/anatomogram 中文文档

规范地址：https://npmcn.com/package/%40ebi-gene-expression-group/anatomogram/

版本：2\.4\.0
npm 元数据更新时间：2025-08-21T13:43:22.448Z
中文译文更新时间：2026-11-13T04:35:30.031Z
软件包许可：Apache-2\.0

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

原始 npm 页面：https://www.npmjs.com/package/%40ebi-gene-expression-group/anatomogram
原文对照：https://npmcn.com/package/%40ebi-gene-expression-group/anatomogram/?lang=original
项目主页：https://github.com/gxa/anatomogram#readme
源码仓库：https://github.com/gxa/anatomogram

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

- 包体积（解压后）：13.6 MB，51 个文件
- 模块格式：CommonJS
- TypeScript 类型：未声明
- 运行依赖：8 个
- 首次发布：2019-10-02T11:58:13.157Z
- 最新版本发布：2019-12-12T01:12:40.905Z
- 近 30 天下载量：11649（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：4（近 12 个月 0 个）

## 中文简介

表达式图集热映射解析图组件

## 安装

```sh
npm install @ebi-gene-expression-group/anatomogram
```

也可以使用：`pnpm add @ebi-gene-expression-group/anatomogram`、`yarn add @ebi-gene-expression-group/anatomogram`、`bun add @ebi-gene-expression-group/anatomogram`

## README

# 表达式图集解析图

[![Build Status](https://travis-ci.org/ebi-gene-expression-group/anatomogram.svg?branch=master)](https://travis-ci.org/ebi-gene-expression-group/anatomogram) [![Coverage Status](https://coveralls.io/repos/github/ebi-gene-expression-group/anatomogram/badge.svg?branch=master)](https://coveralls.io/github/ebi-gene-expression-group/anatomogram?branch=master) [![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0) [![License: CC BY 4.0](https://img.shields.io/badge/License-CC%20BY%204.0-lightgrey.svg)](https://creativecommons.org/licenses/by/4.0/)

这是一个解剖图 [表达式图集](https://www.ebi.ac.uk/gxa) 我们用来说明实验.

[此处见演示](https://ebi-gene-expression-group.github.io/anatomogram/)。 。 。 .

肿瘤的ID来源于 [乌伯伦](https://npmcn.com/package/%40ebi-gene-expression-group/anatomogram/www.uberon.org), (中文(简体) ), [埃方](https://npmcn.com/package/%40ebi-gene-expression-group/anatomogram/www.ebi.ac.uk/efo) 财务报告和审定财务报表 [植物 肿瘤](https://npmcn.com/package/%40ebi-gene-expression-group/anatomogram/www.plantontology.org/)。 。 。 .

要安装 :

```bash
npm install --save @ebi-gene-expression-group/anatomogram
```

您可以将其作为反应组件 :

```js
import Anatomogram from '@ebi-gene-expression-group/anatomogram'

...

<Anatomogram .../>

```

换句话说,如果你不使用React,我们就在提供方便 `render` 方法 :

```js
import {render} from '@ebi-gene-expression-group/anatomogram'

...

render(options, target)
```

何处 `options` 是作为物体传递的道具 `target` 是 DOM 元素的标识,将包含 解剖图.

例如代码,请查看 [演示组件](https://github.com/gxa/anatomogram/blob/master/html/AnatomogramDemo.js) 我们如何使用它 [我们的表达式图集热图](https://github.com/gxa/atlas-heatmap)如果你想看到它在行动,去 [atlas中的有机体部分实验](https://www.ebi.ac.uk/gxa/experiments/E-MTAB-513) 或者说 [返回有机体部分实验的搜索](https://www.ebi.ac.uk/gxa/search?geneQuery=%5B%7B%22value%22:%22zinc%20finger%22%7D%5D)。 。 。 .

## 道具

| 名称 | 类型 | 默认值 | 说明 |
| --- | --- | :-: | --- |
| 物种 | 字符串 | \- 说吧 | 这是解剖图唯一需要的属性 |
| 显示 | 数组 | \[ |  |
| 突出显示 | 数组 | \[ |  |
| 选择索引 | 数组 | \[ |  |
| 显示颜色 | 字符串 | 灰色 |  |
| 突出显示颜色 | 字符串 | 红色 |  |
| 选择颜色 | 字符串 | 紫色 |  |
| 显示速度 | 编号 | 0.4 (中文(简体) ) |  |
| 突出显示速度 | 编号 | 0.4 (中文(简体) ) |  |
| 选择速度 | 编号 | 0.4 (中文(简体) ) |  |
| 移动 | 函数 | `() => {}` | 当鼠标被盘旋在组织上时会引用回调 |
| 移动出 | 函数 | `() => {}` | 当鼠标被从组织上徘徊时,会引用回调 |
| 点击 | 函数 | `() => {}` | 点击组织时引用回调 |
| 已输入 | 函数 | `() => {}` | 注入 SVG 时引用回调 |

关于现有物种列表 和ID有查看 [`src/json/svgsMetadata.json`](https://github.com/gxa/anatomogram/blob/master/src/json/svgsMetadata.json)。当软件包发布时,文件会自动生成.

所有三个回调都取了单一的字符串参数,即受鼠标事件影响的组织的ID.

未显示、显示、突出显示或选择组织状态。 打开 `mouseover` 增加不透明度 0.2. 您可以读取一个技术上更倾向的描述: [存储器 维基百科](https://github.com/gxa/anatomogram/wiki)。 。 。 .

## 大楼

要使用浏览器中的解剖图, 您需要构建和捆绑软件包:

```sh
npm run dist -- --output-public-path='<URL>'
```

`<URL>` uRL(绝对或相对),您将从中服务解剖图(例如. `/anatomogram/dist/` 页:1 页:1 `gh-pages` 我们用来构建演示页的分支). **记住要附上最后一刀!** 这需要这样 代码知道在哪里寻找静态资产(即SVG和PNG)。 您可以在 [网络包装 文档网站](https://webpack.js.org/configuration/output/#output-publicpath)。 。 。 .

建造后,部署 `anatomogramDemo.bundle.js` 是可选的,但前提是您想要托管演示组件.

在 HTML 中包含以下内容:

```html
<script src="<URL>/vendors.bundle.js"></script>
<script src="<URL>/anatomogram.bundle.js"></script>

<script>
anatomogram.render(options, target)
</script>
```

### 特定物种的建筑

你可以去掉所有不必要的 SVG和PNG 和改变 [`Anatomogram.defaultProps.species`](https://github.com/gxa/anatomogram/blob/master/src/Anatomogram.js#L56) 对其中任何 支持的物种。 您可以在 [页:1 `mouse` 分支](https://github.com/gxa/anatomogram/tree/mouse)。 。 。 .

## 贡献

仔细阅读 [我们的作者准则](https://github.com/gxa/anatomogram/blob/master/src/svg/README.md) 在此之前 在现有解剖图中添加新的组织或更新ID,或添加新的SVG.

运行 `npm run parseSvgs` 来解析更新的ID。 当您完成演示页的本地副本时 :

```sh
npx webpack-dev-server
```

转到 `localhost:9000` 并看到组织出现 像你想要的.

# 许可证

守则按以下方式分发: [Apache 许可证版本 2.0](https://www.apache.org/licenses/LICENSE-2.0.html)。 。 。 . 所有图像、解剖图和切换图标均在 [4.0 国际 许可证](https://creativecommons.org/licenses/by/4.0/)。 。 。 .

## 常见问题

### @ebi-gene-expression-group/anatomogram 是什么？

表达式图集热映射解析图组件

### 如何安装 @ebi-gene-expression-group/anatomogram？

在项目目录运行 npm install @ebi-gene-expression-group/anatomogram，或使用 pnpm add / yarn add / bun add。

### @ebi-gene-expression-group/anatomogram 支持 TypeScript 吗？

该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/ebi-gene-expression-group\_\_anatomogram 是否存在。

### @ebi-gene-expression-group/anatomogram 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @ebi-gene-expression-group/anatomogram 可以商用吗？

@ebi-gene-expression-group/anatomogram 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @ebi-gene-expression-group/anatomogram 的下载量有多少？

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

### @ebi-gene-expression-group/anatomogram 还在维护吗？

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