@0b5vr/automaton-with-gui 中文文档教程
automaton-with-gui
用于创意编码的动画引擎,带有 GUI!
它是原始 Automaton 引擎的扩展变体
最初为 Shift,我的 WebGL 演示
Playground!
试试我们的 playground! 它带有一堆例子。
https://0b5vr.github.io/automaton/automaton-with-gui
你可能还想查看原始自动机的例子。
Install
Include directly
automaton-with-gui.js
automaton-with-gui.min.js
automaton-with-gui.module.js
automaton-with-gui.module.min.js
.min
构建被缩小。 否则它不会缩小并带有源映射。.module
构建是 ESM。 否则就是 UMD。
如果您想使用带有 iife 的 UMD,所有内容都会以 AUTOMATON_WITH_GUI
的名称公开到全局。
您可能想使用 没有 GUI 的核心引擎 的 automaton.min.js
生产阶段。
代码如下:
const { AutomatonWithGUI } = AUTOMATON_WITH_GUI;
const data = await ( await fetch( 'automaton.json' ) ).json();
const automaton = new AutomatonWithGUI(
data,
{
gui: yourDesiredMountpointDOM
}
);
// ...
npm
https://www.npmjs.com/package/@0b5vr/automaton-with- gui
# npm install @0b5vr/automaton-with-gui
yarn add @0b5vr/automaton-with-gui
代码如下:
// const { AutomatonWithGUI } = require( '@0b5vr/automaton-with-gui' );
import { AutomatonWithGUI } from '@0b5vr/automaton-with-gui';
const data = await ( await fetch( 'automaton.json' ) ).json();
const automaton = new AutomatonWithGUI(
data, // it's okay to be `undefined`
{
gui: yourDesiredMountpointDOM
}
);
// ...
Docs
然后 -with-gui/docs/
License
automaton-with-gui
Animation engine for creative coding, with GUI!
It's an extended variant of the original Automaton engine
Originally made for Shift, my WebGL demo
Playground!
Try our playground! It comes with bunch of examples.
https://0b5vr.github.io/automaton/automaton-with-gui
You might want to also check examples of original Automaton.
Install
Include directly
automaton-with-gui.js
automaton-with-gui.min.js
automaton-with-gui.module.js
automaton-with-gui.module.min.js
.min
builds are minified. otherwise it isn't minified and comes with source maps..module
builds are ESM. otherwise it's UMD.
If you want to use the UMD one using iife, everything is exposed onto global under the name AUTOMATON_WITH_GUI
.
You might want to use automaton.min.js
of the core engine without GUI for production stage.
Code like this:
const { AutomatonWithGUI } = AUTOMATON_WITH_GUI;
const data = await ( await fetch( 'automaton.json' ) ).json();
const automaton = new AutomatonWithGUI(
data,
{
gui: yourDesiredMountpointDOM
}
);
// ...
npm
https://www.npmjs.com/package/@0b5vr/automaton-with-gui
# npm install @0b5vr/automaton-with-gui
yarn add @0b5vr/automaton-with-gui
then code like this:
// const { AutomatonWithGUI } = require( '@0b5vr/automaton-with-gui' );
import { AutomatonWithGUI } from '@0b5vr/automaton-with-gui';
const data = await ( await fetch( 'automaton.json' ) ).json();
const automaton = new AutomatonWithGUI(
data, // it's okay to be `undefined`
{
gui: yourDesiredMountpointDOM
}
);
// ...
Docs
https://0b5vr.github.io/automaton/automaton-with-gui/docs/