📖 什么是 Ketcher?
Ketcher 是一个开源的在线化学结构编辑器,由 EPAM Systems 开发。它提供了完整的化学结构绘制和编辑功能,可以轻松嵌入到网页应用中。主要特性包括:
- 完整的化学结构编辑器
- 直观的用户界面
- 支持多种文件格式(MOL, SDF, SMILES, InChI 等)
- 反应式绘制
- 模板库
- 完全开源免费
✏️ 交互式结构编辑器
下方是一个完整的 Ketcher 化学结构编辑器,你可以直接在其中绘制和编辑分子结构:
🚀 快速加载示例
点击下方按钮快速加载预定义的分子结构:
🔤 SMILES 字符串输入
在下方输入 SMILES 字符串,然后点击"加载"按钮来在编辑器中显示分子结构:
💾 导出结构
将当前编辑的结构导出为不同格式:
💻 代码示例
基本用法
// 1. 引入 Ketcher 库
<link rel="stylesheet" href="https://unpkg.com/ketcher/dist/ketcher.min.css">
<script src="https://unpkg.com/ketcher/dist/ketcher.min.js"></script>
// 2. 创建编辑器容器
<div id="ketcher"></div>
// 3. 初始化编辑器
var ketcher = new Ketcher(document.getElementById('ketcher'));
从 SMILES 加载
// 从 SMILES 字符串加载分子
ketcher.setMolecule('CCO'); // 乙醇
// 或者使用 Promise
ketcher.setMolecule('CCO').then(function() {
console.log('分子已加载');
});
导出结构
// 导出为 SMILES
ketcher.getSmiles().then(function(smiles) {
console.log('SMILES:', smiles);
});
// 导出为 MOL
ketcher.getMolfile().then(function(mol) {
console.log('MOL:', mol);
});
// 导出为 InChI
ketcher.getInchi().then(function(inchi) {
console.log('InChI:', inchi);
});
// 导出为 SVG
ketcher.getSvg().then(function(svg) {
console.log('SVG:', svg);
});
监听结构变化
// 监听结构变化事件
ketcher.editor.subscribe('change', function() {
console.log('结构已改变');
// 获取当前结构
ketcher.getSmiles().then(function(smiles) {
console.log('当前 SMILES:', smiles);
});
});
🌟 主要功能特性
| 功能 | 说明 |
|---|---|
| 完整编辑器 | 提供完整的化学结构绘制和编辑功能 |
| 直观界面 | 用户友好的图形界面 |
| 文件格式支持 | 支持 MOL, SDF, SMILES, InChI, SVG 等多种格式 |
| 反应式绘制 | 可以绘制化学反应方程式 |
| 模板库 | 内置常用化学结构模板 |
| API 支持 | 提供完整的 JavaScript API |
🔗 更多资源
• Ketcher 官方网站: https://lifescience.opensource.epam.com/ketcher/
• GitHub: https://github.com/epam/ketcher
• 文档: https://lifescience.opensource.epam.com/ketcher/demo.html