@vizabi/bubblechart 5.0.3 → 5.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/bubblechart.css +0 -8
- package/build/bubblechart.js +43 -37
- package/build/bubblechart.js.map +1 -1
- package/build/stats.html +1 -1
- package/package.json +2 -2
package/build/bubblechart.css
CHANGED
|
@@ -300,14 +300,6 @@
|
|
|
300
300
|
visibility: hidden;
|
|
301
301
|
pointer-events: none;
|
|
302
302
|
}
|
|
303
|
-
.vzb-tool .vzb-bubblechart.vzb-sm-chart .vzb-datawarning-button {
|
|
304
|
-
visibility: hidden;
|
|
305
|
-
pointer-events: none;
|
|
306
|
-
}
|
|
307
|
-
.vzb-tool .vzb-bubblechart.vzb-sm-last-chart .vzb-datawarning-button {
|
|
308
|
-
visibility: visible;
|
|
309
|
-
pointer-events: all;
|
|
310
|
-
}
|
|
311
303
|
.vzb-tool .vzb-bubblechart .vzb-bubblechart-svg-front {
|
|
312
304
|
pointer-events: none;
|
|
313
305
|
}
|
package/build/bubblechart.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// https://github.com/vizabi/bubblechart#readme v5.0
|
|
1
|
+
// https://github.com/vizabi/bubblechart#readme v5.2.0 build 1746287297708 Copyright 2025 Gapminder Foundation and contributors
|
|
2
2
|
(function (global, factory) {
|
|
3
3
|
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@vizabi/shared-components'), require('d3'), require('mobx')) :
|
|
4
4
|
typeof define === 'function' && define.amd ? define(['exports', '@vizabi/shared-components', 'd3', 'mobx'], factory) :
|
|
@@ -44082,6 +44082,7 @@ void main(void) {
|
|
|
44082
44082
|
getSourcePosition: this.props.transitions?.getPosition,
|
|
44083
44083
|
getTargetPosition: this.props.transitions?.getPosition,
|
|
44084
44084
|
getTargetPixelOffset: this.props.transitions?.getPosition,
|
|
44085
|
+
getSourceDashOffset: this.props.transitions?.getPosition
|
|
44085
44086
|
}
|
|
44086
44087
|
//pickable: true,
|
|
44087
44088
|
//_dataDiff: (newData, oldData) => {
|
|
@@ -44189,6 +44190,7 @@ void main(void) {
|
|
|
44189
44190
|
const KEY = Symbol.for("key");
|
|
44190
44191
|
const TRAIL_KEY = Symbol.for("trailHeadKey");
|
|
44191
44192
|
const OPACITY_KEY = Symbol.for("opacity");
|
|
44193
|
+
const REQUIRED_KEY = Symbol.for("bubbleRequired");
|
|
44192
44194
|
|
|
44193
44195
|
const marginScaleH = (marginMin, ratio = 0) => height => marginMin + height * ratio;
|
|
44194
44196
|
const marginScaleW = (marginMin, ratio = 0) => width => marginMin + width * ratio;
|
|
@@ -44201,7 +44203,7 @@ void main(void) {
|
|
|
44201
44203
|
|
|
44202
44204
|
const PROFILE_CONSTANTS = (width, height) => ({
|
|
44203
44205
|
SMALL: {
|
|
44204
|
-
margin: { top: 30, bottom:
|
|
44206
|
+
margin: { top: 30, bottom: 40, left: 30, right: 10},
|
|
44205
44207
|
leftMarginRatio: 1,
|
|
44206
44208
|
padding: 2,
|
|
44207
44209
|
minRadiusPx: 0.5,
|
|
@@ -44213,7 +44215,7 @@ void main(void) {
|
|
|
44213
44215
|
xAxisTitleBottomMargin: 4
|
|
44214
44216
|
},
|
|
44215
44217
|
MEDIUM: {
|
|
44216
|
-
margin: { top: 15, bottom:
|
|
44218
|
+
margin: { top: 15, bottom: 45, left: 40, right: 15},
|
|
44217
44219
|
leftMarginRatio: 1.6,
|
|
44218
44220
|
padding: 2,
|
|
44219
44221
|
minRadiusPx: 1,
|
|
@@ -44299,7 +44301,6 @@ void main(void) {
|
|
|
44299
44301
|
|
|
44300
44302
|
<rect class="vzb-bc-zoom-rect"></rect>
|
|
44301
44303
|
</g>
|
|
44302
|
-
<g class="vzb-datawarning-button vzb-noexport"></g>
|
|
44303
44304
|
</svg>
|
|
44304
44305
|
</svg>
|
|
44305
44306
|
<svg class="vzb-bubblechart-svg vzb-export">
|
|
@@ -44745,11 +44746,11 @@ void main(void) {
|
|
|
44745
44746
|
|
|
44746
44747
|
const _this = this;
|
|
44747
44748
|
|
|
44748
|
-
|
|
44749
|
+
this.services.layout.profile;
|
|
44749
44750
|
|
|
44750
44751
|
const margin = this.profileConstants.margin;
|
|
44751
44752
|
const infoElHeight = this.profileConstants.infoElHeight;
|
|
44752
|
-
|
|
44753
|
+
this.profileConstants.xAxisTitleBottomMargin;
|
|
44753
44754
|
|
|
44754
44755
|
//stage
|
|
44755
44756
|
const height = this.height = (this.elementHeight - margin.top - margin.bottom) || 0;
|
|
@@ -44848,17 +44849,6 @@ void main(void) {
|
|
|
44848
44849
|
xAxisGroupsEl
|
|
44849
44850
|
.style("font-size", infoElHeight * 0.8 + "px");
|
|
44850
44851
|
|
|
44851
|
-
this.root.findChild({type: "_DataWarning"}).setOptions({
|
|
44852
|
-
width: this.elementWidth,
|
|
44853
|
-
height: this.elementHeight,
|
|
44854
|
-
vertical: "bottom",
|
|
44855
|
-
horizontal: "right",
|
|
44856
|
-
right: margin.right,
|
|
44857
|
-
bottom: xAxisTitleBottomMargin,
|
|
44858
|
-
wLimit: (layoutProfile !== "SMALL" ? 0.5 : 1) *
|
|
44859
|
-
(this.elementWidth - this.DOM.graph.select(".vzb-bc-axis-x-title").node().getBBox().width - infoElHeight * 3)
|
|
44860
|
-
});
|
|
44861
|
-
|
|
44862
44852
|
canvasWrap.style("max-width", width + "px");
|
|
44863
44853
|
canvasWrap.style("max-height", Math.max(0, height) + "px");
|
|
44864
44854
|
}
|
|
@@ -44935,34 +44925,42 @@ void main(void) {
|
|
|
44935
44925
|
newTrailsData.length += trailsCount;
|
|
44936
44926
|
dataTrailChunkIndex = res.length;
|
|
44937
44927
|
res.length += trailsCount;
|
|
44938
|
-
selectedData.set(d[TRAIL_KEY], Object.assign({}, d));
|
|
44939
44928
|
trailChunkIndex1 = trailChunkIndex + 1;
|
|
44940
44929
|
}
|
|
44941
|
-
|
|
44942
|
-
|
|
44930
|
+
if (!d[REQUIRED_KEY]) {
|
|
44931
|
+
newTrailsData[trailChunkIndex++] = d;
|
|
44932
|
+
res[dataTrailChunkIndex++] = d;
|
|
44933
|
+
if (!selectedData.has(d[TRAIL_KEY])) selectedData.set(d[TRAIL_KEY], Object.assign({}, d));
|
|
44934
|
+
}
|
|
44943
44935
|
} else {
|
|
44944
44936
|
if (currentTrailKey) {
|
|
44945
44937
|
trailsZ[currentTrailKey] = d.size;//d.z
|
|
44946
44938
|
//newTrailsData[trailChunkIndex] = Object.assign({}, newTrailsData[trailChunkIndex - 1]);
|
|
44947
|
-
newTrailsData.fill(d, trailChunkIndex, newTrailsData.length);
|
|
44948
44939
|
//_newUpdateRangesLine.push({startRow: trailChunkIndex - 2, endRow: trailChunkIndex});
|
|
44949
44940
|
//newTrailsData[trailChunkIndex - 1] = d;
|
|
44950
|
-
|
|
44951
|
-
|
|
44952
|
-
|
|
44941
|
+
if(!d[REQUIRED_KEY]) {
|
|
44942
|
+
newTrailsData.fill(d, trailChunkIndex, newTrailsData.length);
|
|
44943
|
+
indexOffset = trailChunkIndex == trailChunkIndex1 ? 1 : 2;
|
|
44944
|
+
lastLineTrailData.push([newTrailsData[trailChunkIndex - indexOffset], newTrailsData[trailChunkIndex - indexOffset]]);
|
|
44945
|
+
newLastLineTrailData.push([newTrailsData[trailChunkIndex - indexOffset], d]);
|
|
44946
|
+
res.fill(Object.assign({uz: -15000}, res[dataTrailChunkIndex - 1]), dataTrailChunkIndex, res.length - 1);
|
|
44947
|
+
res[res.length - 1] = d;
|
|
44948
|
+
} else {
|
|
44949
|
+
res.fill(Object.assign({uz: -15000}, res[dataTrailChunkIndex - 1]), dataTrailChunkIndex, res.length - 1);
|
|
44950
|
+
res.length--;
|
|
44951
|
+
}
|
|
44953
44952
|
trailChunkIndex = newTrailsData.length;
|
|
44954
|
-
res.fill(Object.assign({uz: -15000}, res[dataTrailChunkIndex - 1]), dataTrailChunkIndex, res.length - 1);
|
|
44955
|
-
res[res.length - 1] = d;
|
|
44956
44953
|
currentTrailKey = null;
|
|
44957
44954
|
} else {
|
|
44958
|
-
res.push(d);
|
|
44955
|
+
if(!d[REQUIRED_KEY]) res.push(d);
|
|
44959
44956
|
}
|
|
44960
44957
|
}
|
|
44961
44958
|
return res;
|
|
44962
44959
|
|
|
44963
|
-
}, []) : this.model.dataArray.
|
|
44960
|
+
}, []) : this.model.dataArray.filter(d => {
|
|
44961
|
+
if (d[REQUIRED_KEY]) return false;
|
|
44964
44962
|
d.r = sharedComponents.LegacyUtils.areaToRadius(this.sScale(d.size || 0));
|
|
44965
|
-
return
|
|
44963
|
+
return true;
|
|
44966
44964
|
});
|
|
44967
44965
|
|
|
44968
44966
|
this.labelZScale = d3.scaleLinear([0, selectedData.size - 1],[-0.09, -0.05]);
|
|
@@ -44976,9 +44974,9 @@ void main(void) {
|
|
|
44976
44974
|
|
|
44977
44975
|
//console.log("__data", this.model.dataArray, this.__data, newData, this.__trailsData, newTrailsData);
|
|
44978
44976
|
|
|
44979
|
-
this.__newLabelData = trailsShowAndSomeSelected ? this.__selectedKeys.map(key => selectedData.get(key) || this.model.dataMap.get(key)).filter(d => d &&
|
|
44977
|
+
this.__newLabelData = trailsShowAndSomeSelected ? this.__selectedKeys.map(key => selectedData.get(key) || this.model.dataMap.get(key)).filter(d => d && !d[REQUIRED_KEY])
|
|
44980
44978
|
:
|
|
44981
|
-
this.__selectedKeys.map(key => this.model.dataMap.get(key)).filter(d => d &&
|
|
44979
|
+
this.__selectedKeys.map(key => this.model.dataMap.get(key)).filter(d => d && !d[REQUIRED_KEY]);
|
|
44982
44980
|
|
|
44983
44981
|
if (this.__selectedKeys.length > this.__newLabelData.length) {
|
|
44984
44982
|
const labelKeys = this.__newLabelData.map(d => d[TRAIL_KEY] || d[KEY]);
|
|
@@ -45062,7 +45060,8 @@ void main(void) {
|
|
|
45062
45060
|
|
|
45063
45061
|
this.__someHighlighted = highlightedFilter.any();
|
|
45064
45062
|
this.__highlightedMarkers = new Map(highlightedFilter.markers);
|
|
45065
|
-
|
|
45063
|
+
const activeObject = this.__highlightedMarkers.size == 1 ? Object.assign({}, this.model.dataMap.get(this.__highlightedMarkers.keys().next().value)) : null;
|
|
45064
|
+
this.activeObject = activeObject?.[REQUIRED_KEY] ? null : activeObject;
|
|
45066
45065
|
this.activeObjectData = this.activeObject ? [this.activeObject] : [];
|
|
45067
45066
|
this.opacityUpdateTrigger++;
|
|
45068
45067
|
this.deckBubble.setProps({layers: this.getBubbleLayers(undefined, false)});
|
|
@@ -45085,7 +45084,7 @@ void main(void) {
|
|
|
45085
45084
|
|
|
45086
45085
|
mobx.runInAction(() => {
|
|
45087
45086
|
if (!this.MDL.trail.show) {
|
|
45088
|
-
this.__labelData = this.__selectedKeys.map(key => this.model.dataMap.get(key));
|
|
45087
|
+
this.__labelData = this.__selectedKeys.map(key => this.model.dataMap.get(key)).filter(d => d && !d[REQUIRED_KEY]);
|
|
45089
45088
|
this.opacityUpdateTrigger++;
|
|
45090
45089
|
this.deckBubble.setProps({layers: this.getBubbleLayers(undefined, false)});
|
|
45091
45090
|
}
|
|
@@ -45211,10 +45210,10 @@ void main(void) {
|
|
|
45211
45210
|
//const trailShow = this.MDL.trail.show;
|
|
45212
45211
|
//const trailStarts = this.MDL.trail.starts;
|
|
45213
45212
|
//const trailGroupDim = this.MDL.trail.groupDim;
|
|
45213
|
+
const d = this.activeObject;
|
|
45214
45214
|
|
|
45215
|
-
if (highlightedFilter.markers.size === 1) {
|
|
45215
|
+
if (highlightedFilter.markers.size === 1 && d && !d[REQUIRED_KEY]) {
|
|
45216
45216
|
highlightedFilter.markers.keys().next().value;
|
|
45217
|
-
const d = this.activeObject;
|
|
45218
45217
|
//Object.assign(this.model.dataMap.get(highlightedKey));
|
|
45219
45218
|
const selectedKey = d[TRAIL_KEY] || d[KEY];
|
|
45220
45219
|
|
|
@@ -46148,7 +46147,7 @@ void main(void) {
|
|
|
46148
46147
|
},{
|
|
46149
46148
|
type: sharedComponents.DataWarning,
|
|
46150
46149
|
placeholder: ".vzb-datawarning",
|
|
46151
|
-
options: {
|
|
46150
|
+
options: {appendButtonHere: ".vzb-repeater"},
|
|
46152
46151
|
model: marker,
|
|
46153
46152
|
name: "data-warning"
|
|
46154
46153
|
},{
|
|
@@ -46259,6 +46258,13 @@ void main(void) {
|
|
|
46259
46258
|
left: 0,
|
|
46260
46259
|
top: 0
|
|
46261
46260
|
}
|
|
46261
|
+
},
|
|
46262
|
+
"data-warning": {
|
|
46263
|
+
margin: {
|
|
46264
|
+
LARGE: { bottom: 90 },
|
|
46265
|
+
MEDIUM: { bottom: 70 },
|
|
46266
|
+
SMALL: { bottom: 50 }
|
|
46267
|
+
}
|
|
46262
46268
|
}
|
|
46263
46269
|
};
|
|
46264
46270
|
|
|
@@ -46322,7 +46328,7 @@ void main(void) {
|
|
|
46322
46328
|
}
|
|
46323
46329
|
});
|
|
46324
46330
|
|
|
46325
|
-
BubbleChart.versionInfo = { version: "5.0
|
|
46331
|
+
BubbleChart.versionInfo = { version: "5.2.0", build: 1746287297708, package: {"homepage":"https://github.com/vizabi/bubblechart#readme","name":"@vizabi/bubblechart","description":"Vizabi bubble chart"}, sharedComponents: sharedComponents.versionInfo};
|
|
46326
46332
|
|
|
46327
46333
|
exports.Base = BubbleChart;
|
|
46328
46334
|
|