@genome-spy/core 0.19.1 → 0.22.0

package/dist/schema.json

@@ -478,6 +478,9 @@
         "baseUrl": {
           "type": "string"
         },
+        "columns": {
+          "type": "number"
+        },
         "concat": {
           "items": {
             "anyOf": [
@@ -575,7 +578,14 @@
           "type": "number"
         },
         "title": {
-          "type": "string"
+          "anyOf": [
+            {
+              "type": "string"
+            },
+            {
+              "$ref": "#/definitions/Title"
+            }
+          ]
         },
         "transform": {
           "items": {
@@ -606,7 +616,8 @@
         }
       },
       "required": [
-        "concat"
+        "concat",
+        "columns"
       ],
       "type": "object"
     },
@@ -1335,7 +1346,14 @@
           "type": "number"
         },
         "title": {
-          "type": "string"
+          "anyOf": [
+            {
+              "type": "string"
+            },
+            {
+              "$ref": "#/definitions/Title"
+            }
+          ]
         },
         "transform": {
           "items": {
@@ -1624,7 +1642,14 @@
           "type": "object"
         },
         "title": {
-          "type": "string"
+          "anyOf": [
+            {
+              "type": "string"
+            },
+            {
+              "$ref": "#/definitions/Title"
+            }
+          ]
         },
         "transform": {
           "items": {
@@ -1633,7 +1658,7 @@
           "type": "array"
         },
         "view": {
-          "$ref": "#/definitions/ViewConfig"
+          "$ref": "#/definitions/ViewBackground"
         },
         "visible": {
           "description": "Visibility of the view. An invisible view is removed from the layout and not rendered.\n\n**Default:** `true`",
@@ -1791,9 +1816,6 @@
           "description": "The vertical offset between the text and its anchor point, in pixels. Applied after the rotation by `angle`.",
           "type": "number"
         },
-        "dynamicData": {
-          "type": "boolean"
-        },
         "fill": {
           "type": "string"
         },
@@ -2972,7 +2994,14 @@
               "type": "object"
             },
             "title": {
-              "type": "string"
+              "anyOf": [
+                {
+                  "type": "string"
+                },
+                {
+                  "$ref": "#/definitions/Title"
+                }
+              ]
             },
             "transform": {
               "items": {
@@ -2981,7 +3010,7 @@
               "type": "array"
             },
             "view": {
-              "$ref": "#/definitions/ViewConfig"
+              "$ref": "#/definitions/ViewBackground"
             },
             "visible": {
               "description": "Visibility of the view. An invisible view is removed from the layout and not rendered.\n\n**Default:** `true`",
@@ -3137,7 +3166,14 @@
               "type": "object"
             },
             "title": {
-              "type": "string"
+              "anyOf": [
+                {
+                  "type": "string"
+                },
+                {
+                  "$ref": "#/definitions/Title"
+                }
+              ]
             },
             "transform": {
               "items": {
@@ -3146,7 +3182,7 @@
               "type": "array"
             },
             "view": {
-              "$ref": "#/definitions/ViewConfig"
+              "$ref": "#/definitions/ViewBackground"
             },
             "visible": {
               "description": "Visibility of the view. An invisible view is removed from the layout and not rendered.\n\n**Default:** `true`",
@@ -3292,7 +3328,14 @@
               "type": "boolean"
             },
             "title": {
-              "type": "string"
+              "anyOf": [
+                {
+                  "type": "string"
+                },
+                {
+                  "$ref": "#/definitions/Title"
+                }
+              ]
             },
             "transform": {
               "items": {
@@ -3432,7 +3475,14 @@
               "type": "number"
             },
             "title": {
-              "type": "string"
+              "anyOf": [
+                {
+                  "type": "string"
+                },
+                {
+                  "$ref": "#/definitions/Title"
+                }
+              ]
             },
             "transform": {
               "items": {
@@ -3597,7 +3647,14 @@
               "type": "number"
             },
             "title": {
-              "type": "string"
+              "anyOf": [
+                {
+                  "type": "string"
+                },
+                {
+                  "$ref": "#/definitions/Title"
+                }
+              ]
             },
             "transform": {
               "items": {
@@ -3641,6 +3698,9 @@
             "baseUrl": {
               "type": "string"
             },
+            "columns": {
+              "type": "number"
+            },
             "concat": {
               "items": {
                 "anyOf": [
@@ -3749,7 +3809,14 @@
               "type": "number"
             },
             "title": {
-              "type": "string"
+              "anyOf": [
+                {
+                  "type": "string"
+                },
+                {
+                  "$ref": "#/definitions/Title"
+                }
+              ]
             },
             "transform": {
               "items": {
@@ -3780,6 +3847,7 @@
             }
           },
           "required": [
+            "columns",
             "concat"
           ],
           "type": "object"
@@ -3947,7 +4015,14 @@
           "type": "boolean"
         },
         "title": {
-          "type": "string"
+          "anyOf": [
+            {
+              "type": "string"
+            },
+            {
+              "$ref": "#/definitions/Title"
+            }
+          ]
         },
         "transform": {
           "items": {
@@ -4498,6 +4573,109 @@
         }
       ]
     },
+    "Title": {
+      "additionalProperties": false,
+      "properties": {
+        "align": {
+          "$ref": "#/definitions/Align",
+          "description": "Horizontal text alignment for title text. One of `\"left\"`, `\"center\"`, or `\"right\"`."
+        },
+        "anchor": {
+          "$ref": "#/definitions/TitleAnchor",
+          "description": "The anchor position for placing the title and subtitle text. One of `\"start\"`, `\"middle\"`, or `\"end\"`. For example, with an orientation of top these anchor positions map to a left-, center-, or right-aligned title."
+        },
+        "angle": {
+          "description": "Angle in degrees of title and subtitle text.",
+          "type": "number"
+        },
+        "baseline": {
+          "$ref": "#/definitions/Baseline",
+          "description": "Vertical text baseline for title and subtitle text. One of `\"alphabetic\"` (default), `\"top\"`, `\"middle\"`, or `\"bottom\"`."
+        },
+        "color": {
+          "description": "Text color for title text.",
+          "type": "string"
+        },
+        "dx": {
+          "description": "Delta offset for title and subtitle text x-coordinate.",
+          "type": "number"
+        },
+        "dy": {
+          "description": "Delta offset for title and subtitle text y-coordinate.",
+          "type": "number"
+        },
+        "font": {
+          "description": "Font name for title text.",
+          "type": "string"
+        },
+        "fontSize": {
+          "description": "Font size in pixels for title text.",
+          "minimum": 0,
+          "type": "number"
+        },
+        "fontStyle": {
+          "$ref": "#/definitions/FontStyle",
+          "description": "Font style for title text."
+        },
+        "fontWeight": {
+          "$ref": "#/definitions/FontWeight",
+          "description": "Font weight for title text. This can be either a string (e.g `\"bold\"`, `\"normal\"`) or a number (`100`, `200`, `300`, ..., `900` where `\"normal\"` = `400` and `\"bold\"` = `700`)."
+        },
+        "frame": {
+          "$ref": "#/definitions/TitleFrame",
+          "description": "The reference frame for the anchor position, one of `\"bounds\"` (to anchor relative to the full bounding box) or `\"group\"` (to anchor relative to the group width or height)."
+        },
+        "offset": {
+          "description": "The orthogonal offset in pixels by which to displace the title group from its position along the edge of the chart.",
+          "type": "number"
+        },
+        "orient": {
+          "$ref": "#/definitions/TitleOrient",
+          "description": "Default title orientation (`\"top\"`, `\"bottom\"`, `\"left\"`, or `\"right\"`)"
+        },
+        "style": {
+          "description": "A mark style property to apply to the title text mark. If not specified, a default style of `\"group-title\"` is applied.",
+          "type": "string"
+        },
+        "text": {
+          "description": "The title text.",
+          "type": "string"
+        }
+      },
+      "required": [
+        "text"
+      ],
+      "type": "object"
+    },
+    "TitleAnchor": {
+      "enum": [
+        null,
+        "start",
+        "middle",
+        "end"
+      ],
+      "type": [
+        "null",
+        "string"
+      ]
+    },
+    "TitleFrame": {
+      "enum": [
+        "bounds",
+        "group"
+      ],
+      "type": "string"
+    },
+    "TitleOrient": {
+      "enum": [
+        "none",
+        "left",
+        "right",
+        "top",
+        "bottom"
+      ],
+      "type": "string"
+    },
     "Tooltip": {
       "anyOf": [
         {
@@ -4696,7 +4874,14 @@
           "type": "object"
         },
         "title": {
-          "type": "string"
+          "anyOf": [
+            {
+              "type": "string"
+            },
+            {
+              "$ref": "#/definitions/Title"
+            }
+          ]
         },
         "transform": {
           "items": {
@@ -4705,7 +4890,7 @@
           "type": "array"
         },
         "view": {
-          "$ref": "#/definitions/ViewConfig"
+          "$ref": "#/definitions/ViewBackground"
         },
         "visible": {
           "description": "Visibility of the view. An invisible view is removed from the layout and not rendered.\n\n**Default:** `true`",
@@ -4855,7 +5040,14 @@
           "type": "number"
         },
         "title": {
-          "type": "string"
+          "anyOf": [
+            {
+              "type": "string"
+            },
+            {
+              "$ref": "#/definitions/Title"
+            }
+          ]
         },
         "transform": {
           "items": {
@@ -4932,7 +5124,7 @@
       ],
       "type": "object"
     },
-    "ViewConfig": {
+    "ViewBackground": {
       "additionalProperties": false,
       "properties": {
         "cornerRadius": {

package/package.json

@@ -7,7 +7,7 @@
   },
   "contributors": [],
   "license": "BSD-2-Clause",
-  "version": "0.19.1",
+  "version": "0.22.0",
   "main": "dist/index.js",
   "module": "src/index.js",
   "exports": {
@@ -44,7 +44,7 @@
     "d3-color": "^3.0.1",
     "d3-ease": "^3.0.1",
     "d3-format": "^3.0.1",
-    "flatqueue": "^1.2.1",
+    "flatqueue": "^2.0.3",
     "internmap": "^2.0.3",
     "lit-html": "^2.0.2",
     "twgl.js": "^4.19.1",
@@ -53,5 +53,5 @@
     "vega-scale": "^7.1.1",
     "vega-util": "^1.16.0"
   },
-  "gitHead": "ca14d08659918a002fb330ffcd325e9c1e122a8c"
+  "gitHead": "0584f32e402341b913b2cc43543c95ccbb7b846b"
 }

package/src/genomeSpy.js

@@ -8,7 +8,6 @@ import Tooltip from "./utils/ui/tooltip";
 import AccessorFactory from "./encoder/accessor";
 import {
     resolveScalesAndAxes,
-    addDecorators,
     processImports,
     setImplicitScaleNames,
 } from "./view/viewUtils";
@@ -17,7 +16,6 @@ import UnitView from "./view/unitView";
 import WebGLHelper from "./gl/webGLHelper";
 import Rectangle from "./utils/layout/rectangle";
 import DeferredViewRenderingContext from "./view/renderingContext/deferredViewRenderingContext";
-import LayoutRecorderViewRenderingContext from "./view/renderingContext/layoutRecorderViewRenderingContext";
 import CompositeViewRenderingContext from "./view/renderingContext/compositeViewRenderingContext";
 import InteractionEvent from "./utils/interactionEvent";
 import Point from "./utils/layout/point";
@@ -36,6 +34,8 @@ import refseqGeneTooltipHandler from "./tooltip/refseqGeneTooltipHandler";
 import dataTooltipHandler from "./tooltip/dataTooltipHandler";
 import { invalidatePrefix } from "./utils/propertyCacher";
 import { ViewFactory } from "./view/viewFactory";
+import LayerView from "./view/layerView";
+import ImplicitRootView from "./view/implicitRootView";
 
 /**
  * @typedef {import("./spec/view").UnitSpec} UnitSpec
@@ -166,7 +166,9 @@ export default class GenomeSpy {
 
         this._glHelper = new WebGLHelper(this.container, () => {
             if (this.viewRoot) {
-                const size = this.viewRoot.getSize();
+                const size = this.viewRoot
+                    .getSize()
+                    .addPadding(this.viewRoot.getOverhang());
 
                 // If a dimension has an absolutely specified size (in pixels), use it for the canvas size.
                 // However, if the dimension has a growing component, the canvas should be fit to the
@@ -283,12 +285,19 @@ export default class GenomeSpy {
         // Replace placeholder ImportViews with actual views.
         await processImports(this.viewRoot);
 
+        if (
+            this.viewRoot instanceof UnitView ||
+            this.viewRoot instanceof LayerView
+        ) {
+            this.viewRoot = new ImplicitRootView(context, this.viewRoot);
+        }
+
         // Resolve scales, i.e., if possible, pull them towards the root
         resolveScalesAndAxes(this.viewRoot);
         setImplicitScaleNames(this.viewRoot);
 
         // Wrap unit or layer views that need axes
-        this.viewRoot = addDecorators(this.viewRoot);
+        //this.viewRoot = addDecorators(this.viewRoot);
 
         // We should now have a complete view hierarchy. Let's update the canvas size
         // and ensure that the loading message is visible.
@@ -424,7 +433,7 @@ export default class GenomeSpy {
 
         /** @param {Event} event */
         const listener = (event) => {
-            if (this.layout && event instanceof MouseEvent) {
+            if (event instanceof MouseEvent) {
                 if (event.type == "mousemove") {
                     this.tooltip.handleMouseMove(event);
                     this._tooltipUpdateRequested = false;
@@ -445,7 +454,7 @@ export default class GenomeSpy {
                  * @param {MouseEvent} event
                  */
                 const dispatchEvent = (event) => {
-                    this.layout.dispatchInteractionEvent(
+                    this.viewRoot.propagateInteractionEvent(
                         new InteractionEvent(point, event)
                     );
 
@@ -677,20 +686,16 @@ export default class GenomeSpy {
             },
             this._glHelper
         );
-        const layoutRecorder = new LayoutRecorderViewRenderingContext({});
 
         root.render(
             new CompositeViewRenderingContext(
                 this._renderingContext,
-                this._pickingContext,
-                layoutRecorder
+                this._pickingContext
             ),
             // Canvas should now be sized based on the root view or the container
             Rectangle.create(0, 0, canvasSize.width, canvasSize.height)
         );
 
-        this.layout = layoutRecorder.getLayout();
-
         this.broadcast("layoutComputed");
     }