使用方法
Browser
UMD
使用 CDN 上的 UMD 版本:
<script src="https://cdn.jsdelivr.net/npm/@pintora/standalone/lib/pintora-standalone.umd.js"></script>
<script>
pintora.default.initBrowser()
</script>
一个 CodePen 的例子:
ESM
使用 Skaypack 上的 ESM 版本:
<script type="module">
import pintora from 'https://cdn.skypack.dev/@pintora/standalone'
pintora.initBrowser()
</script>
一个 CodePen 的例子,使用 ESM 版本,以及注册和使用自定义主题:
Browser and Web Components
pintora-stencil - Pintora Web Components, this project comes with web component for showing pintora diagram preview, add it into your website simply by import some script tags.
CLI
@pintora/cli 是一个 Node.js 下的命令行程序,可快速生成图片。
全局安装:
npm i -g @pintora/cli
使用 pintora --help
看帮助信息:
pintora [command]
Commands:
pintora render Render DSL to diagram image
Options:
--version Show version number [boolean]
--help Show help [boolean]
pintora render
pintora render
Render DSL to diagram image
选项:
--version 显示版本号 [布尔]
--help 显示帮助信息 [布尔]
-i, --input Input file path [必需]
-o, --output Output file path
-p, --pixel-ratio Pixel ratio [默认值: 2]
-b, --background-color Background color [默认值: "#fff"]
-t, --theme Pintora theme [默认值: "default"]
-w, --width 画布宽度
几个例子:
pintora render -i ../test-shared/example-files/sequence.pintora -o sequence.png
# 可以通过 -b 设置背景色
pintora render -i ../test-shared/example-files/sequence-2.pintora -b "#FAFAFA" -o sequence-2.jpg
# 通过 `--theme` 指定 pintora 主题为 `dark`
pintora render -i ../test-shared/example-files/sequence-2.pintora --theme dark -o sequence-2.jpg
# 通过 `--width` 指定输出图片宽度为 1000,且自动设置 `core.useMaxWidth` 为 true
pintora render -i ../test-shared/example-files/sequence.pintora --width 1000 -o sequence-w-1000.jpg