@vizabi/bubblechart 4.0.1 → 4.1.0

package/build/bubblechart.js

@@ -1,4 +1,4 @@
-// https://github.com/vizabi/bubblechart#readme v4.0.1 build 1687790506899 Copyright 2023 Gapminder Foundation and contributors
+// https://github.com/vizabi/bubblechart#readme v4.1.0 build 1701715944325 Copyright 2023 Gapminder Foundation and contributors
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@vizabi/shared-components'), require('d3'), require('mobx')) :
   typeof define === 'function' && define.amd ? define(['exports', '@vizabi/shared-components', 'd3', 'mobx'], factory) :
@@ -2076,6 +2076,8 @@
         y
       } = this.MDL;
       
+      this.model.encoding.y.scale.d3Scale;
+      
       const {
         graphAll,
         eventArea,
@@ -2121,20 +2123,29 @@
       this.yScale.range(this._rangeBump([height, 0]));
       this.xScale.range(this._rangeBump([0, width]));
 
+      //only applied to swimming lane sclae
+      const rankScaleModifications = y.scale.type === "rank" 
+        ? {
+          ticks: y.rollup.map(m => m.tickPosition),
+          formatter: (d) => y.rollup.find(f => f.tickPosition === d).name,
+          repositionLabels: Object.fromEntries(y.rollup.map(m => ([m.tickPosition, { x: 4 * infoElHeight, y: -infoElHeight }]))) 
+        }
+        : {};
+
       //apply scales to axes and redraw
       this.yAxis.scale(this.yScale)
         .tickSizeInner(-width)
         .tickSizeOuter(0)
         .tickPadding(6)
         .tickSizeMinor(-width, 0)
-        .labelerOptions({
+        .labelerOptions(Object.assign({
           scaleType: y.scale.type,
           toolMargin: margin,
           limitMaxTickNumber: 6,
           bump: this.profileConstants.maxRadiusPx / 2,
           viewportLength: height,
           formatter: this.localise
-        });
+        }, rankScaleModifications));
 
       this.xAxis.scale(this.xScale)
         .tickSizeInner(-height)
@@ -2409,11 +2420,11 @@
             .attr("x1", this.xScale(valueX) - radius);
         }
 
-        if (this.ui.whenHovering.higlightValueX) xAxisEl.call(
+        if (this.ui.whenHovering.higlightValueX && this.MDL.x.scale.type !== "rank") xAxisEl.call(
           this.xAxis.highlightValue(valueX)
         );
 
-        if (this.ui.whenHovering.higlightValueY) yAxisEl.call(
+        if (this.ui.whenHovering.higlightValueY && this.MDL.y.scale.type !== "rank") yAxisEl.call(
           this.yAxis.highlightValue(valueY)
         );
 
@@ -2643,10 +2654,14 @@
     }
 
     __labelWithoutFrame(d) {
+      const markerSpace = this.model.data.space;
       if (typeof d.label == "object") 
         return Object.entries(d.label)
-          .filter(entry => entry[0] != this.MDL.frame.data.concept)
-          .map(entry => sharedComponents.LegacyUtils.isNumber(entry[1]) ? (entry[0] + ": " + entry[1]) : entry[1])
+          .filter(([k, v]) => k != this.MDL.frame.data.concept)
+          //sort parts of the name along the marker space array, so we get geo, gender instead of gender, geo
+          .sort(([ak, av], [bk, bv]) => markerSpace.indexOf(ak) - markerSpace.indexOf(bk))
+          //add keys where values are numbers, such as "age: 69"
+          .map(([k, v]) => sharedComponents.LegacyUtils.isNumber(v) ? k + ": " + v : v)
           .join(", ");
       if (d.label != null) return "" + d.label;
       return d[Symbol.for("key")];
@@ -2865,7 +2880,7 @@
     }
   });
 
-  BubbleChart.versionInfo = { version: "4.0.1", build: 1687790506899, package: {"homepage":"https://github.com/vizabi/bubblechart#readme","name":"@vizabi/bubblechart","description":"Vizabi bubble chart"}, sharedComponents: sharedComponents.versionInfo};
+  BubbleChart.versionInfo = { version: "4.1.0", build: 1701715944325, package: {"homepage":"https://github.com/vizabi/bubblechart#readme","name":"@vizabi/bubblechart","description":"Vizabi bubble chart"}, sharedComponents: sharedComponents.versionInfo};
 
   exports.Base = BubbleChart;