Vuer package#

Module contents#

class vuer.Vuer(_deps=None, **overrides)#

Bases: PrefixProto, Server

A Vuer is a document that can be rendered in a browser.

WEBSOCKET_MAX_SIZE = 268435456#
cors = 'https://vuer.ai,https://dash.ml,http://localhost:8000,http://127.0.0.1:8000,*'#
device = 'cuda'#
domain = 'https://vuer.ai'#
free_port = True#
host = 'localhost'#
name = 'vuer'#
port = 8012#
queries = {}#
queue_len = 100#
static_root = '.'#
uri = 'ws://localhost:8012'#

vuer.base module#

class vuer.base.Server#

Bases: object

WEBSOCKET_MAX_SIZE = 268435456#
cors = Proto(default='*', dtype=<class 'str'>, help=":str '*' Enable CORS", metavar='\x08')#
host = Proto(default='localhost', dtype=<class 'str'>, help=":str 'localhost' ", metavar='\x08')#
port = Proto(default=8012, dtype=<class 'int'>, help=':int 8012 ', metavar='\x08')#
run()#
async vuer.base.default_handler(request, ws)#
async vuer.base.handle_file_request(request, root)#
async vuer.base.websocket_handler(request, handler, **ws_kwargs)#

vuer.events module#

class vuer.events.Add(*elements: List[Element], to: str | None = None)#

Bases: ServerEvent

ADD Operator is used to insert new nodes to the scene graph. By default it inserts into the root node, but you can specify a parent node to insert into via the to argument.

Note: only supports a single parent key right now.

Example:

app.add @ Element(…)

app.add @ [ Element(…), Element(…), … ]

app.add(Element, to=”my_parent_key”)

app.add([Element, …], to=”my_parent_key”)

etype = 'ADD'#
serialize()#

Serialize the event to a dictionary for sending over the websocket. :return: A dictionary representing the event.

class vuer.events.ClientEvent(etype=None, **kwargs)#

Bases: Event

value = None#
class vuer.events.End(**kwargs)#

Bases: ServerEvent

A higher-level ServerEvent that wraps other ServerEvents

etype = 'TERMINATE'#
class vuer.events.Event#

Bases: object

An event is a message sent from the server to the client.

class vuer.events.Frame(data: ServerEvent, frame_rate=60.0, **kwargs)#

Bases: ServerEvent

A higher-level ServerEvent that wraps other ServerEvents

ServerEvent: ServerEvent#
etype = 'FRAME'#
class vuer.events.GrabRender(key='DEFAULT', **kwargs)#

Bases: ServerRPC

A higher-level ServerEvent that wraps other ServerEvents

etype = 'GRAB_RENDER'#
uuid: str#
class vuer.events.InitEvent(**kwargs)#

Bases: ClientEvent

class vuer.events.Noop(**kwargs)#

Bases: ServerEvent

etype = 'NOOP'#
class vuer.events.NullEvent(**kwargs)#

Bases: ClientEvent

class vuer.events.Remove(*keys: List[str], **kwargs)#

Bases: ServerEvent

An Update ServerEvent is sent to the client when the server wants to update the client’s state. It appends the data sent in the Update ServerEvent to the client’s current state.

etype = 'REMOVE'#
class vuer.events.ServerEvent(data, etype=None, **kwargs)#

Bases: Event

serialize()#

Serialize the event to a dictionary for sending over the websocket. :return: A dictionary representing the event.

class vuer.events.ServerRPC(data, uuid=None, **kwargs)#

Bases: ServerEvent

etype = 'RPC'#
rtype = 'RPC_RESPONSE@{uuid}'#
uuid: str#
class vuer.events.Set(data: Type[Scene])#

Bases: ServerEvent

SET Operator is used exclusively to set the root Scene node. Throws an error (on the client side) if the data is not a Scene object.

etype = 'SET'#
class vuer.events.Update(*elements: List[Element], strict=False)#

Bases: ServerEvent

UPDATE Operator is used to update a specific node in the scene graph.

Use “$delete” value for elements you want to remove. Or “$strict” mode to copy the element verbatim.

Example:

app.update @ { “key”: “my_key”, “value”: “$delete” }

app.update({ “key”: “my_key”, “value”: “$delete” }, strict=True)

app.update @ [ { “key”: “my_key”, “value”: “$delete” }, … ]

app.update({ “key”: “my_key”, “value”: “$delete” }, …, strict=True)

etype = 'UPDATE'#
serialize()#

Serialize the event to a dictionary for sending over the websocket. :return: A dictionary representing the event.

class vuer.events.Upsert(*elements: List[Element], to: str | None = None, strict=False)#

Bases: ServerEvent

UPSERT Operator is used to update nodes to new values, when then they do not exist, insert new ones to the scene graph.

Note: only supports a single parent key right now.

Example:

app.upsert @ Element(…)

app.upsert @ [ Element(…), Element(…), … ]

app.upsert(Element, to=”my_parent_key”)

app.upsert([Element, …], to=”my_parent_key”)

etype = 'UPSERT'#
serialize()#

Serialize the event to a dictionary for sending over the websocket. :return: A dictionary representing the event.

vuer.schemas module#

class vuer.schemas.AmbientLight(*children, **kwargs)#

Bases: SceneElement

tag: str = 'AmbientLight'#
class vuer.schemas.AutoScroll(*children, **kwargs)#

Bases: BlockElement

tag: str = 'AutoScroll'#
class vuer.schemas.BlockElement(*children, **kwargs)#

Bases: Element

serialize()#

Serialize the element to a dictionary for sending over the websocket. :return: Dictionary representing the element.

class vuer.schemas.Bold(text, style=None, **kwargs)#

Bases: Text

class vuer.schemas.Box(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Box'#
class vuer.schemas.Button(**kwargs)#

Bases: Element

A Button element is an element that allows the user to click on it. It is represented by a button element in the DOM.

tag: str = 'Button'#
class vuer.schemas.CameraHelper(*children, **kwargs)#

Bases: SceneElement

tag: str = 'CameraHelper'#
class vuer.schemas.CameraView(*children, **kwargs)#

Bases: SceneElement

tag: str = 'CameraView'#
class vuer.schemas.Capsule(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Capsule'#
class vuer.schemas.Circle(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Circle'#
class vuer.schemas.Cone(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Cone'#
class vuer.schemas.CoordsMarker(*children, **kwargs)#

Bases: SceneElement

tag: str = 'CoordsMarker'#
class vuer.schemas.Cylinder(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Cylinder'#
class vuer.schemas.DefaultScene(*children, rawChildren=None, htmlChildren=None, bgChildren=[], show_helper=True, startStep=0, endStep=None, up=[0, 0, 1], **kwargs)#

Bases: Scene

class vuer.schemas.DirectionalLight(*children, **kwargs)#

Bases: SceneElement

tag: str = 'DirectionalLight'#
class vuer.schemas.Dodecahedron(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Dodecahedron'#
class vuer.schemas.Edges(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Edges'#
class vuer.schemas.Element(key=None, **kwargs)#

Bases: object

Base class for all elements

serialize()#

Serialize the element to a dictionary for sending over the websocket. :return: Dictionary representing the element.

tag: str = 'div'#
class vuer.schemas.Extrude(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Extrude'#
class vuer.schemas.Fog(*children, **kwargs)#

Bases: SceneElement

Fog is a scene element that adds fog to the scene. This can be used to approximate depth.

Arguments:

args: color, near, far

Example Usage:

Fog(args=[0xcccccc, 10, 15])

tag: str = 'fog'#
class vuer.schemas.Frustum(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Frustum'#
class vuer.schemas.Gamepads(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Gamepads'#
class vuer.schemas.Glb(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Glb'#
class vuer.schemas.GrabRender(*children, **kwargs)#

Bases: SceneElement

tag: str = 'GrabRender'#
class vuer.schemas.Grid(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Grid'#
class vuer.schemas.Gripper(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Gripper'#
vuer.schemas.Header#

alias of Header1

class vuer.schemas.Header1(*children, **kwargs)#

Bases: BlockElement

A Text element is an element that displays text. It is represented by a text, or p element in the DOM.

tag: str = 'h1'#
class vuer.schemas.Header2(*children, **kwargs)#

Bases: Header1

Header 2

tag: str = 'h2'#
class vuer.schemas.Header3(*children, **kwargs)#

Bases: Header1

Header 2

tag: str = 'h3'#
class vuer.schemas.Html(*children, **kwargs)#

Bases: SceneElement

as=’div’ // Wrapping element (default: ‘div’)

wrapperClass // The className of the wrapping element (default: undefined) prepend // Project content behind the canvas (default: false) center // Adds a -50%/-50% css transform (default: false) [ignored in transform mode] fullscreen // Aligns to the upper-left corner, fills the screen (default:false) [ignored in transform mode] distanceFactor={10} // If set (default: undefined), children will be scaled by this factor, and also by distance to a PerspectiveCamera / zoom by a OrthographicCamera. zIndexRange={[100, 0]} // Z-order range (default=[16777271, 0]) portal={domnodeRef} // Reference to target container (default=undefined) transform // If true, applies matrix3d transformations (default=false) sprite // Renders as sprite, but only in transform mode (default=false) calculatePosition={(el: Object3D, camera: Camera, size: { width: number; height: number }) => number[]} // Override default positioning function. (default=undefined) [ignored in transform mode] occlude={[ref]} // Can be true or a Ref<Object3D>[], true occludes the entire scene (default: undefined) onOcclude={(visible) => null} // Callback when the visibility changes (default: undefined) {…groupProps} // All THREE.Group props are valid {…divProps} // All HTMLDivElement props are valid

tag: str = 'Html'#
class vuer.schemas.Icosahedron(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Icosahedron'#
class vuer.schemas.Image(data: str | ndarray | PIL.Image.Image | None = None, *, src: str | None = None, format='png', **kwargs)#

Bases: Element

An Image element is an element that displays an image. It is represented by an img element in the DOM.

tag: str = 'Img'#
class vuer.schemas.ImageBackground(data: str | ndarray | PIL.Image.Image | None = None, *, src: str | None = None, format='png', **kwargs)#

Bases: Image, SceneElement

Sets the background of the scene to an image, Supports high frame rates.

We use a plane that is always facing the camera to display the image.

tag: str = 'ImageBackground'#
class vuer.schemas.ImageUpload(**kwargs)#

Bases: Element

A ImageUpload element is an element that allows the user to upload a file. It is represented by a file upload element in the DOM.

tag: str = 'ImageUpload'#
class vuer.schemas.InputBox(**kwargs)#

Bases: Element

An InputBox is an element that allows the user to input text. It is represented by an input element in the DOM.

tag: str = 'Input'#
class vuer.schemas.Italic(text, style=None, **kwargs)#

Bases: Text

class vuer.schemas.Lathe(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Lathe'#

Bases: Text

tag: str = 'a'#
class vuer.schemas.LumaSplats(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Splats'#
class vuer.schemas.Markdown(*children, **kwargs)#

Bases: BlockElement

tag: str = 'Markdown'#
class vuer.schemas.Movable(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Movable'#
class vuer.schemas.Obj(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Obj'#
class vuer.schemas.Octahedron(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Octahedron'#
class vuer.schemas.Page(*children, **kwargs)#

Bases: BlockElement

A Page is an element that contains other elements. It is represented by a div element in the DOM.

tag: str = 'article'#
class vuer.schemas.Paragraph(*children, **kwargs)#

Bases: BlockElement

A Text element is an element that displays text. It is represented by a text, or p element in the DOM.

tag: str = 'p'#
class vuer.schemas.Pcd(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Pcd'#
class vuer.schemas.Pivot(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Pivot'#
class vuer.schemas.Plane(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Plane'#
class vuer.schemas.Ply(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Ply'#
class vuer.schemas.PointCloud(*children, **kwargs)#

Bases: SceneElement

children = []#
colors: ndarray[Any, dtype[uint8]] = None#
tag: str = 'PointCloud'#
vertices: ndarray[Any, dtype[float16]] = None#
class vuer.schemas.PointLight(*children, **kwargs)#

Bases: SceneElement

tag: str = 'PointLight'#
class vuer.schemas.PointerControls(*children, **kwargs)#

Bases: SceneElement

tag: str = 'PointerControls'#
class vuer.schemas.Polyhedron(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Polyhedron'#
class vuer.schemas.Ring(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Ring'#
class vuer.schemas.Scene(*children, rawChildren=None, htmlChildren=None, bgChildren=None, up=[0, 0, 1], **kwargs)#

Bases: BlockElement

serialize()#

Serialize the element to a dictionary for sending over the websocket. :return: Dictionary representing the element.

tag: str = 'Scene'#
class vuer.schemas.SceneBackground(data: str | ndarray | PIL.Image.Image | None = None, *, src: str | None = None, format='png', **kwargs)#

Bases: Image, SceneElement

Sets the background of the scene to a static image. Does not work well with high frame rates. For displaying movies, use the ImageBackground element.

tag: str = 'SceneBackground'#
class vuer.schemas.SceneElement(*children, **kwargs)#

Bases: BlockElement

class vuer.schemas.Shape(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Shape'#
class vuer.schemas.SkeletalGripper(*children, **kwargs)#

Bases: SceneElement

tag: str = 'SkeletalGripper'#
class vuer.schemas.Slider(**kwargs)#

Bases: Element

A Slider element is an element that allows the user to slide a value. It is represented by a slider element in the DOM.

tag: str = 'Slider'#
class vuer.schemas.Sphere(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Sphere'#
class vuer.schemas.Splat(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Splat'#
class vuer.schemas.SpotLight(*children, **kwargs)#

Bases: SceneElement

tag: str = 'SpotLight'#
class vuer.schemas.Tetrahedron(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Tetrahedron'#
class vuer.schemas.Text(*text, sep=' ', **kwargs)#

Bases: Element

A Text element is an element that displays text. It is represented by a text, or p element in the DOM.

tag: str = 'Text'#
class vuer.schemas.TimelineControls(*children, **kwargs)#

Bases: SceneElement

tag: str = 'TimelineControls'#
class vuer.schemas.Torus(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Torus'#
class vuer.schemas.TorusKnot(*children, **kwargs)#

Bases: SceneElement

tag: str = 'TorusKnot'#
class vuer.schemas.TriMesh(*children, **kwargs)#

Bases: SceneElement

children = []#
colors: ndarray[Any, dtype[uint8]] = None#
faces: ndarray[Any, dtype[uint32]] = None#
tag: str = 'TriMesh'#
vertices: ndarray[Any, dtype[float16]] = None#
class vuer.schemas.Tube(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Tube'#
class vuer.schemas.Urdf(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Urdf'#
class vuer.schemas.Wireframe(*children, **kwargs)#

Bases: SceneElement

tag: str = 'Wireframe'#
class vuer.schemas.div(*children, **kwargs)#

Bases: BlockElement

tag: str = 'Div'#
class vuer.schemas.group(*children, **kwargs)#

Bases: SceneElement

children = []#
tag: str = 'group'#
class vuer.schemas.mesh(*children, **kwargs)#

Bases: SceneElement

children = []#
tag: str = 'mesh'#

vuer.serdes module#

vuer.serdes.b64jpg(image, quality: int = 90)#

base64 encode the image into a string, using JPEG encoding

Does not support transparency.

vuer.serdes.b64png(image)#

base64 encode the image into a string, using PNG encoding

vuer.serdes.jpg(image, quality: int = 90)#

base64 encode the image into a string, using JPEG encoding

Does not support transparency.

vuer.serdes.png(image)#

base64 encode the image into a string, using PNG encoding

vuer.serdes.serializer(data)#

vuer.server module#

class vuer.server.At(fn)#

Bases: object

Proxy Object for using the @ notation. Also supports being called direction, which supports more complex arguments.

class vuer.server.Vuer(_deps=None, **overrides)#

Bases: PrefixProto, Server

A Vuer is a document that can be rendered in a browser.

WEBSOCKET_MAX_SIZE = 268435456#
cors = 'https://vuer.ai,https://dash.ml,http://localhost:8000,http://127.0.0.1:8000,*'#
device = 'cuda'#
domain = 'https://vuer.ai'#
free_port = True#
host = 'localhost'#
name = 'vuer'#
port = 8012#
queries = {}#
queue_len = 100#
static_root = '.'#
uri = 'ws://localhost:8012'#
class vuer.server.VuerProxy(vuer: Vuer, ws_id: int, queue_len=100)#

Bases: object

property add: At#

Used to add elements to a specific parent.

Requires a parentKey, or treats the Scene root node as the default parent.

Example Usage:

app.add(element1, element2, …, to=parentKey.)

or using the Scene root node as the default parent:

app.add @ element1

clear()#

clears all client messages

async grab_render(ttl=2.0, **kwargs) ClientEvent#

Grab a render from the client.

Parameters:
  • quality – The quality of the render. 0.0 - 1.0

  • subsample – The subsample of the render.

  • ttl – The time to live for the handler. If the handler is not called within the time it gets removed from the handler list.

pop()#
popleft()#
property remove: At#

Remove elements by keys.

Example Usage:

app.remove @ [“key1”, “key2”, …]

or a single key:

app.remove @ “key1”

property set: At#

Used exclusively to set the scene.

the @SET operator is responsible for setting the root node of the scene.

Examples:

proxy @ Set(Scene(children=[…]))

or

app.set @ Scene(children=[…])

stream()#
property update: At#

Used to update existing elements. NOOP if an element does not exist.

Supports passing in a list of elements. (Thank God I implemented this… so handy! - Ge)

Example Usage:

app.update @ [element1, element2, …]

property upsert: At#

Upsert elements to a specific parent.

Requires a parentKey, or treats the Scene root node as the default parent.

Example Usage:

app.upsert(element1, element2, …, to=parentKey.)

or using the Scene root node as the default parent:

app.upsert @ element1

vuer.types module#

class vuer.types.Body(position, rotation, scale)#

Bases: tuple

position: Vector3#

Alias for field number 0

rotation: Euler#

Alias for field number 1

scale: float#

Alias for field number 2

class vuer.types.Euler(x, y, z, order)#

Bases: tuple

order: str#

Alias for field number 3

x: int#

Alias for field number 0

y: int#

Alias for field number 1

z: int#

Alias for field number 2

class vuer.types.EulerDeg(x: int, y: int, z: int, order: str = 'XYZ')#

Bases: Euler

to_rad() Euler#
unit: str = 'deg'#
class vuer.types.RenderNode#

Bases: object

class vuer.types.Vector3(x, y, z)#

Bases: tuple

x#

Alias for field number 0

y#

Alias for field number 1

z#

Alias for field number 2