【亲测免费】 Ketcher 技术文档

1. 安装指南

1.1 通过 npm 安装

Ketcher 可以通过 npm 安装为 React 组件库。首先，确保你已经安装了 Node.js 和 npm。然后，在你的项目目录下运行以下命令：

npm install ketcher-react

1.2 下载预构建的应用程序

你也可以下载预构建的 Ketcher 应用程序。访问 GitHub Releases 页面，选择你需要的版本，下载对应的压缩包。解压后，你可以将应用程序嵌入到你的网页中，或者作为一个独立的页面运行。

2. 项目的使用说明

2.1 嵌入 React 组件

在你的 React 项目中，你可以通过以下方式嵌入 Ketcher：

import React from 'react';
import { Ketcher } from 'ketcher-react';

function App() {
  return (
    <div style={{ width: '100%', height: '600px' }}>
      <Ketcher />
    </div>
  );
}

export default App;

2.2 使用预构建的应用程序

如果你下载了预构建的应用程序，你可以将其嵌入到你的网页中，或者作为一个独立的页面运行。例如，你可以通过 iframe 嵌入：

<iframe src="path/to/ketcher/index.html" width="100%" height="600px"></iframe>

3. 项目 API 使用文档

Ketcher 提供了丰富的 API，允许你与编辑器进行交互。以下是一些常用的 API 方法：

3.1 获取结构表示

• getSmiles(isExtended = false): Promise<string>
  返回绘制的结构在 SMILES 格式中的字符串表示。

• getMolfile(molfileFormat): Promise<string>
  返回绘制的结构在 MOL 格式中的字符串表示。

• getRxn(molfileFormat): Promise<string>
  返回绘制的结构在 RXN 格式中的字符串表示。

3.2 设置结构

• setMolecule(structure: string): Promise<void>
  在画布上绘制传入的结构。当前结构将被移除。

• addFragment(structure: string): Promise<void>
  在画布上添加传入的结构。当前结构不会被改变。

3.3 其他功能

• layout(): Promise<void>
  对绘制的结构执行布局算法。

• recognize(image: Blob, version?: string): Promise<Struct>
  从图像中识别结构。

4. 项目安装方式

Ketcher 可以通过以下两种方式安装：

4.1 作为 React 组件库安装

通过 npm 安装：

npm install ketcher-react

4.2 下载预构建的应用程序

访问 GitHub Releases 页面，下载你需要的版本，解压后即可使用。

---

通过以上步骤，你可以轻松地将 Ketcher 集成到你的项目中，并利用其强大的功能进行化学结构的编辑和处理。