@milaboratories/miplots4 1.0.179 → 1.1.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/dist/scatterplot/ChartRenderer.d.ts +2 -2
- package/dist/scatterplot/ChartRenderer.d.ts.map +1 -1
- package/dist/scatterplot/ChartRenderer.js +155 -115
- package/dist/scatterplot/ChartRenderer.js.map +1 -1
- package/dist/scatterplot/ScatterplotSettingsImpl.d.ts +11 -1
- package/dist/scatterplot/ScatterplotSettingsImpl.d.ts.map +1 -1
- package/dist/scatterplot/ScatterplotSettingsImpl.js +20 -0
- package/dist/scatterplot/ScatterplotSettingsImpl.js.map +1 -1
- package/dist/scatterplot/components/ChartLayersData.d.ts +5 -0
- package/dist/scatterplot/components/ChartLayersData.d.ts.map +1 -1
- package/dist/scatterplot/components/ChartLayersData.js +115 -35
- package/dist/scatterplot/components/ChartLayersData.js.map +1 -1
- package/dist/scatterplot/components/types.d.ts +2 -0
- package/dist/scatterplot/components/types.d.ts.map +1 -1
- package/dist/scatterplot/getLayersData.d.ts +11 -2
- package/dist/scatterplot/getLayersData.d.ts.map +1 -1
- package/dist/scatterplot/getLayersData.js +36 -19
- package/dist/scatterplot/getLayersData.js.map +1 -1
- package/dist/scatterplot/index.d.ts.map +1 -1
- package/dist/scatterplot/index.js +51 -33
- package/dist/scatterplot/index.js.map +1 -1
- package/dist/scatterplot/linearRegression.js +1 -1
- package/dist/scatterplot/utils/createAesGetter.d.ts.map +1 -1
- package/dist/scatterplot/utils/createAesGetter.js +5 -3
- package/dist/scatterplot/utils/createAesGetter.js.map +1 -1
- package/dist/scatterplot/utils/createLegendInfo.d.ts +11 -2
- package/dist/scatterplot/utils/createLegendInfo.d.ts.map +1 -1
- package/dist/scatterplot/utils/createLegendInfo.js +21 -16
- package/dist/scatterplot/utils/createLegendInfo.js.map +1 -1
- package/dist/scatterplot-umap/ChartRenderer.d.ts +6 -6
- package/dist/scatterplot-umap/ChartRenderer.d.ts.map +1 -1
- package/dist/scatterplot-umap/ChartRenderer.js +99 -57
- package/dist/scatterplot-umap/ChartRenderer.js.map +1 -1
- package/dist/scatterplot-umap/SettingsImpl.d.ts +11 -1
- package/dist/scatterplot-umap/SettingsImpl.d.ts.map +1 -1
- package/dist/scatterplot-umap/SettingsImpl.js +21 -1
- package/dist/scatterplot-umap/SettingsImpl.js.map +1 -1
- package/dist/scatterplot-umap/components/LowerSVG.d.ts +3 -2
- package/dist/scatterplot-umap/components/LowerSVG.d.ts.map +1 -1
- package/dist/scatterplot-umap/components/LowerSVG.js +159 -108
- package/dist/scatterplot-umap/components/LowerSVG.js.map +1 -1
- package/dist/scatterplot-umap/components/SVGLayer.d.ts +1 -1
- package/dist/scatterplot-umap/components/SVGLayer.d.ts.map +1 -1
- package/dist/scatterplot-umap/components/SVGLayer.js +9 -8
- package/dist/scatterplot-umap/components/SVGLayer.js.map +1 -1
- package/dist/scatterplot-umap/index.d.ts +6 -1
- package/dist/scatterplot-umap/index.d.ts.map +1 -1
- package/dist/scatterplot-umap/index.js +65 -31
- package/dist/scatterplot-umap/index.js.map +1 -1
- package/dist/scatterplot-umap/types.d.ts +7 -0
- package/dist/scatterplot-umap/types.d.ts.map +1 -1
- package/dist/types/scatterplot-umap.d.ts +763 -87
- package/dist/types/scatterplot-umap.d.ts.map +1 -1
- package/dist/types/scatterplot-umap.js +19 -3
- package/dist/types/scatterplot-umap.js.map +1 -1
- package/dist/types/scatterplot.d.ts +1377 -44
- package/dist/types/scatterplot.d.ts.map +1 -1
- package/dist/types/scatterplot.js +27 -3
- package/dist/types/scatterplot.js.map +1 -1
- package/package.json +1 -1
|
@@ -37,11 +37,11 @@ declare class ChartRenderer {
|
|
|
37
37
|
createFacetTitles(facetKeys: string[], facetLabels: string[][]): void;
|
|
38
38
|
createAxisLabels(facetKeys: string[], xAxis: ScatterplotSettingsImpl['chartSettings']['xAxis'], yAxis: ScatterplotSettingsImpl['chartSettings']['xAxis'], discreteAxisDataX: DiscreteAxisData, discreteAxisDataY: DiscreteAxisData): void;
|
|
39
39
|
updateMargins(facetKeys: string[]): void;
|
|
40
|
-
updateLegendSize(legend: ScatterplotSettingsImpl['chartSettings']['legend'], legendInfo: ScatterplotLegendInfo, grouping: ColumnName[], layers: ScatterplotLayer[]): void;
|
|
40
|
+
updateLegendSize(legend: ScatterplotSettingsImpl['chartSettings']['legend'], legendInfo: ScatterplotLegendInfo, grouping: ColumnName[], layers: ScatterplotLayer[], additionalCurves: ScatterplotSettingsImpl['additionalCurves'], yColumn: ColumnName): void;
|
|
41
41
|
render(dataFrame: DataFrame, settingsId: string, chartSettings: ScatterplotSettingsImpl['chartSettings'], facetSettings: ScatterplotSettingsImpl['facetSettings'], facetKeys: string[], facetLabels: string[][], groupedDots: GroupedDots, trendsData: TrendsData | null, keyColumn: ColumnName, onlyPositive: {
|
|
42
42
|
x: boolean;
|
|
43
43
|
y: boolean;
|
|
44
|
-
}, legendInfo: ScatterplotLegendInfo, layersData: Record<string, ScatterplotLayerData[]>, grouping: ColumnName[], layers: ScatterplotLayer[], trend: ScatterplotSettingsImpl['trend'], discreteAxisDataX: DiscreteAxisData, discreteAxisDataY: DiscreteAxisData, onTooltipHintSwitch: (v: boolean) => void): void;
|
|
44
|
+
}, legendInfo: ScatterplotLegendInfo, layersData: Record<string, ScatterplotLayerData[]>, grouping: ColumnName[], layers: ScatterplotLayer[], trend: ScatterplotSettingsImpl['trend'], discreteAxisDataX: DiscreteAxisData, discreteAxisDataY: DiscreteAxisData, onTooltipHintSwitch: (v: boolean) => void, additionalCurves: ScatterplotSettingsImpl['additionalCurves'], yColumn: ColumnName): void;
|
|
45
45
|
renderError(message: string): void;
|
|
46
46
|
}
|
|
47
47
|
export default ChartRenderer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartRenderer.d.ts","sourceRoot":"","sources":["../../src/scatterplot/ChartRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAG7C,OAAO,KAAK,EAAc,UAAU,EAAc,MAAM,iBAAiB,CAAC;AAY1E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"ChartRenderer.d.ts","sourceRoot":"","sources":["../../src/scatterplot/ChartRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAG7C,OAAO,KAAK,EAAc,UAAU,EAAc,MAAM,iBAAiB,CAAC;AAY1E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,EAAiC,UAAU,EAAc,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAQ7G,OAAO,KAAK,EAAc,aAAa,EAAE,mBAAmB,EAAe,UAAU,EAAE,YAAY,EAAE,gBAAgB,EAAiB,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAa1K,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAC1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAC5D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,EAAyB,gBAAgB,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AA+IlH,cAAM,aAAa;IACf,SAAS,EAAE,IAAI,GAAG,IAAI,CAAQ;IAC9B,UAAU,EAAE,WAAW,GAAG,IAAI,CAAQ;IACtC,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAQ;IACpC,SAAS,EAAE,YAAY,CAAW;IAClC,OAAO,EAAE,OAAO,CAKd;IACF,gBAAgB,EAAE,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAM;IAC3D,UAAU,EAAE,UAAU,CAOpB;IACF,YAAY,SAAK;IACjB,SAAS,SAAK;IACd,MAAM,EAAE,YAAY,CAGlB;IACF,aAAa,EAAE,aAAa,CAO1B;IACF,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAM;IAC3C,SAAS,EAAE,MAAM,EAAE,CAAM;IACzB,kBAAkB,EAAE;QAChB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC;QAC5C,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC,CAAA;KAC9C,CAAkB;IAEnB,MAAM,EAAE,UAAU,CAAoC;IAEtD,KAAK;IAaL,IAAI,CAAC,IAAI,EAAE,WAAW;IAStB,gBAAgB,CAAC,IAAI,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,MAAM,CAAC;IAKvE,qBAAqB,CACjB,SAAS,EAAE,MAAM,EAAE,EACnB,aAAa,EAAE,uBAAuB,CAAC,eAAe,CAAC,EACvD,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxD,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC;IAkD5D,cAAc,CACV,SAAS,EAAE,MAAM,EAAE,EACnB,aAAa,EAAE,uBAAuB,CAAC,eAAe,CAAC,EACvD,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxD,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxD,iBAAiB,EAAE,gBAAgB,EACnC,iBAAiB,EAAE,gBAAgB,EACnC,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,GAAG,IAAI;IAmIjC,kBAAkB,CACd,SAAS,EAAE,MAAM,EAAE,EACnB,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxD,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxD,YAAY,EAAE,OAAO;IA0DzB,eAAe,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC;IAW7F,iBAAiB,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE;IAW9D,gBAAgB,CACZ,SAAS,EAAE,MAAM,EAAE,EACnB,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxD,KAAK,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxD,iBAAiB,EAAE,gBAAgB,EACnC,iBAAiB,EAAE,gBAAgB;IAsBvC,aAAa,CAAC,SAAS,EAAE,MAAM,EAAE;IAgBjC,gBAAgB,CACZ,MAAM,EAAE,uBAAuB,CAAC,eAAe,CAAC,CAAC,QAAQ,CAAC,EAC1D,UAAU,EAAE,qBAAqB,EACjC,QAAQ,EAAE,UAAU,EAAE,EACtB,MAAM,EAAE,gBAAgB,EAAE,EAC1B,gBAAgB,EAAE,uBAAuB,CAAC,kBAAkB,CAAC,EAC7D,OAAO,EAAE,UAAU;IAgJvB,MAAM,CACF,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,MAAM,EAClB,aAAa,EAAE,uBAAuB,CAAC,eAAe,CAAC,EACvD,aAAa,EAAE,uBAAuB,CAAC,eAAe,CAAC,EACvD,SAAS,EAAE,MAAM,EAAE,EACnB,WAAW,EAAE,MAAM,EAAE,EAAE,EACvB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,GAAG,IAAI,EAC7B,SAAS,EAAE,UAAU,EACrB,YAAY,EAAE;QAAC,CAAC,EAAE,OAAO,CAAC;QAAC,CAAC,EAAE,OAAO,CAAA;KAAC,EACtC,UAAU,EAAE,qBAAqB,EACjC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,EAAE,CAAC,EAClD,QAAQ,EAAE,UAAU,EAAE,EACtB,MAAM,EAAE,gBAAgB,EAAE,EAC1B,KAAK,EAAE,uBAAuB,CAAC,OAAO,CAAC,EACvC,iBAAiB,EAAE,gBAAgB,EACnC,iBAAiB,EAAE,gBAAgB,EACnC,mBAAmB,EAAE,CAAC,CAAC,EAAC,OAAO,KAAK,IAAI,EACxC,gBAAgB,EAAE,uBAAuB,CAAC,kBAAkB,CAAC,EAC7D,OAAO,EAAE,UAAU;IA2CvB,WAAW,CAAC,OAAO,EAAE,MAAM;CAG9B;AAED,eAAe,aAAa,CAAC"}
|
|
@@ -1,26 +1,26 @@
|
|
|
1
1
|
import { Error as e } from "../common/Error.js";
|
|
2
|
-
import "../constants.js";
|
|
3
|
-
import { DEFAULT_DOT_AES as
|
|
4
|
-
import { isContinuousAes as
|
|
2
|
+
import { BLACK as t } from "../constants.js";
|
|
3
|
+
import { DEFAULT_DOT_AES as n, PADDINGS as r } from "./constants.js";
|
|
4
|
+
import { isContinuousAes as i } from "../types/common.js";
|
|
5
5
|
import "../types/index.js";
|
|
6
|
-
import { getContinuousLegendTicks as
|
|
7
|
-
import { TextMeasurer as
|
|
8
|
-
import { getSizeLegendItem as
|
|
9
|
-
import { DataFrameProvider as
|
|
10
|
-
import { arrangeLegendParts as
|
|
11
|
-
import { splitTextByWidth as
|
|
6
|
+
import { getContinuousLegendTicks as a } from "../utils/getContinuousLegendTicks.js";
|
|
7
|
+
import { TextMeasurer as o } from "../utils/TextMeasurer/TextMeasurer.js";
|
|
8
|
+
import { getSizeLegendItem as s } from "../utils/getSizeLegendItem.js";
|
|
9
|
+
import { DataFrameProvider as c } from "../common/useDataFrame.js";
|
|
10
|
+
import { arrangeLegendParts as l } from "../utils/arrangeLegendParts.js";
|
|
11
|
+
import { splitTextByWidth as u } from "../utils/splitTextByWidth.js";
|
|
12
12
|
import "../discrete/utils/index.js";
|
|
13
|
-
import { createMultilineDiscreteLabels as
|
|
14
|
-
import { measureMultilineDiscreteLabels as
|
|
15
|
-
import { getTicksAndFormat as
|
|
16
|
-
import { getContinuousColorScale as
|
|
17
|
-
import { isContinuousAxis as
|
|
18
|
-
import { ChartsGroup as
|
|
19
|
-
import { createAesGetter as
|
|
20
|
-
import { scaleLinear as
|
|
21
|
-
import { createRoot as
|
|
22
|
-
import { Fragment as
|
|
23
|
-
function
|
|
13
|
+
import { createMultilineDiscreteLabels as d } from "../utils/createMultilineDiscreteLabels.js";
|
|
14
|
+
import { measureMultilineDiscreteLabels as f } from "../utils/measureMultilineDiscreteLabels.js";
|
|
15
|
+
import { getTicksAndFormat as p } from "./utils/getTicksAndFormat.js";
|
|
16
|
+
import { getContinuousColorScale as m } from "../utils/getContinuousColorScale.js";
|
|
17
|
+
import { isContinuousAxis as h } from "./utils/isNumericScale.js";
|
|
18
|
+
import { ChartsGroup as g } from "./components/ChartsGroup.js";
|
|
19
|
+
import { createAesGetter as _ } from "./utils/createAesGetter.js";
|
|
20
|
+
import { scaleLinear as v, scaleLog as y, scaleOrdinal as b, scalePoint as x, scaleSymlog as S } from "d3-scale";
|
|
21
|
+
import { createRoot as C } from "react-dom/client";
|
|
22
|
+
import { Fragment as w, jsx as T } from "react/jsx-runtime";
|
|
23
|
+
function E(e, t) {
|
|
24
24
|
if (e === void 0) return !0;
|
|
25
25
|
{
|
|
26
26
|
let n = e.domain(), r = e.range(), i = t.domain(), a = t.range();
|
|
@@ -28,11 +28,11 @@ function T(e, t) {
|
|
|
28
28
|
}
|
|
29
29
|
return !1;
|
|
30
30
|
}
|
|
31
|
-
function
|
|
31
|
+
function D(e, t, n, r) {
|
|
32
32
|
let i = [];
|
|
33
33
|
return e % n === n - 1 && i.push("right"), e % n === 0 && i.push("left"), e < n && i.push("top"), (Math.ceil((e + 1) / n) === r || Math.ceil((e + 1) / n) === r - 1 && e % n > (t - 1) % n) && i.push("bottom"), i;
|
|
34
34
|
}
|
|
35
|
-
function
|
|
35
|
+
function O(e, t, n, r, i, a, o, s, c, l) {
|
|
36
36
|
let u = e.scale === "discrete", d = t.scale === "discrete", f = a.includes("left") || !l?.sharedY, p = a.includes("left") && t.title !== "", m = a.includes("bottom") || !l?.sharedX, h = a.includes("bottom") && e.title !== "", g = t.hiddenLabels ? 0 : d ? n.leftAxisCaptionsWidthByColumns[s] + 12 : n.yAxisCaptionsWidth + 12, _ = (t.showTicks ? 4 : 0) + 6, v = p ? 20 : 0, y = e.hiddenLabels ? 0 : u ? n.bottomAxisCaptionsWidthByRows[o] + 12 : n.xAxisCaptionsWidth + 12, b = e.showTicks ? 4 : 0, x = h ? 20 : 0, S = g + _ + v + 8, C = y + b + x + 8, w = Math.max(...r.map((e) => i[e].length));
|
|
37
37
|
return {
|
|
38
38
|
left: f ? S : 12,
|
|
@@ -41,35 +41,37 @@ function D(e, t, n, r, i, a, o, s, c, l) {
|
|
|
41
41
|
right: c ? 0 : 12
|
|
42
42
|
};
|
|
43
43
|
}
|
|
44
|
-
function
|
|
44
|
+
function k(e, t, n) {
|
|
45
45
|
let r = [];
|
|
46
46
|
for (let i = 0; i < t; i++) r.push(e.slice(i * n, i * n + n));
|
|
47
47
|
return r;
|
|
48
48
|
}
|
|
49
|
-
function
|
|
49
|
+
function A(e, t) {
|
|
50
50
|
let n = Math.floor(e / t);
|
|
51
51
|
return [n, e - n * t];
|
|
52
52
|
}
|
|
53
|
-
function
|
|
54
|
-
let
|
|
53
|
+
function j(e, t, r, i, a) {
|
|
54
|
+
let o = r.find((e) => e.type === "dots"), s = r.find((e) => e.type === "curve");
|
|
55
55
|
return {
|
|
56
|
-
dotShape:
|
|
57
|
-
dotColor:
|
|
58
|
-
dotSize:
|
|
59
|
-
lineShape:
|
|
60
|
-
lineColor:
|
|
61
|
-
trendColor:
|
|
56
|
+
dotShape: _(e, t, o?.aes.dotShape ?? n.shape, "dotShape"),
|
|
57
|
+
dotColor: _(e, t, o?.aes.dotFill ?? n.color, "dotFill"),
|
|
58
|
+
dotSize: _(e, t, o?.aes.dotSize ?? n.size, "dotSize"),
|
|
59
|
+
lineShape: _(e, t, s?.aes.lineShape ?? "solid", "lineShape"),
|
|
60
|
+
lineColor: _(e, t, s?.aes.lineColor ?? "#110529", "lineColor"),
|
|
61
|
+
trendColor: _(e, t, i?.color ?? n.color, "fillColor"),
|
|
62
|
+
additionalCurveLineColor: (a?.curves ?? []).map((n) => _(e, t, n.lineColor, "lineColor")),
|
|
63
|
+
additionalCurveTrendColor: (a?.curves ?? []).map((n) => _(e, t, n.trend?.color ?? n.lineColor, "lineColor"))
|
|
62
64
|
};
|
|
63
65
|
}
|
|
64
|
-
var
|
|
65
|
-
function
|
|
66
|
-
return t.scale === "discrete" ? t.labelsPosition === "90deg" ? e : t.labelsPosition === "45deg" ? e *
|
|
66
|
+
var M = Math.cos(Math.PI / 4), N = 5;
|
|
67
|
+
function P(e, t) {
|
|
68
|
+
return t.scale === "discrete" ? t.labelsPosition === "90deg" ? e : t.labelsPosition === "45deg" ? e * M + (e > 0 ? 2 * N : 0) : 20 : Math.max(e, 20);
|
|
67
69
|
}
|
|
68
|
-
var
|
|
70
|
+
var F = class {
|
|
69
71
|
reactRoot = null;
|
|
70
72
|
parentNode = null;
|
|
71
73
|
rootNode = null;
|
|
72
|
-
component = /* @__PURE__ */ w
|
|
74
|
+
component = /* @__PURE__ */ T(w, {});
|
|
73
75
|
margins = {
|
|
74
76
|
top: 24,
|
|
75
77
|
bottom: 24,
|
|
@@ -88,8 +90,8 @@ var P = class {
|
|
|
88
90
|
columnsCount = 1;
|
|
89
91
|
rowsCount = 1;
|
|
90
92
|
scales = {
|
|
91
|
-
x: { null:
|
|
92
|
-
y: { null:
|
|
93
|
+
x: { null: v().domain([0, 1]).range([0, 600]) },
|
|
94
|
+
y: { null: v().domain([0, 1]).range([350, 0]) }
|
|
93
95
|
};
|
|
94
96
|
captionsSizes = {
|
|
95
97
|
xAxisCaptionsWidth: 30,
|
|
@@ -116,15 +118,15 @@ var P = class {
|
|
|
116
118
|
});
|
|
117
119
|
}
|
|
118
120
|
init(e) {
|
|
119
|
-
this.parentNode === null && (this.parentNode = e, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot =
|
|
121
|
+
this.parentNode === null && (this.parentNode = e, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = C(this.rootNode));
|
|
120
122
|
}
|
|
121
123
|
updateChartSizes(e) {
|
|
122
124
|
this.chartSizes.chartWidth = e.width, this.chartSizes.chartHeight = e.height;
|
|
123
125
|
}
|
|
124
126
|
updateChartDimensions(e, t, n, r) {
|
|
125
|
-
let { chartWidth: i, chartHeight: a } = this.chartSizes, o = 0, s = 0, c =
|
|
127
|
+
let { chartWidth: i, chartHeight: a } = this.chartSizes, o = 0, s = 0, c = k(e, this.rowsCount, this.columnsCount);
|
|
126
128
|
this.chartsDimensions = e.reduce((l, u, d) => {
|
|
127
|
-
let [f, p] =
|
|
129
|
+
let [f, p] = A(d, this.columnsCount), m = D(d, e.length, this.columnsCount, this.rowsCount), h = O(n, r, this.captionsSizes, c[f], this.facetTitles, m, f, p, p === this.columnsCount - 1, t), g = i + h.left + h.right, _ = a + h.top + h.bottom;
|
|
128
130
|
return l[u] = {
|
|
129
131
|
left: o,
|
|
130
132
|
top: s,
|
|
@@ -143,50 +145,50 @@ var P = class {
|
|
|
143
145
|
let l = Math.max(...e.map((e) => this.chartsDimensions[e].outer.width + this.chartsDimensions[e].left)), u = Math.max(...e.map((e) => this.chartsDimensions[e].outer.height + this.chartsDimensions[e].top));
|
|
144
146
|
this.chartSizes.chartsWidth = l, this.chartSizes.chartsHeight = u;
|
|
145
147
|
}
|
|
146
|
-
updateViewport(e, t,
|
|
148
|
+
updateViewport(e, t, n, i, a, o, s, c) {
|
|
147
149
|
let l = e.length, u = Math.min(t.nRows ?? l, l), d = Math.min(t.nCols ?? l, l);
|
|
148
150
|
this.columnsCount = t.nRows ? Math.ceil(l / u) : d, this.rowsCount = Math.ceil(l / this.columnsCount);
|
|
149
|
-
let [f, p] = [Infinity, -Infinity], [
|
|
151
|
+
let [f, p] = [Infinity, -Infinity], [m, g] = [Infinity, -Infinity], _ = e.reduce((e, t) => {
|
|
150
152
|
let { minX: n, minY: r, maxX: i, maxY: a } = s[t];
|
|
151
|
-
return f = Math.min(f, n),
|
|
153
|
+
return f = Math.min(f, n), m = Math.min(m, r), p = Math.max(p, i), g = Math.max(g, a), e[t] = {
|
|
152
154
|
minX: n,
|
|
153
155
|
maxX: i,
|
|
154
156
|
minY: r,
|
|
155
157
|
maxY: a
|
|
156
158
|
}, e;
|
|
157
|
-
}, {}),
|
|
159
|
+
}, {}), b = {}, S = {}, C = !1, w = !1;
|
|
158
160
|
e.forEach((e) => {
|
|
159
161
|
let i;
|
|
160
|
-
if (!
|
|
162
|
+
if (!h(n)) i = x().range([0, this.chartSizes.chartWidth]).domain(a.keys ?? []).padding(.5);
|
|
161
163
|
else {
|
|
162
|
-
i =
|
|
163
|
-
let a =
|
|
164
|
-
if (
|
|
165
|
-
let e =
|
|
164
|
+
i = n.scale === "log" ? y() : v();
|
|
165
|
+
let a = _[e], o = n.lowerValue ? Number(n.lowerValue) : t.sharedX ? f : a.minX, s = n.upperValue ? Number(n.upperValue) : t.sharedX ? p : a.maxX;
|
|
166
|
+
if (n.symmetricRange !== void 0) {
|
|
167
|
+
let e = n.symmetricRange;
|
|
166
168
|
if (e >= o && e <= s) {
|
|
167
169
|
let t = Math.max(e - o, s - e);
|
|
168
170
|
o = e - t, s = e + t;
|
|
169
171
|
}
|
|
170
172
|
}
|
|
171
|
-
let c = [0, this.chartSizes.chartWidth], l = i.copy().domain([o, s]).range([
|
|
173
|
+
let c = [0, this.chartSizes.chartWidth], l = i.copy().domain([o, s]).range([r.LEFT, this.chartSizes.chartWidth - r.RIGHT]);
|
|
172
174
|
i.domain([l.invert(0), l.invert(this.chartSizes.chartWidth)]).range(c).nice();
|
|
173
175
|
}
|
|
174
176
|
let o = this.scales.x[e];
|
|
175
|
-
|
|
177
|
+
b[e] = i, C ||= E(o, i);
|
|
176
178
|
});
|
|
177
|
-
let
|
|
179
|
+
let T = e.reduce((e, t) => (e[t] = (c ? c[t] : []).reduce((e, n) => {
|
|
178
180
|
let r = n.bounded ? n.xBounds : this.scales.x[t].domain(), i = n.getInterval(r[0]), a = n.getInterval(r[1]);
|
|
179
181
|
return e.minY = Math.min(e.minY, isNaN(i.left) ? e.minY : i.left, isNaN(a.left) ? e.minY : a.left), e.maxY = Math.max(e.maxY, isNaN(i.right) ? e.maxY : i.right, isNaN(a.right) ? e.maxY : a.right), e;
|
|
180
182
|
}, {
|
|
181
183
|
minY: Infinity,
|
|
182
184
|
maxY: -Infinity
|
|
183
|
-
}),
|
|
185
|
+
}), m = Math.min(m, e[t].minY), g = Math.max(g, e[t].maxY), e), {});
|
|
184
186
|
e.forEach((e) => {
|
|
185
|
-
let
|
|
186
|
-
if (!
|
|
187
|
+
let n;
|
|
188
|
+
if (!h(i)) n = x().range([this.chartSizes.chartHeight, 0]).domain(o.keys ?? []).padding(.5);
|
|
187
189
|
else {
|
|
188
|
-
|
|
189
|
-
let a =
|
|
190
|
+
n = i.scale === "log" ? y() : v();
|
|
191
|
+
let a = _[e], o = T[e], s = i.lowerValue ? Number(i.lowerValue) : t.sharedY ? m : Math.min(a.minY, o.minY), c = i.upperValue ? Number(i.upperValue) : t.sharedY ? g : Math.max(a.maxY, o.maxY);
|
|
190
192
|
if (i.symmetricRange !== void 0) {
|
|
191
193
|
let e = i.symmetricRange;
|
|
192
194
|
if (e >= s && e <= c) {
|
|
@@ -194,33 +196,33 @@ var P = class {
|
|
|
194
196
|
s = e - t, c = e + t;
|
|
195
197
|
}
|
|
196
198
|
}
|
|
197
|
-
let l = [this.chartSizes.chartHeight, 0], u =
|
|
198
|
-
|
|
199
|
+
let l = [this.chartSizes.chartHeight, 0], u = n.copy().domain([s, c]).range([this.chartSizes.chartHeight - r.BOTTOM, r.TOP]);
|
|
200
|
+
n.domain([u.invert(this.chartSizes.chartHeight), u.invert(0)]).range(l).nice();
|
|
199
201
|
}
|
|
200
202
|
let a = this.scales.y[e];
|
|
201
|
-
S[e] =
|
|
202
|
-
}), C && (this.scales.x =
|
|
203
|
+
S[e] = n, w ||= E(a, n);
|
|
204
|
+
}), C && (this.scales.x = b), w && (this.scales.y = S);
|
|
203
205
|
}
|
|
204
206
|
updateCaptionsSize(e, t, n, r) {
|
|
205
|
-
let i = new
|
|
206
|
-
function
|
|
207
|
+
let i = new o("600 14px Manrope");
|
|
208
|
+
function a(e) {
|
|
207
209
|
return Math.max(...e.map((e) => i.getTextWidth(e)));
|
|
208
210
|
}
|
|
209
|
-
let s = 0, c = 0, l = [], u = [],
|
|
211
|
+
let s = 0, c = 0, l = [], u = [], d = 0, m = 0;
|
|
210
212
|
if (t.scale === "discrete") {
|
|
211
|
-
let n =
|
|
213
|
+
let n = f(e, this.rowsCount, this.columnsCount, t.labelsPosition ?? "center", this.discreteAxesLabels.x, "vertical", this.scales.x);
|
|
212
214
|
s = n.xTail, l = n.axisCaptionsWidthByRows;
|
|
213
|
-
} else
|
|
215
|
+
} else d = 20;
|
|
214
216
|
if (n.scale === "discrete") {
|
|
215
|
-
let t =
|
|
217
|
+
let t = f(e, this.rowsCount, this.columnsCount, n.labelsPosition ?? "center", this.discreteAxesLabels.y, "horizontal", this.scales.y);
|
|
216
218
|
c = t.yTail, u = t.axisCaptionsWidthByColumns;
|
|
217
219
|
} else Object.values(this.scales.y).forEach((e) => {
|
|
218
|
-
let { ticks: t, format: n } =
|
|
219
|
-
m = Math.max(m,
|
|
220
|
+
let { ticks: t, format: n } = p(e, r);
|
|
221
|
+
m = Math.max(m, a(t.map(n)));
|
|
220
222
|
});
|
|
221
223
|
this.captionsSizes = {
|
|
222
|
-
xAxisCaptionsWidth: t.hiddenLabels ? 0 :
|
|
223
|
-
yAxisCaptionsWidth: n.hiddenLabels ? 0 :
|
|
224
|
+
xAxisCaptionsWidth: t.hiddenLabels ? 0 : P(d, t),
|
|
225
|
+
yAxisCaptionsWidth: n.hiddenLabels ? 0 : P(m, n),
|
|
224
226
|
bottomAxisCaptionsWidthByRows: l,
|
|
225
227
|
leftAxisCaptionsWidthByColumns: u,
|
|
226
228
|
bottomCaptionsTail: s,
|
|
@@ -229,15 +231,15 @@ var P = class {
|
|
|
229
231
|
}
|
|
230
232
|
createMainTitle(e, t) {
|
|
231
233
|
let n = this.chartsDimensions[e[0]], r = this.chartsDimensions[e[e.length - 1]];
|
|
232
|
-
this.mainTitle =
|
|
234
|
+
this.mainTitle = u(t.name, this.chartSizes.chartsWidth - n.padding.left - r.padding.right, 20);
|
|
233
235
|
}
|
|
234
236
|
createFacetTitles(e, t) {
|
|
235
|
-
this.facetTitles = e.reduce((e, n, r) => (t[r].length === 1 && t[r][0] === "null" ? e[n] = [] : e[n] =
|
|
237
|
+
this.facetTitles = e.reduce((e, n, r) => (t[r].length === 1 && t[r][0] === "null" ? e[n] = [] : e[n] = u(t[r].join(", "), this.chartSizes.chartWidth, 14), e), {});
|
|
236
238
|
}
|
|
237
239
|
createAxisLabels(e, t, n, r, i) {
|
|
238
240
|
this.discreteAxesLabels = {
|
|
239
|
-
x: t.scale === "discrete" ?
|
|
240
|
-
y: n.scale === "discrete" ?
|
|
241
|
+
x: t.scale === "discrete" ? d(e, t?.labelsPosition ?? "center", r.labels, !1, "vertical", this.scales.x) : {},
|
|
242
|
+
y: n.scale === "discrete" ? d(e, n.labelsPosition ?? "center", i.labels, !1, "horizontal", this.scales.y) : {}
|
|
241
243
|
};
|
|
242
244
|
}
|
|
243
245
|
updateMargins(e) {
|
|
@@ -249,7 +251,7 @@ var P = class {
|
|
|
249
251
|
right: this.legend.width + 24
|
|
250
252
|
}, this.chartSizes.totalWidth = this.margins.left + this.chartSizes.chartsWidth + this.margins.right, this.chartSizes.totalHeight = this.margins.top + Math.max(this.chartSizes.chartsHeight, this.legend.height) + this.margins.bottom;
|
|
251
253
|
}
|
|
252
|
-
updateLegendSize(e,
|
|
254
|
+
updateLegendSize(e, r, o, c, u, d) {
|
|
253
255
|
if (!e.show) {
|
|
254
256
|
this.legend = {
|
|
255
257
|
width: 0,
|
|
@@ -258,50 +260,88 @@ var P = class {
|
|
|
258
260
|
};
|
|
259
261
|
return;
|
|
260
262
|
}
|
|
261
|
-
let
|
|
263
|
+
let f = [], p = {
|
|
262
264
|
width: 0,
|
|
263
265
|
height: 0,
|
|
264
266
|
left: 0,
|
|
265
267
|
top: 0
|
|
266
|
-
},
|
|
267
|
-
if (
|
|
268
|
-
let
|
|
269
|
-
if (
|
|
270
|
-
if (
|
|
271
|
-
console.warn(`Too many values for discrete legend (${
|
|
268
|
+
}, h = Math.min(Math.max(this.chartSizes.chartHeight, 250), 400), g = Math.max(this.chartSizes.chartHeight, h);
|
|
269
|
+
if (o.forEach((e) => {
|
|
270
|
+
let t = r[e.value];
|
|
271
|
+
if (t.usedAes.length === 0 || !t.aesMap) return;
|
|
272
|
+
if (t.values.length > 100) {
|
|
273
|
+
console.warn(`Too many values for discrete legend (${t.values.length})`);
|
|
272
274
|
return;
|
|
273
275
|
}
|
|
274
276
|
let i = {};
|
|
275
|
-
|
|
276
|
-
i[e] || (i[e] = { ...
|
|
277
|
-
(
|
|
277
|
+
t.values.forEach((e) => {
|
|
278
|
+
i[e] || (i[e] = { ...n }), t.usedAes.forEach((n) => {
|
|
279
|
+
(n === "dotFill" || n === "lineColor") && (i[e].color = t.aesMap(e, n) ?? "#110529"), n === "dotShape" && (i[e].shape = t.aesMap(e, n) ?? "21"), n === "dotSize" && (i[e].size = t.aesMap(e, n) ?? 3);
|
|
278
280
|
});
|
|
279
281
|
});
|
|
280
|
-
let a = e.label ?? e.value, o =
|
|
281
|
-
|
|
282
|
-
...
|
|
282
|
+
let a = e.label ?? e.value, o = b().domain(t.values).range(t.values.map((e) => i[e])).unknown(n);
|
|
283
|
+
f.push({
|
|
284
|
+
...p,
|
|
283
285
|
id: e.value,
|
|
284
286
|
type: "dots",
|
|
285
287
|
title: a,
|
|
286
288
|
scale: o,
|
|
287
|
-
values:
|
|
288
|
-
labels:
|
|
289
|
+
values: t.values,
|
|
290
|
+
labels: t.labels
|
|
289
291
|
});
|
|
290
|
-
}),
|
|
291
|
-
if (e.type === "dots" &&
|
|
292
|
-
let { domain: t, range: n, columnName: r, type:
|
|
293
|
-
|
|
294
|
-
...
|
|
292
|
+
}), c.forEach((e) => {
|
|
293
|
+
if (e.type === "dots" && i(e.aes.dotFill)) {
|
|
294
|
+
let { domain: t, range: n, columnName: r, type: i = "linear" } = e.aes.dotFill, o = r.label ?? r.value, s = m(n, t, "linear"), c = (i === "log" ? S() : v()).domain(t).range([h, 0]), l = a(c, t);
|
|
295
|
+
f.push({
|
|
296
|
+
...p,
|
|
295
297
|
id: "dotFill",
|
|
296
298
|
type: "continuous",
|
|
297
299
|
title: o,
|
|
298
300
|
scale: s,
|
|
299
301
|
tickPositionScale: c,
|
|
300
|
-
values:
|
|
302
|
+
values: l
|
|
301
303
|
});
|
|
302
304
|
}
|
|
303
|
-
e.type === "dots" &&
|
|
304
|
-
}),
|
|
305
|
+
e.type === "dots" && i(e.aes.dotSize) && f.push(s(e.aes.dotSize));
|
|
306
|
+
}), u && u.curves.length > 0) {
|
|
307
|
+
let e = t, n = [], r = {}, i = {}, a = c.find((e) => e.type === "curve");
|
|
308
|
+
if (a) {
|
|
309
|
+
let t = d.label ?? d.value, o = typeof a.aes.lineColor == "string" ? a.aes.lineColor : e;
|
|
310
|
+
n.push(t), r[t] = t, i[t] = {
|
|
311
|
+
lineShape: a.aes.lineShape,
|
|
312
|
+
lineColor: o
|
|
313
|
+
};
|
|
314
|
+
}
|
|
315
|
+
for (let t of u.curves) {
|
|
316
|
+
let a = t.label, o = 1;
|
|
317
|
+
for (; n.includes(a);) a = `${t.label} (${++o})`;
|
|
318
|
+
let s = typeof t.lineColor == "string" ? t.lineColor : e;
|
|
319
|
+
n.push(a), r[a] = a, i[a] = {
|
|
320
|
+
lineShape: t.lineShape,
|
|
321
|
+
lineColor: s
|
|
322
|
+
};
|
|
323
|
+
}
|
|
324
|
+
if (n.length > 0) {
|
|
325
|
+
let e = b().domain(n).range(n.map((e) => i[e])).unknown({});
|
|
326
|
+
f.push({
|
|
327
|
+
...p,
|
|
328
|
+
id: "additionalCurves",
|
|
329
|
+
type: "discreteMulti",
|
|
330
|
+
title: "Curves",
|
|
331
|
+
scale: e,
|
|
332
|
+
values: n,
|
|
333
|
+
labels: r,
|
|
334
|
+
usedAes: {
|
|
335
|
+
lineShape: !0,
|
|
336
|
+
lineColor: !0,
|
|
337
|
+
dotFill: !1,
|
|
338
|
+
dotShape: !1,
|
|
339
|
+
fillColor: !1
|
|
340
|
+
}
|
|
341
|
+
});
|
|
342
|
+
}
|
|
343
|
+
}
|
|
344
|
+
if (!f.length) {
|
|
305
345
|
this.legend = {
|
|
306
346
|
width: 0,
|
|
307
347
|
height: 0,
|
|
@@ -309,19 +349,19 @@ var P = class {
|
|
|
309
349
|
};
|
|
310
350
|
return;
|
|
311
351
|
}
|
|
312
|
-
let
|
|
352
|
+
let _ = l(f, g, h);
|
|
313
353
|
this.legend = {
|
|
314
|
-
width:
|
|
315
|
-
height:
|
|
316
|
-
items:
|
|
354
|
+
width: _.reduce((e, t) => Math.max(e, t.left + t.width), 0) + 20,
|
|
355
|
+
height: g,
|
|
356
|
+
items: _
|
|
317
357
|
};
|
|
318
358
|
}
|
|
319
|
-
render(e, t, n, r, i, a, o,
|
|
320
|
-
let { xAxis:
|
|
321
|
-
this.updateChartSizes(
|
|
322
|
-
let
|
|
359
|
+
render(e, t, n, r, i, a, o, s, l, u, d, f, p, m, h, _, v, y, b, x) {
|
|
360
|
+
let { xAxis: S, yAxis: C, size: w, title: E, legend: D } = n;
|
|
361
|
+
this.updateChartSizes(w), this.updateViewport(i, r, S, C, _, v, o, s), this.createAxisLabels(i, S, C, _, v), this.updateCaptionsSize(i, S, C, u.y), this.createFacetTitles(i, a), this.updateChartDimensions(i, r, S, C), this.updateLegendSize(D, d, p, m, b, x), this.createMainTitle(i, E), this.updateMargins(i);
|
|
362
|
+
let O = /* @__PURE__ */ T(c, {
|
|
323
363
|
dataFrame: e,
|
|
324
|
-
children: /* @__PURE__ */
|
|
364
|
+
children: /* @__PURE__ */ T(g, {
|
|
325
365
|
settingsId: t,
|
|
326
366
|
chartSettings: n,
|
|
327
367
|
facetKeys: i,
|
|
@@ -330,7 +370,7 @@ var P = class {
|
|
|
330
370
|
chartsDimensions: this.chartsDimensions,
|
|
331
371
|
scales: this.scales,
|
|
332
372
|
groupedDots: o,
|
|
333
|
-
trendsData:
|
|
373
|
+
trendsData: s,
|
|
334
374
|
legendData: this.legend,
|
|
335
375
|
columnsCount: this.columnsCount,
|
|
336
376
|
margins: this.margins,
|
|
@@ -340,17 +380,17 @@ var P = class {
|
|
|
340
380
|
captionsSizes: this.captionsSizes,
|
|
341
381
|
onlyPositive: u,
|
|
342
382
|
layersData: f,
|
|
343
|
-
aesGetters:
|
|
383
|
+
aesGetters: j(e, d, m, h, b),
|
|
344
384
|
onTooltipHintSwitch: y,
|
|
345
385
|
discreteAxesLabels: this.discreteAxesLabels
|
|
346
386
|
})
|
|
347
387
|
});
|
|
348
|
-
this.component =
|
|
388
|
+
this.component = O, this.reactRoot?.render(O);
|
|
349
389
|
}
|
|
350
390
|
renderError(t) {
|
|
351
|
-
this.reactRoot?.render(/* @__PURE__ */
|
|
391
|
+
this.reactRoot?.render(/* @__PURE__ */ T(e, { message: t }));
|
|
352
392
|
}
|
|
353
393
|
};
|
|
354
|
-
export {
|
|
394
|
+
export { F as default };
|
|
355
395
|
|
|
356
396
|
//# sourceMappingURL=ChartRenderer.js.map
|