pts

环境要求

• Node.js 与 npm 环境（使用 npm install pts 方式时）
• 一个可加载脚本的 HTML 页面或前端工程（使用 CDN/script 方式时）
• 支持 Canvas、SVG 或 WebGL 的现代浏览器
• 若在 React 中使用，可配合 react-pts-canvas 组件

安装与启动步骤

1. 1安装 pts 依赖

   在项目根目录执行 npm 安装命令。安装完成后即可在代码中按需引入 Pts 的各个模块。

   npm install pts

   复制

2. 2按需引入模块

   在 JS/TS 文件中从 pts 导入需要的类，例如 CanvasSpace、Pt、Group、Line，避免引入全部代码。

   import {CanvasSpace, Pt, Group, Line} from 'pts';

   复制

3. 3或使用 CDN 引入

   不想走打包流程时，可直接在 HTML 中用 script 标签加载 dist 下的 pts.js/pts.min.js，或使用 jsdelivr、cdnjs、unpkg 的 CDN 地址。

   <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/williamngan/pts/dist/pts.min.js"></script>

   复制

4. 4克隆入门示例

   官方 pts-starter-kit 示例基于 npm 和 webpack，可克隆到本地学习完整的项目结构。

   git clone https://github.com/williamngan/pts-starter-kit.git

   复制

5. 5查阅指南与示例

   阅读官网指南的 Get Started 章节，并浏览 demos 及其源码，快速掌握常用 API 的用法。

如何确认成功

代码中导入 pts 无报错，且页面能通过 CanvasSpace 正常绘制出图形，即表示接入成功。

常见问题

注意事项

• Pts 支持按需引入模块，建议只导入用到的类以控制打包体积。
• 官方提供了 pts-starter-kit（npm + webpack）和 pts-react-example 等示例仓库，适合快速上手。
• 官网 ptsjs.org 提供 Get Started 指南与大量 demos，可结合源码学习。