[Todo]

UI​

General UI Improvements​

We generally improved the UI, including the addition of a sidebar, to deliver a sleeker and more comfortable experience.

We improved the usability of the UI under different conditions like when the window gets too small.

Empty Panel Copy​

We added copy and a subtle design to panels that are empty to indicate that an action (like loading a trace) is required before they become active.

Clip: Empty Panels

Layer Editor Panel Redesign​

Previously, the layer editor is presented as a modal. It required multiple clicks to load a file and the interface is a bit confusing. In this version, the layer editor is redesigned as a popover and is significantly more usable.

Clip: Layer Editor

Steps Panel Redesign​

Previously, the playback controls tend to be hidden from immediate sight due to all controls being on the main toolbar. In this version, the playback controls are separated into their own island.

Event Properties View​

We added a way to view all of the properties of an event. This can be opened through clicking on See All Properties of an event in the Steps panel.

Panel Management​

We added the ability reorganise your panels by moving them around. You can do this by dragging the handle in the top left corner.

System​

Error Handling​

We introduced a per-layer error API that displays an error label when a layer encounters a problem. For example, if a map couldn't load correctly.

Clip: Error Handling

Workspaces​

We introduced a simple import/export mechanism for quickly sharing or restoring your work. This can be found in the title bar menu (Workspace > Open Workspace, Workspace > Save Workspace).

Publish Workspaces​

We designed a simple way to export your workspaces with metadata. In the future, you'll be able to upload these to a community repository.

Drag and Drop​

You can now drag and drop any assortment of files into the visualiser.

Clip: Drag and Drop

Filesystem Bridge Adapter (Experimental)​

To help with development and debugging workflows, we provided a way to see live update of search traces. With the right tooling, you'll be able to make changes to your code and then immediately see its visualisation. We're still refining this feature.

Features​

Explore​

We added a hub for new users to try out built-in visualisations.

For new users, this panel would display on start-up.

Fit to Viewport​

We introduced a way to fit specific layers to the viewport.

Clip: Fit to Viewport

Filter Steps by Type​

We added the ability to filter events in the Steps view by event type.

Debugger Improvements​

The debugger was updated with some new features. In the standard editor, you can now specify to break when a value changed from its parent. In the advanced editor, you now get access to parent and children variables.

2D Renderer​

Performance Improvements​

We slightly improved perceived performance by increasing resolution when playback is paused and decreasing resolution when it is playing. We also implement dynamic framerate so the playback should feel more consistent.

Known Issues

See issues on our bug tracker.

Releases

See releases for v1.2.0 here.

Changes​

Architecture Changes​

UI Overhaul​

Posthoc is completely rebuilt to support dynamic and reconfigurable panels, so you can adjust the UI to fit your workflow or use case. Check out the use cases section for examples.

Layers​

Visualise what you need by adding it as a layer to the app.

Trace Layer​

The Trace layer renders a search trace. Search traces are JSON documents produced by pathfinding solvers that record steps in the search process.

Map Layer​

The Map layer renders maps in a supported format.

Query Layer​

The Query layer interfaces with solvers to display search traces for arbitrary problem instances.

Extensible Renderer System​

Renderers (a.k.a. the Viewport panel) can now be added to Posthoc via extensions (the exact implementation is work-in-progress). This will allow for future renderers to be added with ease (for example, a 3D renderer).

Layers Panel​

Manage view layers using the Layers panel.

Viewport Panel​

The Viewport panel renders your layers by making use of an installed renderer (by default, the 2D renderer). You can choose which layers to render, as well as auto-fit the contents to the viewport, or display the contents at 1:1 scale.

Tree Panel​

If your pathfinding search problem does not have a convenient spatial embedding (or if you just wanted to), you can also visualise any search trace in a hierarchal format with the Tree panel. You can choose how many nodes to render at once.

Steps Panel​

View and replay the recorded events of the search process using the Steps panel.

Debugger Panel​

Debug a search trace using the Debugger panel. This feature is currently non-functional in version 1.0.4.

Settings Panel​

Manage connections to solvers and renderers in the Settings panel.

Logs Panel​

Posthoc will keep a record of all alerts in the Logs panel.

Features​

2D Renderer (Built-in)​

The basic 2D renderer is built to be reliable and highly performant. Internally, it delegates rendering to background processes. The main process figures out which sections of the screen needs to be repainted (and what resolution) and requests those tiles from the subprocesses.

Click here for full size

Grid, Network (XY), Poly, Mesh Map Support​

There is built-in support for grid (.grid/.map), network (.co/.gr/.xy), mesh (.mesh), and polygon (.poly) map files. Conversions may be required.

Large Map Rendering Support​

The renderer and map parser performs optimisations to handle the rendering of large maps.

Click here for full size

Use Cases​

Visualising a Search Trace​

Load a search trace and map into Posthoc.

Click here for full size

Interacting with a Search Trace (Viewport, Steps and Tree)​

Move around a search trace through the Viewport, Tree, and Steps panel.

Click here for full size

Creative Use of the Search Trace Format (Polyanya)​

The example uses the search trace format to tell the renderer to draw each event in the search process as a triangle.

Creative Use of the Search Trace Format (9-Tile)​

This example uses the search trace format to tell the renderer how to display the current state of a 9-tile puzzle.

Running a Search Query​

This example runs a query using Warthog (WebAssembly) over a grid map.

Click here for full size

Comparison of Two Traces​

This example compares the search process of two A* implementations, one as a Search Trace file, and another as a query. We display these side-by-side.

Click here for full size

Releases​

Posthoc Standalone (Electron) for Windows​

Get Posthoc as a standalone application for Windows.

View Releases

Posthoc Standalone (Electron) for Linux​

Get Posthoc as a standalone application for Linux.

View Releases

Posthoc PWA (GitHub Pages)​

Use Posthoc in your browser, or install it as a web app.

Open Posthoc

Warthog (WebAssembly) Solver Adapter​

This is the Warthog solver compiled to WebAssembly. Add this URL as a Web Worker connection in Posthoc (it should also be there by default).

https://cdn.jsdelivr.net/gh/path-visualiser/app@adapter-warthog-wasm-dist/warthog-wasm.mjs

Warthog (Socket.io/WebSocket) Solver Adapter​

This is the Warthog solver running behind an adapter server. The adapter translates requests into Warthog problem instances, and converts Warthog output into the search trace format. The visualiser and solver communicates through a WebSocket channel.

git clone https://github.com/ShortestPathLab/posthoc-app
cd ./app/adapter-warthog-websocket
npm i
npm start

Then, as prompted, add the server's URL as a Socket.io connection in Posthoc.

Iron Harvest Map Adapter​

This is an example adapter that exclusively serves iron harvest grid maps to demonstrate how you could serve maps as well as run search queries.

git clone https://github.com/ShortestPathLab/posthoc-app
cd ./app/adapter-iron-harvest
npm i
npm start

Then, as prompted, add the server's URL as a Socket.io connection in Posthoc.

Known Issues​

Freeze on Large Search Traces​

Posthoc may freeze when the search trace contains too many steps. This is due to the inefficient way the path is currently calculated.

Cannot Choose Source and Destination Nodes for Queries on Network Maps​

Currently, queries on the network maps will force the source and destination nodes to be 0.