Difference between revisions of "Toolbox/PR3"

From Audacity Wiki
Jump to: navigation, search
(Fix link.)
(typo.)
 
(6 intermediate revisions by the same user not shown)
Line 10: Line 10:
  
 
==Parallels: Biosciences and Code==
 
==Parallels: Biosciences and Code==
Two more of the diagram types are now used for both biosciences (left) and source code (right).
+
Two more of the diagram types are now shown for both biosciences (left) and Audacity code development (right).
  
* A keyword in context index; for papers (left), for Audacity bugs (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), for Audio waveforms (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.
  
 
[[Image:WikidiagramsComparisons2.png|760px]]
 
[[Image:WikidiagramsComparisons2.png|760px]]
  
  
Here are the [https://wit.audacityteam.org/demos.htm?page0=GeneMentions&fromwiki=no&bio=y biology related demos].
+
Here are the [https://wit.audacityteam.org/demos.htm?page0=GeneMentions&fromwiki=no&bio=y biology related demos] and the [https://wit.audacityteam.org/demos.htm?page0=RulerPanel&fromwiki=no other demos].
  
 
==New Features==
 
==New Features==
Line 25: Line 28:
 
===Zoomable-images===
 
===Zoomable-images===
  
Audacity's ruler zooms in steps, whereas this new implementation, and the image it gives a scale for, can be smoothly zoomed and panned.  
+
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 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 begins the interface for navigating large biochemical pathways charts.
+
* This zooming/panning begins the interface for navigating large biochemical pathways charts.
  
 
[[Image:CambridgeMap.png|500px]]
 
[[Image:CambridgeMap.png|500px]]
Line 35: Line 38:
 
This is a variation on a bar chart.   
 
This is a variation on a bar chart.   
 
* The chronogram is the start of unifying bar charts, spindle charts and cladograms.
 
* 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.
  
 
[[Image:Chronogram1.png|500px]]
 
[[Image:Chronogram1.png|500px]]
Line 42: Line 47:
 
This 'cell wall' component repeats an object along a (Catmull-Rom spline) path.   
 
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.
 
* 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===
 
===Image transforms===
  
We can rotate and reflect any component-object.   
+
We can now rotate and reflect any component-object.   
 
* This was first needed to make zoomable rulers work in both vertical and horizontal orientation.
 
* This was first needed to make zoomable rulers work in both vertical and horizontal orientation.
  
Line 67: Line 75:
  
 
== Recap of 'Combinatorial Features'==
 
== Recap of 'Combinatorial Features'==
Combinatorial features that work with multiple or all diagram types are central:
+
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 master-detail 'large tooltips' to annotate a diagram
 
* The slippy-map navigation to support navigation of diagrams
 
* The slippy-map navigation to support navigation of diagrams
Line 79: Line 87:
  
 
* Chronograms suggest a way to unify tree based diagrams and traditional bar and line charts.
 
* 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 than 'fixing it by hand' to keep the code general.
+
* 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.

Latest revision as of 21:49, 9 June 2020

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.

WikidiagramsComparisons2.png


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.

CambridgeMap.png


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.

Chronogram1.png

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.