User:JamesCrook/WD-PR3

Progress reports, produced roughly every two months, about the toolbox interactive wiki diagrams code.

See: PR1, PR2 and PR3

Progress Report 3

For start of June 2020

Parallels: Biosciences and Code

Two more of the diagram types are now shown for both biosciences (left) and Audacity code development (right).

• A keyword in context index; for biology research papers (left), for Audacity bugs (right)
• An objects-on-a-curve display; for cell wall (left) and for Audio waveforms (right)

Making parallels between diagram types helps to keep the building blocks from becoming too special case. Also features refined in one context maybe prove useful in another. One perhaps would not have thought of the new feature without the pressure of the first context.

In these pairings, the 'Audacity Bugs' list has some very short titles. The exact details of how to handle that were worked out for the bugs list, and benefit the list of papers. In the 'wave' displays, the biosciences example draws attention to the need for nested curves of the 'same' shape. The audio example draws attention to the need to vary detail as you zoom in. Convergence of the 'wave' displays will produce a system that can nest curves, and with details that adjust as you zoom.

Here are the biology related demos and the other demos.

New Features

Zoomable-images

Audacity's ruler zooms in steps. The wave plot, a building block for a future in-browser replacement for Audacity, can be smoothly zoomed and panned by dragging on the ruler. The zooming and panning also works on the map.

• This is part of a 'slippy-maps'/'google-maps' style of image navigation that can be applied to generated images to reveal more detail as you zoom in.
• This zooming/panning begins the interface for navigating large biochemical pathways charts.

Chronogram

This is a variation on a bar chart.

• The chronogram is the start of unifying bar charts, spindle charts and cladograms.

A normal bar chart 'is' a chronogram, without the 'tree lines'. Unifying different kinds of chart has several advantages. The same code 'does more'. Users of the charts have a consistent API. They have fewer adjustments to make when changing diagram types. New chart types become possible, because the ways elements are combined have become more sophisticated.

Cell-wall diagrams

This 'cell wall' component repeats an object along a (Catmull-Rom spline) path.

• In the demo a schematic representation of a lipid is repeated to make a lipid bilayer.
• The object repeated could be any visual element.

I've always been bothered by how fiddly curves in Inkscape are to work with. Using Catmull-Rom splines, the control points are 'on the path' making modifying the path easier.

Image transforms

We can now rotate and reflect any component-object.

• This was first needed to make zoomable rulers work in both vertical and horizontal orientation.

Incremental Improvements

KWIC displays

• Now have 'zebra' striping to make it easier for the eye to follow a line.
• Text shorter than the line is now gapped rather than being repeated to use the space.

Tiles Display

• Now highlights the tile on hover

Fixes

• The 'i' icon no longer flickers on a click.
• Clicked detail panel no longer stays around longer than intended.
• On Safari on Catalina the 'globes' plots now use the size Safari gives, rather than the size requested. This works around a bug in Safari that led to weird/distorted maps.
• Fixed: Spurious selection when dragging on canvas.
• Fixed: Dragging stops when we drag off screen and then return.

Recap of 'Combinatorial Features'

Combinatorial features that work with multiple or all diagram types are crucial. They help us avoid just having a collection of separate diagrams, and instead create a construction kit for diagrams.

• The master-detail 'large tooltips' to annotate a diagram
• The slippy-map navigation to support navigation of diagrams
• Rotations and reflections to allow charts/diagrams in different orientations.
• Packing into layouts (Horizontal Stack, Vertical Stack and Overlay)
• Chooser to choose one from several choices of diagram
• Repeating a simple diagram along a path

Lessons / Insights

• Chronograms suggest a way to unify tree based diagrams and traditional bar and line charts.
• Code keeps 'escaping' into special case methods. I need a more powerful mechanism to deal with this problem than 'fixing it by hand' if I'm to keep the code general.