Web visualization

Web visualization#

module:

navground.sim.ui

Displays the world on HTML client views. The state is synchronized through websockets.

After creating an instance, you need to call prepare() to finalize the initialization of the websocket server, else the HTML clients will not be able to connect.

>>> ui = WebUI()
>>> await ui.prepare()
>>> # initialize the views with the current state of the world
>>> world = ...
>>> await ui.init(world)
>>> # update the world, for example with
>>> world.update(0.1)
>>> # synchronize the views
>>> await ui.update(world)
>>> # set entity attributes, for example to change the color of the first agent
>>> await ui.set(world.agents[0], style="fill:red")
>>> # or analogously
>>> await ui.set_color(world.agents[0], "red")

In general, users will not use this class directly but delegate updating the view to navground.sim.real_time.RealTimeSimulation or navground.sim.replay.RealTimeReplay, like the following:

>>> ui = WebUI(host='127.0.0.1')
>>> await ui.prepare()
>>> sim = RealTimeSimulation(..., web_ui=ui)
>>> await sim.run()
__init__(host: str = '0.0.0.0', port: int = 8000, max_rate: float = 30, display_deadlocks: bool = False, display_collisions: bool = False, decorate: Decorate | None = None) → None#

Constructs a new instance.

Parameters:

  • host – The host address serving the HTML page.

  • port – The port serving the HTML page.

  • max_rate – The maximum synchronization rate [fps]

  • display_deadlocks – Whether to color deadlocked agents

  • display_collisions – Whether to color agents in collision

  • decorate – A function to decorate entities, called at each update

Initialize the client views to display a world

Parameters:

  • world – The world to be displayed

  • bounds – The area to display. If not set, it will displays an area that contains all world entities at their current positions

Initialize the websockets server

Returns:

If the server could be initialized

Set attributes for an entity

Parameters:

  • entity – The entity

  • kwargs – The attributes (string-valued)

Sets the background color.

Parameters:

color – The color

Sets the color of an entity.

Parameters:

  • entity – The entity

  • color – The color

Synchronized all client views with the current world state.

Parameters:

world (World) – The world

Returns:

{ description_of_the_return_value }

Return type:

None

Returns:

The number of connected client views.

Contents