本项目主要依靠“编码氛围”（vibecoded）完成，请做好相应的防范措施。代码已经过真正程序员的审查，但并未针对漏洞进行加固。未经全面的安全审查，请勿对外暴露。
Quantickle 是一款交互式、以浏览器为先的工具包，用于构建和探索网络图。前端（Cytoscape.js + 自定义界面）负责渲染、编辑和布局执行，而轻量级的 Express 服务器则负责提供界面、代理集成调用，并可选择将图存储到 Neo4j 中。换句话说，浏览器掌控图的状态和可视化，而服务器则按需提供资源与集成支持。
bezier）、直线、捆绑（unbundled-bezier）、出租车（taxi）及圆角出租车选项。haystack 和 segments 曲线样式。以下是 Quantickle 能够实现的一些示例：
Quantickle 基于一组贯穿整个文档集的共享概念构建：
x、y、z 坐标。完整的空间规则及光照行为请参见 COORDINATE_SYSTEM.md。.qut 文件是标准的保存状态；它们存储节点、边、元数据和容器层级。Quantickle 图是由带有元数据的节点和边组成的集合，这些元数据驱动布局、样式和分组。
metadata、节点数组、边数组以及可选的布局或视图状态。id，以及可选的 label、type、size、color、坐标等属性。节点还可以包含 Markdown 格式的 info 或由集成使用的自定义属性。source + target 节点 ID，以及可选的 label、type、weight 和样式元数据。Quantickle 内部图 JSON 是一种扁平化结构，包含 nodes 和 edges 数组。容器关系和类作为节点元数据保存。
Quantickle 通过 文件 → 导入数据 以及自动化集成支持多种导入格式。每种导入工具都使用与保存 .qut 项目文件时相同的图处理管道，因此以下结构同样代表导出的形态。
CSV 导入器支持两种布局：
节点 + 边区段 – Quantickle 使用的导出格式，也是最安全的选项，适合手动准备数据。文件包含一个节点表，后面跟着一个空行，然后是一个边表： ```csv node_id,node_label,node_type,node_size,node_color,node_x,node_y srv-1,Gateway,server,40,#2dd4bf,100,250 cli-1,Analyst,client,28,#38bdf8,320,210
source,target,label,weight,type srv-1,cli-1,allows,1,connection
额外的列是可以接受的——导入器会规范化诸如 Node Label、nodeLabel 或 label 这样的表头，保留任何显式的 color/size 值，并在提供坐标时保留它们。
source 和 target 列的 CSV 文件。可选的列（如 label、type、weight、source_type、target_type、source_label 或 color）在存在时会被合并到生成的节点和边中： ```csv
source,target,label,source_type,target_type
srv-1,cli-1,allows,server,client
srv-1,sensor-2,monitors,server,sensor
Quantickle 不区分大小写地解析标题，接受 snake_case 和带空格的名称，并自动跳过空行。
.edges)支持纯空格分隔的边对，用于快速构建骨架图。 缺失的节点会自动创建：```text srv-1 cli-1 srv-1 sensor-2
> **注意：** Excel 工作簿 (`.xlsx`) 不再受支持。在导入到 Quantickle 之前，请将数据导出或保存为 CSV。
#### JSON
`File → Import Data` 也接受由 Quantickle 生成的 JSON 导出或原始的 Cytoscape 元素集合。当文件中包含带有嵌套 `data` 条目的 `elements` 时，它们会被归一化为 Quantickle 的内部结构。
#### Quantickle 图 (`.qut`)
`.qut` 文件是包含扁平化节点和边对象的 JSON 文档。一个最小的图结构如下所示：```json
{
"metadata": { "name": "My graph" },
"nodes": [
{ "id": "srv-1", "label": "Gateway", "type": "server", "size": 40 }
],
"edges": [
{ "id": "srv-1_cli-1", "source": "srv-1", "target": "cli-1", "label": "allows" }
]
}
在与 HTTP API 或 Neo4j 集成交换数据时，请使用与 .qut 文件相同的扁平化结构：```json
{
"nodes": [
{ "id": "srv-1", "label": "Gateway", "type": "server", "size": 40 }
],
"edges": [
{ "id": "srv-1_cli-1", "source": "srv-1", "target": "cli-1", "label": "allows" }
]
}
可选的 `info` 字段仍然支持 Markdown，并与任何自定义属性一起持久保存。
<a id="layouts"></a>
## 布局
Quantickle 将布局分为实用类别，以便您可以根据任务选择最合适的布局：
- **力导向** (force, cose, fcose) — 适用于探索性结构发现和自然聚类场景。
- **层次与流程** (breadthfirst, dagre) — 最适合依赖树、调用图或因果流。
- **网格与圆形** — 适用于仪表板、小图和导出的快速确定性布局。
- **基于时间** (timeline, timeline-scatter, temporal-attraction) — 当时间顺序或新鲜度是关键时使用。
- **空间/绝对** (absolute, depth-aware) — 用于具有已知坐标的地图式或图解式布局。
- **集群/径向** (radial-recency) — 当按类型或新鲜度环进行分组时使用。