@math-pro/prism

棱柱几何结构可视化工具，支持六种棱柱的 3D 展示与展开图，并显示顶点、棱、面的元素数量。

安装

pnpm add @math-pro/prism

Peer Dependencies: react >= 18, react-dom >= 18

使用

import { PrismTool } from '@math-pro/prism'

// 完整工具（选择页 + 拆解视图）
function App() {
  return <PrismTool />
}

// 直接指定棱柱类型（跳过选择页）
function App() {
  return <PrismTool initialType="hexagonal" />
}

支持的棱柱类型

| 类型 | 名称 | 顶点 | 棱 | 面 | |------|------|------|----|----| | triangular | 三棱柱 | 6 | 9 | 5 | | cube | 正方体 | 8 | 12 | 6 | | cuboid | 长方体 | 8 | 12 | 6 | | pentagonal | 五棱柱 | 10 | 15 | 7 | | hexagonal | 六棱柱 | 12 | 18 | 8 | | octagonal | 八棱柱 | 16 | 24 | 10 |

API

<PrismTool />

| Prop | 类型 | 说明 | |------|------|------| | initialType | PrismType | 初始棱柱类型，设置后跳过选择页 | | className | string | 自定义 CSS 类名 |

子组件（按需使用）

• <PrismSelector onSelect={fn} /> — 六宫格选择页
• <PrismDetail selected={type} onSelect={fn} /> — 拆解视图（左右布局）
• <PrismThreeView prismType={type} width? height? /> — Three.js 3D 视图
• <PrismNetView prismType={type} width? height? /> — SVG 展开图

开发

pnpm build
pnpm typecheck