bakoe / datacanvas Goto Github PK

Currently, a very naiive implementation of fake outlines is used for the cuboids in the WebGL scene, only based on individual faces' UV coordinates. This leads to visible artefacts in the rendering, including:

(a) Non-consistent line widths on non-uniformly sized objects
(b) A lack of outlines when objects intersect

If we decide to stick to NPR (non-photorealistic rendering), implement proper outlines, e.g., based on normal and depth G-Buffers and their respective querying in a lightweight post-processing pass.

Currently, imported CSV files are expected to use , as their delimiter. Add some kind of auto-detection for this separator (if not already present in the csv-parser module).

For instance, an additional pane or some kind of context menu could be used. Make sure that the interaction is clear on mobile devices as well.

UI/UX Ideas

• Right-click/Long-press on flow editor background/WebGL scene background(?) → Context menu with (fuzzy) search and/or grouping of nodes into categories → Respective node get added to the scene
• Additional pane with (fuzzy) search and/or grouping of nodes into categories → User clicks/taps or drag-and-drops such a node into the scene → Respective node get added to the scene
• Clicking/tapping/dragging from a handle of an existing node → Creation of (empty) placeholder node (immediately visualized) → Selection of node type (of already created placeholder node)

General tasks

Priority: Crucial

• #30
• #6

Priority: Important

• #31
• #32
• #25

Priority: Low

• #17

To-be-created/-updated nodes

Priority: Crucial

• #33

Priority: Important

• #34
• Move headless Blender rendering to corresponding output node(?) (TODO: Decide – needs ui/ux work)
• Add additional filtering nodes (TODO: specify which!)

Priority: Low

• #12
• #35
• #36
• #37
• #38
• #39

Follow-up to #8

This will be necessary since GitHub Pages does not allow setting the relevant Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy headers necessary for sandboxed SharedArrayBuffer support.

(Use lukaswagner/lasso accordingly)

The problem occurs at least on iOS devices, maybe on all touch devices. To debug, e.g, log some of the Navigation/EventModifier's events and check whether any unexpected leave, end, etc. event occurs on touch devices.

Related to: #12, #35

Example use cases:

• Importing data from TASA platform
• Streaming data from (e.g., from https://github.com/scheibel/data-generator-service) → maybe better suited by #35

Depends on:

• vitejs/vite#5699

Follow-ups:

• #9

Related to: #12, #56

Depends on:

• #8

Related to: #56, #35

Probably best done after:

• #8

Currently, only user-uploaded CSV files dragged-and-dropped into the local client are supported. Let’s extend this by allowing for remote files as well. The example apps of the csv-parser, i.e., https://github.com/lukaswagner/csv-parser/tree/master/apps/vite-ts/src/components, should show sample usage of the csv-parser to handle remote files.

(Extracted from #6)

Factor out a (functional, memoized) React component for the context menu, i.e., move all of its related state variables out of the BasicFlow component

Make sure that the interaction is clear on mobile devices as well, i.e., don't rely solely on a keyboard shortcut or a context menu entry.

Refer to, e.g., the types of data described in https://studyonline.unsw.edu.au/blog/types-of-data.

Currently, the flow editor is always in light mode. The WebGL scene is in a kind of dark mode with its dark background.

Let's allow users to switch (maybe even based on their devices' respective setting) between dark and light modes of the UI as they please.

Related to #27

Currently, all columns of a dataset node produce one individual node anchor/handle – this makes the corresponding nodes appear very large on-screen and might lead to unnecessary complexity in some use-cases.

One idea to overcome these limitations is to show dataset nodes as “collapsed” by default, indicating their columns by something like 7 columns ↓ and offering one handle of the type Dataset by default (e.g., indicated by a square handle). On-demand, users could then expand the nodes internals, showing the respective columns (e.g., 7 columns) individually with one handle each (e.g., indicated by a default circle handle).

This includes guessing of relevant columns to display in, e.g., a scatter plot (point primitive) node.