stickyflow 0.10.0 → 0.11.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/CHANGELOG.md +14 -0
- package/dist/binding/index.cjs +9 -9
- package/dist/binding/index.d.cts +4 -4
- package/dist/binding/index.d.ts +4 -4
- package/dist/binding/index.js +3 -3
- package/dist/{chunk-5PJ55GPG.cjs → chunk-5G3BEXQU.cjs} +1069 -713
- package/dist/chunk-5G3BEXQU.cjs.map +1 -0
- package/dist/{chunk-EGUPN56K.js → chunk-BFQWCOEC.js} +3 -3
- package/dist/{chunk-EGUPN56K.js.map → chunk-BFQWCOEC.js.map} +1 -1
- package/dist/{chunk-KRSX4UZ7.cjs → chunk-F24JURN2.cjs} +293 -46
- package/dist/chunk-F24JURN2.cjs.map +1 -0
- package/dist/{chunk-TECWZVIM.cjs → chunk-FXGXUWSI.cjs} +23 -23
- package/dist/{chunk-TECWZVIM.cjs.map → chunk-FXGXUWSI.cjs.map} +1 -1
- package/dist/{chunk-HRU6VOEC.js → chunk-G6IW2IX3.js} +44 -7
- package/dist/chunk-G6IW2IX3.js.map +1 -0
- package/dist/{chunk-SDOHUNBW.js → chunk-Q6QLU6YQ.js} +428 -72
- package/dist/chunk-Q6QLU6YQ.js.map +1 -0
- package/dist/{chunk-VPNOVRWP.js → chunk-RQYZNW2I.js} +262 -15
- package/dist/chunk-RQYZNW2I.js.map +1 -0
- package/dist/{chunk-L7CEX5JV.js → chunk-UB2ANTWF.js} +4 -4
- package/dist/{chunk-L7CEX5JV.js.map → chunk-UB2ANTWF.js.map} +1 -1
- package/dist/{chunk-LSEMXRB5.cjs → chunk-UHKFJBY5.cjs} +44 -7
- package/dist/chunk-UHKFJBY5.cjs.map +1 -0
- package/dist/{chunk-SCD3AHMY.cjs → chunk-WZA3DJJH.cjs} +15 -15
- package/dist/{chunk-SCD3AHMY.cjs.map → chunk-WZA3DJJH.cjs.map} +1 -1
- package/dist/index.cjs +36 -36
- package/dist/index.d.cts +5 -5
- package/dist/index.d.ts +5 -5
- package/dist/index.js +5 -5
- package/dist/interaction/index.cjs +240 -237
- package/dist/interaction/index.cjs.map +1 -1
- package/dist/interaction/index.d.cts +3 -3
- package/dist/interaction/index.d.ts +3 -3
- package/dist/interaction/index.js +6 -3
- package/dist/interaction/index.js.map +1 -1
- package/dist/{render-DU4lYbRl.d.cts → render-BDO4S5uF.d.cts} +16 -0
- package/dist/{render-DU4lYbRl.d.ts → render-BDO4S5uF.d.ts} +16 -0
- package/dist/{runtime-Bkv7QW7H.d.cts → runtime-C-C5v9po.d.cts} +2 -2
- package/dist/{runtime-DJ4K4_HZ.d.ts → runtime-lCAfU-1Q.d.ts} +2 -2
- package/dist/{runtimeTypes-C1shzoyr.d.ts → runtimeTypes-B7p6b1Bi.d.cts} +2 -2
- package/dist/{runtimeTypes-BvJBZLkr.d.cts → runtimeTypes-BDA_CfWh.d.ts} +2 -2
- package/dist/stickyflow-diagram.global.js +197 -44
- package/dist/stickyflow-diagram.global.js.map +1 -1
- package/dist/{types-B5jrEEcF.d.cts → types-CZJzycKw.d.cts} +1 -1
- package/dist/{types-B7IkZ0w4.d.ts → types-Dp8JVZLB.d.ts} +1 -1
- package/dist/viewer/index.cjs +9 -9
- package/dist/viewer/index.d.cts +4 -4
- package/dist/viewer/index.d.ts +4 -4
- package/dist/viewer/index.js +4 -4
- package/dist/web-component/index.cjs +6 -6
- package/dist/web-component/index.d.cts +2 -2
- package/dist/web-component/index.d.ts +2 -2
- package/dist/web-component/index.js +4 -4
- package/package.json +1 -1
- package/dist/chunk-5PJ55GPG.cjs.map +0 -1
- package/dist/chunk-HRU6VOEC.js.map +0 -1
- package/dist/chunk-KRSX4UZ7.cjs.map +0 -1
- package/dist/chunk-LSEMXRB5.cjs.map +0 -1
- package/dist/chunk-SDOHUNBW.js.map +0 -1
- package/dist/chunk-VPNOVRWP.js.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkUHKFJBY5_cjs = require('./chunk-UHKFJBY5.cjs');
|
|
4
4
|
|
|
5
5
|
// src/renderInput/styleDecoding/colorToken.ts
|
|
6
6
|
var COLOR_TOKEN_PATTERN = String.raw`rgba?\([^)]*\)|#[0-9a-fA-F]+|[a-zA-Z][\w-]*`;
|
|
@@ -119,8 +119,8 @@ function dashArray(value) {
|
|
|
119
119
|
if (!Array.isArray(parsed)) {
|
|
120
120
|
return void 0;
|
|
121
121
|
}
|
|
122
|
-
const
|
|
123
|
-
return
|
|
122
|
+
const numbers2 = parsed.filter((entry) => typeof entry === "number" && Number.isFinite(entry));
|
|
123
|
+
return numbers2.length === parsed.length ? numbers2 : void 0;
|
|
124
124
|
}
|
|
125
125
|
function solidColor(value) {
|
|
126
126
|
const decoded = decodeColor(value);
|
|
@@ -632,7 +632,7 @@ function readProperty(descriptor, raw) {
|
|
|
632
632
|
case "boolean":
|
|
633
633
|
return raw === void 0 ? descriptor.default : raw === "true";
|
|
634
634
|
case "color":
|
|
635
|
-
return cssColor(raw) ?? descriptor.default;
|
|
635
|
+
return descriptor.optional && raw === "none" ? "none" : cssColor(raw) ?? descriptor.default;
|
|
636
636
|
case "enum":
|
|
637
637
|
return raw !== void 0 && descriptor.options.includes(raw) ? raw : descriptor.default;
|
|
638
638
|
case "string":
|
|
@@ -660,7 +660,7 @@ function readComponentValue(descriptor, raw) {
|
|
|
660
660
|
return raw;
|
|
661
661
|
}
|
|
662
662
|
function genericComponentObject(canvasObject) {
|
|
663
|
-
const descriptor =
|
|
663
|
+
const descriptor = chunkUHKFJBY5_cjs.getComponentDescriptor(canvasObject.component.type);
|
|
664
664
|
return {
|
|
665
665
|
id: canvasObject.id,
|
|
666
666
|
type: canvasObject.component.type,
|
|
@@ -849,7 +849,7 @@ var BUILT_IN_OBJECTS = {
|
|
|
849
849
|
};
|
|
850
850
|
function componentObject(canvasObject) {
|
|
851
851
|
const type = canvasObject.component.type;
|
|
852
|
-
return
|
|
852
|
+
return chunkUHKFJBY5_cjs.isBuiltInComponentType(type) ? BUILT_IN_OBJECTS[type](canvasObject) : genericComponentObject(canvasObject);
|
|
853
853
|
}
|
|
854
854
|
|
|
855
855
|
// src/renderInput/fromSfl/canvasObjects/connection.ts
|
|
@@ -1012,12 +1012,29 @@ function pathObject(e) {
|
|
|
1012
1012
|
}
|
|
1013
1013
|
|
|
1014
1014
|
// src/renderInput/fromSfl/canvasObjects/shape.ts
|
|
1015
|
+
var IMAGE_FITS = ["cover", "contain", "fill"];
|
|
1015
1016
|
function shapeTypeOf(value) {
|
|
1016
1017
|
return value || "rectangle";
|
|
1017
1018
|
}
|
|
1019
|
+
function numbers(value, count) {
|
|
1020
|
+
const parts = value?.split(",").map(Number);
|
|
1021
|
+
return parts?.length === count && parts.every(Number.isFinite) ? parts : void 0;
|
|
1022
|
+
}
|
|
1023
|
+
function imageOf(p) {
|
|
1024
|
+
const size = numbers(p.imageSize, 2);
|
|
1025
|
+
const crop = numbers(p.crop, 4);
|
|
1026
|
+
return {
|
|
1027
|
+
src: p.src,
|
|
1028
|
+
fit: oneOf(p.fit, IMAGE_FITS, "cover"),
|
|
1029
|
+
pixels: size && size[0] > 0 && size[1] > 0 ? [size[0], size[1]] : void 0,
|
|
1030
|
+
crop: crop && crop[2] > 0 && crop[3] > 0 ? { x: crop[0], y: crop[1], width: crop[2], height: crop[3] } : void 0
|
|
1031
|
+
};
|
|
1032
|
+
}
|
|
1018
1033
|
function shapeObject(e, shaders) {
|
|
1019
1034
|
const p = e.props;
|
|
1020
1035
|
const isText = e.kind === "text";
|
|
1036
|
+
const isImage = e.kind === "image";
|
|
1037
|
+
const unpainted = isText || isImage;
|
|
1021
1038
|
return {
|
|
1022
1039
|
id: e.id,
|
|
1023
1040
|
type: "shape",
|
|
@@ -1031,8 +1048,8 @@ function shapeObject(e, shaders) {
|
|
|
1031
1048
|
w: e.width,
|
|
1032
1049
|
h: e.height,
|
|
1033
1050
|
rotation: e.rotation ?? 0,
|
|
1034
|
-
fillColor: decodeColor(p.fill ?? (
|
|
1035
|
-
strokeColor: strokePaint(p.stroke ?? (
|
|
1051
|
+
fillColor: decodeColor(p.fill ?? (unpainted ? "none" : void 0)),
|
|
1052
|
+
strokeColor: strokePaint(p.stroke ?? (unpainted ? "none" : void 0)),
|
|
1036
1053
|
isText: isText || void 0,
|
|
1037
1054
|
strokeWidth: numOf(p.strokeWidth),
|
|
1038
1055
|
textColor: p.textColor,
|
|
@@ -1053,7 +1070,8 @@ function shapeObject(e, shaders) {
|
|
|
1053
1070
|
parentFrameId: e.parentFrameId,
|
|
1054
1071
|
order: e.order,
|
|
1055
1072
|
sourceIndex: e.sourceIndex,
|
|
1056
|
-
shader: p.shader ? shaders.get(p.shader) : void 0
|
|
1073
|
+
shader: p.shader ? shaders.get(p.shader) : void 0,
|
|
1074
|
+
image: isImage && p.src ? imageOf(p) : void 0
|
|
1057
1075
|
};
|
|
1058
1076
|
}
|
|
1059
1077
|
|
|
@@ -1094,9 +1112,9 @@ function collectCanvasObjects(state) {
|
|
|
1094
1112
|
shapes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "shape").map((shape) => shapeObject(shape, shaders)),
|
|
1095
1113
|
frames: canvasObjects.filter((canvasObject) => canvasObject.objectType === "frame").map(frameObject),
|
|
1096
1114
|
swimlanes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "swimlane").map(swimlaneObject),
|
|
1097
|
-
isometricObjects: canvasObjects.filter(
|
|
1115
|
+
isometricObjects: canvasObjects.filter(chunkUHKFJBY5_cjs.isIsometricObject).map(isometricObject),
|
|
1098
1116
|
paths: canvasObjects.filter((canvasObject) => canvasObject.objectType === "path").map(pathObject),
|
|
1099
|
-
dimensions: canvasObjects.filter(
|
|
1117
|
+
dimensions: canvasObjects.filter(chunkUHKFJBY5_cjs.isDimensionObject).map(dimensionObject),
|
|
1100
1118
|
charts: canvasObjects.filter((canvasObject) => canvasObject.objectType === "chart").map(chartObject),
|
|
1101
1119
|
components: canvasObjects.filter(
|
|
1102
1120
|
(canvasObject) => canvasObject.objectType === "component" && canvasObject.component !== void 0
|
|
@@ -1123,9 +1141,9 @@ function sidePoint(canvasObject, endpoint) {
|
|
|
1123
1141
|
function namedPortPoint(canvasObject, endpoint) {
|
|
1124
1142
|
const port = canvasObject.symbol?.ports?.find((candidate) => candidate.name === endpoint.port);
|
|
1125
1143
|
if (!port) {
|
|
1126
|
-
return
|
|
1144
|
+
return chunkUHKFJBY5_cjs.elementCenter(canvasObject);
|
|
1127
1145
|
}
|
|
1128
|
-
return
|
|
1146
|
+
return chunkUHKFJBY5_cjs.pointAtNormalizedPort(
|
|
1129
1147
|
{
|
|
1130
1148
|
x: canvasObject.x,
|
|
1131
1149
|
y: canvasObject.y,
|
|
@@ -1171,7 +1189,7 @@ function explicitAnchorPoint(canvasObject, endpoint) {
|
|
|
1171
1189
|
return null;
|
|
1172
1190
|
}
|
|
1173
1191
|
function automaticEndpointPoint(canvasObject, opposite) {
|
|
1174
|
-
return opposite ?
|
|
1192
|
+
return opposite ? chunkUHKFJBY5_cjs.edgePointToward(canvasObject, opposite) : chunkUHKFJBY5_cjs.elementCenter(canvasObject);
|
|
1175
1193
|
}
|
|
1176
1194
|
function findPositionedCanvasObject(canvasObjects, id) {
|
|
1177
1195
|
return canvasObjects.find((candidate) => candidate.id === id);
|
|
@@ -1189,7 +1207,7 @@ function positionedCanvasObjects(canvasObjects) {
|
|
|
1189
1207
|
];
|
|
1190
1208
|
}
|
|
1191
1209
|
function connectionEndpointPoint(object, face) {
|
|
1192
|
-
return object ?
|
|
1210
|
+
return object ? chunkUHKFJBY5_cjs.isometricFaceCenter(object, face) : { x: 0, y: 0 };
|
|
1193
1211
|
}
|
|
1194
1212
|
function isometricStackPosition(isometricObjects, id) {
|
|
1195
1213
|
const index = isometricObjects.findIndex((object2) => object2.id === id);
|
|
@@ -1204,8 +1222,8 @@ function connectionStack(isometricObjects, connection) {
|
|
|
1204
1222
|
return { order: connection.order, sourceIndex: connection.sourceIndex };
|
|
1205
1223
|
}
|
|
1206
1224
|
const behind = [
|
|
1207
|
-
|
|
1208
|
-
|
|
1225
|
+
chunkUHKFJBY5_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.fromFace) ? void 0 : isometricStackPosition(isometricObjects, connection.fromId),
|
|
1226
|
+
chunkUHKFJBY5_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.toFace) ? void 0 : isometricStackPosition(isometricObjects, connection.toId)
|
|
1209
1227
|
].filter((position) => position !== void 0);
|
|
1210
1228
|
if (!behind.length) {
|
|
1211
1229
|
return { sourceIndex: connection.sourceIndex };
|
|
@@ -1247,7 +1265,7 @@ function createRenderInputLinks(canvasObjects) {
|
|
|
1247
1265
|
|
|
1248
1266
|
// src/renderInput/fromSfl/index.ts
|
|
1249
1267
|
function sflToRenderInput(sfl) {
|
|
1250
|
-
const state =
|
|
1268
|
+
const state = chunkUHKFJBY5_cjs.sflToCanvasState(sfl);
|
|
1251
1269
|
const canvasObjects = collectCanvasObjects(state);
|
|
1252
1270
|
return {
|
|
1253
1271
|
shapes: canvasObjects.shapes,
|
|
@@ -1266,13 +1284,13 @@ function sflToRenderInput(sfl) {
|
|
|
1266
1284
|
// src/renderScene/artifacts/component/placeholder.ts
|
|
1267
1285
|
var STROKE = "#94a3b8";
|
|
1268
1286
|
function buildPlaceholder(component, index) {
|
|
1269
|
-
const x =
|
|
1270
|
-
const y =
|
|
1271
|
-
const width = Math.max(0,
|
|
1272
|
-
const height = Math.max(0,
|
|
1273
|
-
const rotation =
|
|
1287
|
+
const x = chunkUHKFJBY5_cjs.finite(component.x, 0);
|
|
1288
|
+
const y = chunkUHKFJBY5_cjs.finite(component.y, 0);
|
|
1289
|
+
const width = Math.max(0, chunkUHKFJBY5_cjs.finite(component.width, 120));
|
|
1290
|
+
const height = Math.max(0, chunkUHKFJBY5_cjs.finite(component.height, 60));
|
|
1291
|
+
const rotation = chunkUHKFJBY5_cjs.finite(component.rotation, 0);
|
|
1274
1292
|
const order = 1e4 + index;
|
|
1275
|
-
const bounds =
|
|
1293
|
+
const bounds = chunkUHKFJBY5_cjs.rotatedBounds({ x, y, width, height }, rotation, 2);
|
|
1276
1294
|
return [
|
|
1277
1295
|
{
|
|
1278
1296
|
id: `widget-${component.id}`,
|
|
@@ -1297,7 +1315,7 @@ function buildPlaceholder(component, index) {
|
|
|
1297
1315
|
width,
|
|
1298
1316
|
height,
|
|
1299
1317
|
lines: [component.type],
|
|
1300
|
-
fontFamily:
|
|
1318
|
+
fontFamily: chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
1301
1319
|
fontSize: 12,
|
|
1302
1320
|
fontWeight: "normal",
|
|
1303
1321
|
color: STROKE,
|
|
@@ -1311,44 +1329,44 @@ function buildPlaceholder(component, index) {
|
|
|
1311
1329
|
|
|
1312
1330
|
// src/renderScene/artifacts/component/builtIn.ts
|
|
1313
1331
|
function buildRollingNumber(component, index) {
|
|
1314
|
-
const x =
|
|
1315
|
-
const y =
|
|
1316
|
-
const width = Math.max(0,
|
|
1317
|
-
const height = Math.max(0,
|
|
1318
|
-
const rotation =
|
|
1332
|
+
const x = chunkUHKFJBY5_cjs.finite(component.x, 0);
|
|
1333
|
+
const y = chunkUHKFJBY5_cjs.finite(component.y, 0);
|
|
1334
|
+
const width = Math.max(0, chunkUHKFJBY5_cjs.finite(component.width, 160));
|
|
1335
|
+
const height = Math.max(0, chunkUHKFJBY5_cjs.finite(component.height, 90));
|
|
1336
|
+
const rotation = chunkUHKFJBY5_cjs.finite(component.rotation, 0);
|
|
1319
1337
|
return [
|
|
1320
1338
|
{
|
|
1321
1339
|
id: `widget-${component.id}`,
|
|
1322
1340
|
type: "rolling-number",
|
|
1323
1341
|
order: 1e4 + index,
|
|
1324
|
-
bounds:
|
|
1342
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1325
1343
|
x,
|
|
1326
1344
|
y,
|
|
1327
1345
|
width,
|
|
1328
1346
|
height,
|
|
1329
1347
|
rotation,
|
|
1330
|
-
value:
|
|
1348
|
+
value: chunkUHKFJBY5_cjs.formatRollingNumber(component.value, component.digits),
|
|
1331
1349
|
digits: component.digits,
|
|
1332
|
-
duration: Math.max(0,
|
|
1350
|
+
duration: Math.max(0, chunkUHKFJBY5_cjs.finite(component.duration, 420)),
|
|
1333
1351
|
label: component.label,
|
|
1334
|
-
componentStyle:
|
|
1352
|
+
componentStyle: chunkUHKFJBY5_cjs.resolveRollingNumberStyle(component.style)
|
|
1335
1353
|
}
|
|
1336
1354
|
];
|
|
1337
1355
|
}
|
|
1338
1356
|
function buildTickScale(component, index) {
|
|
1339
|
-
const x =
|
|
1340
|
-
const y =
|
|
1341
|
-
const width = Math.max(0,
|
|
1342
|
-
const height = Math.max(0,
|
|
1343
|
-
const rotation =
|
|
1344
|
-
const max =
|
|
1345
|
-
const progress = Math.min(1, Math.max(0,
|
|
1357
|
+
const x = chunkUHKFJBY5_cjs.finite(component.x, 0);
|
|
1358
|
+
const y = chunkUHKFJBY5_cjs.finite(component.y, 0);
|
|
1359
|
+
const width = Math.max(0, chunkUHKFJBY5_cjs.finite(component.width, 200));
|
|
1360
|
+
const height = Math.max(0, chunkUHKFJBY5_cjs.finite(component.height, 200));
|
|
1361
|
+
const rotation = chunkUHKFJBY5_cjs.finite(component.rotation, 0);
|
|
1362
|
+
const max = chunkUHKFJBY5_cjs.finite(component.max, 100) || 100;
|
|
1363
|
+
const progress = Math.min(1, Math.max(0, chunkUHKFJBY5_cjs.finite(Number(component.value), 0) / max));
|
|
1346
1364
|
const nodes = [
|
|
1347
1365
|
{
|
|
1348
1366
|
id: `widget-${component.id}`,
|
|
1349
1367
|
type: "shader-surface",
|
|
1350
1368
|
order: 1e4 + index,
|
|
1351
|
-
bounds:
|
|
1369
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1352
1370
|
x,
|
|
1353
1371
|
y,
|
|
1354
1372
|
width,
|
|
@@ -1365,12 +1383,12 @@ function buildTickScale(component, index) {
|
|
|
1365
1383
|
}
|
|
1366
1384
|
function buildTickLabels(component, box) {
|
|
1367
1385
|
const labels = component.labels ?? {};
|
|
1368
|
-
const ticks2 = Math.max(1,
|
|
1369
|
-
const major = Math.max(1,
|
|
1370
|
-
const start =
|
|
1371
|
-
const sweep =
|
|
1372
|
-
const radius =
|
|
1373
|
-
const fontSize =
|
|
1386
|
+
const ticks2 = Math.max(1, chunkUHKFJBY5_cjs.finite(Number(component.parameters.ticks), 48));
|
|
1387
|
+
const major = Math.max(1, chunkUHKFJBY5_cjs.finite(Number(component.parameters.major), 5));
|
|
1388
|
+
const start = chunkUHKFJBY5_cjs.finite(Number(component.parameters.start), 225) * Math.PI / 180;
|
|
1389
|
+
const sweep = chunkUHKFJBY5_cjs.finite(Number(component.parameters.sweep), 270) * Math.PI / 180;
|
|
1390
|
+
const radius = chunkUHKFJBY5_cjs.finite(Number(component.parameters.radius), 0.9) + chunkUHKFJBY5_cjs.finite(labels.offset, 0.08);
|
|
1391
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(labels.size, 12);
|
|
1374
1392
|
const centerX = box.x + box.width / 2;
|
|
1375
1393
|
const centerY = box.y + box.height / 2;
|
|
1376
1394
|
const count = Math.floor(ticks2 / major);
|
|
@@ -1385,10 +1403,10 @@ function buildTickLabels(component, box) {
|
|
|
1385
1403
|
id: `widget-${component.id}-label-${step}`,
|
|
1386
1404
|
type: "text",
|
|
1387
1405
|
order: box.order + 0.1,
|
|
1388
|
-
bounds:
|
|
1406
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1389
1407
|
...labelBox,
|
|
1390
1408
|
lines: [String(Math.round(box.max * fraction * 10) / 10)],
|
|
1391
|
-
fontFamily: labels.fontFamily ||
|
|
1409
|
+
fontFamily: labels.fontFamily || chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
1392
1410
|
fontSize,
|
|
1393
1411
|
fontWeight: labels.weight ?? "normal",
|
|
1394
1412
|
color: labels.color || "#8f95c4",
|
|
@@ -1400,20 +1418,20 @@ function buildTickLabels(component, box) {
|
|
|
1400
1418
|
return nodes;
|
|
1401
1419
|
}
|
|
1402
1420
|
function buildRuler(component, index) {
|
|
1403
|
-
const x =
|
|
1404
|
-
const y =
|
|
1405
|
-
const width = Math.max(0,
|
|
1406
|
-
const height = Math.max(0,
|
|
1407
|
-
const rotation =
|
|
1408
|
-
const min =
|
|
1409
|
-
const max =
|
|
1410
|
-
const progress = max === min ? 0 : Math.min(1, Math.max(0, (
|
|
1421
|
+
const x = chunkUHKFJBY5_cjs.finite(component.x, 0);
|
|
1422
|
+
const y = chunkUHKFJBY5_cjs.finite(component.y, 0);
|
|
1423
|
+
const width = Math.max(0, chunkUHKFJBY5_cjs.finite(component.width, 120));
|
|
1424
|
+
const height = Math.max(0, chunkUHKFJBY5_cjs.finite(component.height, 360));
|
|
1425
|
+
const rotation = chunkUHKFJBY5_cjs.finite(component.rotation, 0);
|
|
1426
|
+
const min = chunkUHKFJBY5_cjs.finite(component.min, 0);
|
|
1427
|
+
const max = chunkUHKFJBY5_cjs.finite(component.max, 100);
|
|
1428
|
+
const progress = max === min ? 0 : Math.min(1, Math.max(0, (chunkUHKFJBY5_cjs.finite(Number(component.value), min) - min) / (max - min)));
|
|
1411
1429
|
const nodes = [
|
|
1412
1430
|
{
|
|
1413
1431
|
id: `widget-${component.id}`,
|
|
1414
1432
|
type: "shader-surface",
|
|
1415
1433
|
order: 1e4 + index,
|
|
1416
|
-
bounds:
|
|
1434
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1417
1435
|
x,
|
|
1418
1436
|
y,
|
|
1419
1437
|
width,
|
|
@@ -1431,14 +1449,14 @@ function buildRuler(component, index) {
|
|
|
1431
1449
|
function buildRulerLabels(component, box) {
|
|
1432
1450
|
const labels = component.labels ?? {};
|
|
1433
1451
|
const horizontal = component.parameters.axis === "horizontal";
|
|
1434
|
-
const ticks2 = Math.max(1,
|
|
1435
|
-
const major = Math.max(1,
|
|
1436
|
-
const inset =
|
|
1437
|
-
const line =
|
|
1452
|
+
const ticks2 = Math.max(1, chunkUHKFJBY5_cjs.finite(Number(component.parameters.ticks), 50));
|
|
1453
|
+
const major = Math.max(1, chunkUHKFJBY5_cjs.finite(Number(component.parameters.major), 5));
|
|
1454
|
+
const inset = chunkUHKFJBY5_cjs.finite(Number(component.parameters.inset), 0.05) > 0 ? chunkUHKFJBY5_cjs.finite(Number(component.parameters.inset), 0.05) : 0.05;
|
|
1455
|
+
const line = chunkUHKFJBY5_cjs.finite(Number(component.parameters.line), 0.7) > 0 ? chunkUHKFJBY5_cjs.finite(Number(component.parameters.line), 0.7) : 0.7;
|
|
1438
1456
|
const across = horizontal ? box.height : box.width;
|
|
1439
|
-
const tickLength = (
|
|
1440
|
-
const edge = line * across - 0.12 * across - tickLength -
|
|
1441
|
-
const fontSize =
|
|
1457
|
+
const tickLength = (chunkUHKFJBY5_cjs.finite(Number(component.parameters.length), 0.1) > 0 ? chunkUHKFJBY5_cjs.finite(Number(component.parameters.length), 0.1) : 0.1) * across * 1.9;
|
|
1458
|
+
const edge = line * across - 0.12 * across - tickLength - chunkUHKFJBY5_cjs.finite(labels.offset, 0.04) * across;
|
|
1459
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(labels.size, 12);
|
|
1442
1460
|
const count = Math.floor(ticks2 / major);
|
|
1443
1461
|
const nodes = [];
|
|
1444
1462
|
for (let step = 0; step <= count; step += 1) {
|
|
@@ -1449,10 +1467,10 @@ function buildRulerLabels(component, box) {
|
|
|
1449
1467
|
id: `widget-${component.id}-label-${step}`,
|
|
1450
1468
|
type: "text",
|
|
1451
1469
|
order: box.order + 0.1,
|
|
1452
|
-
bounds:
|
|
1470
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1453
1471
|
...labelBox,
|
|
1454
1472
|
lines: [String(Math.round((box.min + (box.max - box.min) * fraction) * 10) / 10)],
|
|
1455
|
-
fontFamily: labels.fontFamily ||
|
|
1473
|
+
fontFamily: labels.fontFamily || chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
1456
1474
|
fontSize,
|
|
1457
1475
|
fontWeight: labels.weight ?? "normal",
|
|
1458
1476
|
color: labels.color || "#8f95c4",
|
|
@@ -1468,10 +1486,10 @@ function buildRulerLabels(component, box) {
|
|
|
1468
1486
|
var DISABLED_INK = "#94a3b8";
|
|
1469
1487
|
function controlBox(component, index, fallback) {
|
|
1470
1488
|
return {
|
|
1471
|
-
x:
|
|
1472
|
-
y:
|
|
1473
|
-
width: Math.max(1,
|
|
1474
|
-
height: Math.max(1,
|
|
1489
|
+
x: chunkUHKFJBY5_cjs.finite(component.x, 0),
|
|
1490
|
+
y: chunkUHKFJBY5_cjs.finite(component.y, 0),
|
|
1491
|
+
width: Math.max(1, chunkUHKFJBY5_cjs.finite(component.width, fallback.width)),
|
|
1492
|
+
height: Math.max(1, chunkUHKFJBY5_cjs.finite(component.height, fallback.height)),
|
|
1475
1493
|
order: 1e4 + index
|
|
1476
1494
|
};
|
|
1477
1495
|
}
|
|
@@ -1484,17 +1502,17 @@ function fade(component, style) {
|
|
|
1484
1502
|
const shown = component.disabled ? { ...style, opacity: 0.4 } : style;
|
|
1485
1503
|
return animate > 0 ? { ...shown, transition: animate } : shown;
|
|
1486
1504
|
}
|
|
1487
|
-
function hitArea(component, box) {
|
|
1505
|
+
function hitArea(component, box, takesClicks = true) {
|
|
1488
1506
|
return {
|
|
1489
1507
|
id: `widget-${component.id}`,
|
|
1490
1508
|
type: "rect",
|
|
1491
1509
|
order: box.order,
|
|
1492
|
-
bounds:
|
|
1510
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(box, 0, 0),
|
|
1493
1511
|
x: box.x,
|
|
1494
1512
|
y: box.y,
|
|
1495
1513
|
width: box.width,
|
|
1496
1514
|
height: box.height,
|
|
1497
|
-
style: { fill: { kind: "none" }, stroke: { kind: "none" }, pointerEvents: "all" }
|
|
1515
|
+
style: { fill: { kind: "none" }, stroke: { kind: "none" }, pointerEvents: takesClicks ? "all" : "none" }
|
|
1498
1516
|
};
|
|
1499
1517
|
}
|
|
1500
1518
|
function labelText(component, part, area, label, order) {
|
|
@@ -1502,13 +1520,13 @@ function labelText(component, part, area, label, order) {
|
|
|
1502
1520
|
id: `widget-${component.id}-${part}`,
|
|
1503
1521
|
type: "text",
|
|
1504
1522
|
order,
|
|
1505
|
-
bounds:
|
|
1523
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(area, 0, 0),
|
|
1506
1524
|
x: area.x,
|
|
1507
1525
|
y: area.y,
|
|
1508
1526
|
width: area.width,
|
|
1509
1527
|
height: area.height,
|
|
1510
1528
|
lines: [label.text],
|
|
1511
|
-
fontFamily:
|
|
1529
|
+
fontFamily: chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
1512
1530
|
fontSize: label.fontSize,
|
|
1513
1531
|
fontWeight: "600",
|
|
1514
1532
|
color: label.color,
|
|
@@ -1527,7 +1545,7 @@ function buildButton(component, index) {
|
|
|
1527
1545
|
id: `widget-${component.id}-face`,
|
|
1528
1546
|
type: "rect",
|
|
1529
1547
|
order: box.order + 0.1,
|
|
1530
|
-
bounds:
|
|
1548
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(box, 0, 0),
|
|
1531
1549
|
x: box.x,
|
|
1532
1550
|
y: box.y,
|
|
1533
1551
|
width: box.width,
|
|
@@ -1566,7 +1584,7 @@ function boxNode(component, box, square) {
|
|
|
1566
1584
|
id: `widget-${component.id}-box`,
|
|
1567
1585
|
type: "rect",
|
|
1568
1586
|
order: box.order + 0.1,
|
|
1569
|
-
bounds:
|
|
1587
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(square, 0, 2),
|
|
1570
1588
|
...square,
|
|
1571
1589
|
rx: square.width * CORNER_RATIO,
|
|
1572
1590
|
style: fade(component, {
|
|
@@ -1581,7 +1599,7 @@ function checkNode(component, box, square) {
|
|
|
1581
1599
|
id: `widget-${component.id}-check`,
|
|
1582
1600
|
type: "path",
|
|
1583
1601
|
order: box.order + 0.2,
|
|
1584
|
-
bounds:
|
|
1602
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(square, 0, 0),
|
|
1585
1603
|
d: checkPath(square),
|
|
1586
1604
|
style: fade(component, {
|
|
1587
1605
|
fill: { kind: "none" },
|
|
@@ -1615,6 +1633,268 @@ function buildCheckbox(component, index) {
|
|
|
1615
1633
|
];
|
|
1616
1634
|
}
|
|
1617
1635
|
|
|
1636
|
+
// src/renderScene/artifacts/component/hand.ts
|
|
1637
|
+
var MIN_TIP = 0.25;
|
|
1638
|
+
function withAlpha(color, alpha) {
|
|
1639
|
+
const rgb = chunkUHKFJBY5_cjs.parseHexRgb(color);
|
|
1640
|
+
return rgb && alpha < 1 ? `rgba(${rgb[0]}, ${rgb[1]}, ${rgb[2]}, ${Number(alpha.toFixed(3))})` : color;
|
|
1641
|
+
}
|
|
1642
|
+
var num = (value) => String(Number(value.toFixed(3)));
|
|
1643
|
+
var isOff = (component, key) => textProperty(component, key) === "none";
|
|
1644
|
+
var colorOr = (component, key, fallback) => isOff(component, key) ? fallback : textProperty(component, key) || fallback;
|
|
1645
|
+
function handOf(component, box) {
|
|
1646
|
+
const radius = Math.min(box.width, box.height) / 2;
|
|
1647
|
+
const root = Math.max(0.5, numberProperty2(component, "width"));
|
|
1648
|
+
const taper = Math.min(1, Math.max(0, numberProperty2(component, "taper")));
|
|
1649
|
+
return {
|
|
1650
|
+
cx: box.x + box.width / 2,
|
|
1651
|
+
cy: box.y + box.height / 2,
|
|
1652
|
+
radius,
|
|
1653
|
+
length: Math.max(1, numberProperty2(component, "length") * radius),
|
|
1654
|
+
tail: Math.max(0, numberProperty2(component, "tail") * radius),
|
|
1655
|
+
gap: Math.max(0, numberProperty2(component, "gap") * radius),
|
|
1656
|
+
rootHalf: root / 2,
|
|
1657
|
+
tipHalf: Math.max(MIN_TIP, root * taper / 2)
|
|
1658
|
+
};
|
|
1659
|
+
}
|
|
1660
|
+
function outline({ cx, cy, length, tail, gap, rootHalf, tipHalf }) {
|
|
1661
|
+
const root = gap > 0 ? cy - gap : cy;
|
|
1662
|
+
const back = gap > 0 ? 0 : tail;
|
|
1663
|
+
const tipLeft = `L${num(cx - tipHalf)} ${num(cy - length)}`;
|
|
1664
|
+
const tip = `A${num(tipHalf)} ${num(tipHalf)} 0 0 1 ${num(cx + tipHalf)} ${num(cy - length)}`;
|
|
1665
|
+
const round2 = `A${num(rootHalf)} ${num(rootHalf)} 0 0 1 ${num(cx - rootHalf)} ${num(root + back)}`;
|
|
1666
|
+
if (gap > 0) {
|
|
1667
|
+
return `M${num(cx - rootHalf)} ${num(root)}${tipLeft}${tip}L${num(cx + rootHalf)} ${num(root)}${round2}Z`;
|
|
1668
|
+
}
|
|
1669
|
+
return [
|
|
1670
|
+
`M${num(cx - rootHalf)} ${num(root + back)}`,
|
|
1671
|
+
`L${num(cx - rootHalf)} ${num(root)}`,
|
|
1672
|
+
tipLeft,
|
|
1673
|
+
tip,
|
|
1674
|
+
`L${num(cx + rootHalf)} ${num(root)}`,
|
|
1675
|
+
`L${num(cx + rootHalf)} ${num(root + back)}`,
|
|
1676
|
+
back > 0 ? round2 : `L${num(cx - rootHalf)} ${num(root)}`,
|
|
1677
|
+
"Z"
|
|
1678
|
+
].join("");
|
|
1679
|
+
}
|
|
1680
|
+
function shaped(hand, layer) {
|
|
1681
|
+
const rootHalf = hand.rootHalf * layer.scale;
|
|
1682
|
+
const tipHalf = layer.taper === void 0 ? hand.tipHalf * layer.scale : rootHalf * layer.taper;
|
|
1683
|
+
return { ...hand, length: hand.length * (layer.length ?? 1), rootHalf, tipHalf: Math.max(MIN_TIP, tipHalf) };
|
|
1684
|
+
}
|
|
1685
|
+
function stopsPaint(hand, stops, fadeOut, clear) {
|
|
1686
|
+
const tail = hand.gap > 0 ? 0 : hand.tail;
|
|
1687
|
+
const offset = (along2) => (tail + along2 * hand.length) / (hand.length + tail) * 100;
|
|
1688
|
+
const [, firstColor, firstAlpha] = stops[0];
|
|
1689
|
+
return {
|
|
1690
|
+
kind: "linear-gradient",
|
|
1691
|
+
angle: -90,
|
|
1692
|
+
stops: [
|
|
1693
|
+
...tail > 0 ? [{ offset: 0, color: withAlpha(firstColor, firstAlpha * (clear ? 0 : 1 - fadeOut)) }] : [],
|
|
1694
|
+
...stops.map(([along2, color, alpha], position) => ({
|
|
1695
|
+
offset: offset(along2),
|
|
1696
|
+
color: withAlpha(color, clear && position === 0 ? 0 : alpha)
|
|
1697
|
+
}))
|
|
1698
|
+
]
|
|
1699
|
+
};
|
|
1700
|
+
}
|
|
1701
|
+
function plainPaint(hand, layer, fadeOut, tipFade) {
|
|
1702
|
+
if (fadeOut <= 0 && tipFade <= 0 && !layer.clear) {
|
|
1703
|
+
return solid(layer.color);
|
|
1704
|
+
}
|
|
1705
|
+
return {
|
|
1706
|
+
kind: "linear-gradient",
|
|
1707
|
+
angle: -90,
|
|
1708
|
+
stops: [
|
|
1709
|
+
{ offset: 0, color: withAlpha(layer.root, layer.clear ? 0 : 1 - fadeOut) },
|
|
1710
|
+
// A tail is lit at the pivot and dissolves at its end.
|
|
1711
|
+
...hand.gap === 0 && hand.tail > 0 ? [{ offset: hand.tail / (hand.length + hand.tail) * 100, color: layer.root }] : [],
|
|
1712
|
+
{ offset: 100, color: withAlpha(layer.color, 1 - tipFade) }
|
|
1713
|
+
]
|
|
1714
|
+
};
|
|
1715
|
+
}
|
|
1716
|
+
function handLayer(component, box, base, angle, layer, order) {
|
|
1717
|
+
const hand = shaped(base, layer);
|
|
1718
|
+
const fadeOut = Math.min(1, Math.max(0, numberProperty2(component, "fade")));
|
|
1719
|
+
const tipFade = Math.min(1, Math.max(0, layer.tipFade ?? numberProperty2(component, "tipFade")));
|
|
1720
|
+
const glow = numberProperty2(component, "glow");
|
|
1721
|
+
const soft = layer.blur > 0;
|
|
1722
|
+
const reach = Math.max(hand.rootHalf, hand.tipHalf);
|
|
1723
|
+
const near = hand.gap > 0 ? -hand.gap : hand.tail;
|
|
1724
|
+
const extent = { x: hand.cx - reach, y: hand.cy - hand.length, width: reach * 2, height: hand.length + near };
|
|
1725
|
+
return {
|
|
1726
|
+
id: `widget-${component.id}-${layer.part}`,
|
|
1727
|
+
type: "path",
|
|
1728
|
+
order: box.order + order,
|
|
1729
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(extent, 0, 0),
|
|
1730
|
+
d: outline(hand),
|
|
1731
|
+
rotation: angle,
|
|
1732
|
+
rotationCenter: { x: hand.cx, y: hand.cy },
|
|
1733
|
+
style: fade(component, {
|
|
1734
|
+
// The gradient runs from the tail to the tip, and turns with the hand.
|
|
1735
|
+
fill: layer.stops ? stopsPaint(hand, layer.stops, fadeOut, Boolean(layer.clear)) : plainPaint(hand, layer, fadeOut, tipFade),
|
|
1736
|
+
stroke: { kind: "none" },
|
|
1737
|
+
...soft ? { blur: layer.blur, opacity: layer.opacity } : {},
|
|
1738
|
+
...!soft && glow > 0 && !isOff(component, "glowColor") ? {
|
|
1739
|
+
shadow: {
|
|
1740
|
+
color: colorOr(component, "glowColor", layer.color),
|
|
1741
|
+
opacity: 1,
|
|
1742
|
+
blur: glow,
|
|
1743
|
+
dx: 0,
|
|
1744
|
+
dy: 0
|
|
1745
|
+
}
|
|
1746
|
+
} : {}
|
|
1747
|
+
})
|
|
1748
|
+
};
|
|
1749
|
+
}
|
|
1750
|
+
function trailLayers(color, root, light, soft, clear, lit) {
|
|
1751
|
+
const trail = [
|
|
1752
|
+
{
|
|
1753
|
+
part: "hand-light",
|
|
1754
|
+
scale: 4.5,
|
|
1755
|
+
length: 0.55,
|
|
1756
|
+
taper: 0.15,
|
|
1757
|
+
blur: soft * 3,
|
|
1758
|
+
opacity: 1,
|
|
1759
|
+
color: light,
|
|
1760
|
+
root: light,
|
|
1761
|
+
stops: [
|
|
1762
|
+
[0, light, 0.95],
|
|
1763
|
+
[0.35, light, 0.45],
|
|
1764
|
+
[1, light, 0]
|
|
1765
|
+
]
|
|
1766
|
+
},
|
|
1767
|
+
{
|
|
1768
|
+
part: "hand-body",
|
|
1769
|
+
scale: 1.6,
|
|
1770
|
+
taper: 0.25,
|
|
1771
|
+
blur: soft,
|
|
1772
|
+
opacity: 1,
|
|
1773
|
+
color,
|
|
1774
|
+
root,
|
|
1775
|
+
clear,
|
|
1776
|
+
stops: [
|
|
1777
|
+
[0, root, 1],
|
|
1778
|
+
[0.18, color, 1],
|
|
1779
|
+
[0.6, color, 0.55],
|
|
1780
|
+
[1, color, 0]
|
|
1781
|
+
]
|
|
1782
|
+
},
|
|
1783
|
+
{
|
|
1784
|
+
part: "hand",
|
|
1785
|
+
scale: 0.55,
|
|
1786
|
+
length: 0.8,
|
|
1787
|
+
taper: 0.3,
|
|
1788
|
+
blur: soft * 0.3,
|
|
1789
|
+
opacity: 1,
|
|
1790
|
+
color: root,
|
|
1791
|
+
root,
|
|
1792
|
+
clear,
|
|
1793
|
+
stops: [
|
|
1794
|
+
[0, root, 1],
|
|
1795
|
+
[0.45, root, 0.6],
|
|
1796
|
+
[1, root, 0]
|
|
1797
|
+
]
|
|
1798
|
+
}
|
|
1799
|
+
];
|
|
1800
|
+
return lit ? trail : trail.slice(1);
|
|
1801
|
+
}
|
|
1802
|
+
function handLayers(component, box, hand, angle) {
|
|
1803
|
+
const color = textProperty(component, "color");
|
|
1804
|
+
const root = colorOr(component, "root", color);
|
|
1805
|
+
const light = colorOr(component, "glowColor", color);
|
|
1806
|
+
const lit = !isOff(component, "glowColor");
|
|
1807
|
+
const clear = isOff(component, "root");
|
|
1808
|
+
const soft = numberProperty2(component, "soft");
|
|
1809
|
+
const bloom = numberProperty2(component, "bloom");
|
|
1810
|
+
if (soft > 0) {
|
|
1811
|
+
return trailLayers(color, root, light, soft, clear, lit).map(
|
|
1812
|
+
(layer, position) => handLayer(component, box, hand, angle, layer, 0.26 + position * 0.02)
|
|
1813
|
+
);
|
|
1814
|
+
}
|
|
1815
|
+
return [
|
|
1816
|
+
// A blurred light under the hand, bright at the pivot and dark at the tip.
|
|
1817
|
+
...bloom > 0 && lit ? [
|
|
1818
|
+
handLayer(
|
|
1819
|
+
component,
|
|
1820
|
+
box,
|
|
1821
|
+
hand,
|
|
1822
|
+
angle,
|
|
1823
|
+
{ part: "hand-bloom", scale: 4, blur: bloom, opacity: 0.9, color: light, root: light, tipFade: 1 },
|
|
1824
|
+
0.26
|
|
1825
|
+
)
|
|
1826
|
+
] : [],
|
|
1827
|
+
handLayer(component, box, hand, angle, { part: "hand", scale: 1, blur: 0, opacity: 1, color, root, clear }, 0.3)
|
|
1828
|
+
];
|
|
1829
|
+
}
|
|
1830
|
+
function hubNode(component, box, hand, radius) {
|
|
1831
|
+
const ringWidth = numberProperty2(component, "hubRing");
|
|
1832
|
+
return {
|
|
1833
|
+
id: `widget-${component.id}-hub`,
|
|
1834
|
+
type: "ellipse",
|
|
1835
|
+
order: box.order + 0.4,
|
|
1836
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(
|
|
1837
|
+
{ x: hand.cx - radius, y: hand.cy - radius, width: radius * 2, height: radius * 2 },
|
|
1838
|
+
0,
|
|
1839
|
+
ringWidth
|
|
1840
|
+
),
|
|
1841
|
+
cx: hand.cx,
|
|
1842
|
+
cy: hand.cy,
|
|
1843
|
+
rx: Math.max(0.5, radius - ringWidth / 2),
|
|
1844
|
+
ry: Math.max(0.5, radius - ringWidth / 2),
|
|
1845
|
+
style: fade(component, {
|
|
1846
|
+
fill: isOff(component, "hubFill") ? { kind: "none" } : solid(textProperty(component, "hubFill")),
|
|
1847
|
+
stroke: ringWidth > 0 ? solid(textProperty(component, "color")) : { kind: "none" },
|
|
1848
|
+
strokeWidth: ringWidth,
|
|
1849
|
+
...numberProperty2(component, "glow") > 0 && !isOff(component, "glowColor") ? {
|
|
1850
|
+
shadow: {
|
|
1851
|
+
color: colorOr(component, "glowColor", textProperty(component, "color")),
|
|
1852
|
+
opacity: 1,
|
|
1853
|
+
blur: numberProperty2(component, "glow"),
|
|
1854
|
+
dx: 0,
|
|
1855
|
+
dy: 0
|
|
1856
|
+
}
|
|
1857
|
+
} : {}
|
|
1858
|
+
})
|
|
1859
|
+
};
|
|
1860
|
+
}
|
|
1861
|
+
var HIT_HALF = 8;
|
|
1862
|
+
function pickNodes(component, box, hand, angle) {
|
|
1863
|
+
const reach = { ...hand, rootHalf: Math.max(hand.rootHalf, HIT_HALF), tipHalf: Math.max(hand.tipHalf, HIT_HALF) };
|
|
1864
|
+
const near = reach.gap > 0 ? -reach.gap : reach.tail;
|
|
1865
|
+
const extent = {
|
|
1866
|
+
x: reach.cx - HIT_HALF,
|
|
1867
|
+
y: reach.cy - reach.length,
|
|
1868
|
+
width: HIT_HALF * 2,
|
|
1869
|
+
height: reach.length + near
|
|
1870
|
+
};
|
|
1871
|
+
return [
|
|
1872
|
+
hitArea(component, box, false),
|
|
1873
|
+
{
|
|
1874
|
+
id: `widget-${component.id}-pick`,
|
|
1875
|
+
type: "path",
|
|
1876
|
+
order: box.order + 0.5,
|
|
1877
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(extent, 0, 0),
|
|
1878
|
+
d: outline(reach),
|
|
1879
|
+
rotation: angle,
|
|
1880
|
+
rotationCenter: { x: reach.cx, y: reach.cy },
|
|
1881
|
+
style: { fill: { kind: "none" }, stroke: { kind: "none" }, pointerEvents: "all" }
|
|
1882
|
+
}
|
|
1883
|
+
];
|
|
1884
|
+
}
|
|
1885
|
+
function buildHand(component, index) {
|
|
1886
|
+
const box = controlBox(component, index, { width: 200, height: 200 });
|
|
1887
|
+
const hand = handOf(component, box);
|
|
1888
|
+
const max = numberProperty2(component, "max") || 1;
|
|
1889
|
+
const angle = numberProperty2(component, "start") + Number(component.value) / max * 360;
|
|
1890
|
+
const hub = numberProperty2(component, "hub");
|
|
1891
|
+
return [
|
|
1892
|
+
...pickNodes(component, box, hand, angle),
|
|
1893
|
+
...handLayers(component, box, hand, angle),
|
|
1894
|
+
...hub > 0 ? [hubNode(component, box, hand, hub)] : []
|
|
1895
|
+
];
|
|
1896
|
+
}
|
|
1897
|
+
|
|
1618
1898
|
// src/renderScene/artifacts/component/knob.ts
|
|
1619
1899
|
var DOT_RATIO = 0.62;
|
|
1620
1900
|
function decimals(step) {
|
|
@@ -1650,7 +1930,7 @@ function arcNode(component, box, dial, part, order, color, length, extra = {}) {
|
|
|
1650
1930
|
id: `widget-${component.id}-${part}`,
|
|
1651
1931
|
type: "ellipse",
|
|
1652
1932
|
order: box.order + order,
|
|
1653
|
-
bounds:
|
|
1933
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
1654
1934
|
cx,
|
|
1655
1935
|
cy,
|
|
1656
1936
|
rx: radius,
|
|
@@ -1671,7 +1951,7 @@ function discNode(component, box, part, order, center, radius, fill2) {
|
|
|
1671
1951
|
id: `widget-${component.id}-${part}`,
|
|
1672
1952
|
type: "ellipse",
|
|
1673
1953
|
order: box.order + order,
|
|
1674
|
-
bounds:
|
|
1954
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x: center.x - radius, y: center.y - radius, width: radius * 2, height: radius * 2 }, 0, 0),
|
|
1675
1955
|
cx: center.x,
|
|
1676
1956
|
cy: center.y,
|
|
1677
1957
|
rx: radius,
|
|
@@ -1751,7 +2031,7 @@ function buildRing(component, box, fraction, round2) {
|
|
|
1751
2031
|
id: `widget-${component.id}-${part}`,
|
|
1752
2032
|
type: "ellipse",
|
|
1753
2033
|
order: box.order + order,
|
|
1754
|
-
bounds:
|
|
2034
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
1755
2035
|
cx,
|
|
1756
2036
|
cy,
|
|
1757
2037
|
rx: radius,
|
|
@@ -1777,7 +2057,7 @@ function buildBar(component, box, fraction, round2) {
|
|
|
1777
2057
|
id: `widget-${component.id}-${part}`,
|
|
1778
2058
|
type: "rect",
|
|
1779
2059
|
order: box.order + order,
|
|
1780
|
-
bounds:
|
|
2060
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(shape, 0, 0),
|
|
1781
2061
|
...shape,
|
|
1782
2062
|
rx: radius,
|
|
1783
2063
|
style: fade(component, {
|
|
@@ -1832,7 +2112,7 @@ function buildSegmented(component, index) {
|
|
|
1832
2112
|
id: `widget-${component.id}-track`,
|
|
1833
2113
|
type: "rect",
|
|
1834
2114
|
order: box.order + 0.1,
|
|
1835
|
-
bounds:
|
|
2115
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(box, 0, 0),
|
|
1836
2116
|
x: box.x,
|
|
1837
2117
|
y: box.y,
|
|
1838
2118
|
width: box.width,
|
|
@@ -1844,7 +2124,7 @@ function buildSegmented(component, index) {
|
|
|
1844
2124
|
id: `widget-${component.id}-active`,
|
|
1845
2125
|
type: "rect",
|
|
1846
2126
|
order: box.order + 0.2,
|
|
1847
|
-
bounds:
|
|
2127
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x: box.x + inset + active * cellWidth, width: cellWidth, ...cell }, 0, 0),
|
|
1848
2128
|
x: box.x + inset + active * cellWidth,
|
|
1849
2129
|
y: cell.y,
|
|
1850
2130
|
width: cellWidth,
|
|
@@ -1896,7 +2176,7 @@ var rect = (component, box, part, order, shape, color, extra = {}) => ({
|
|
|
1896
2176
|
id: `widget-${component.id}-${part}`,
|
|
1897
2177
|
type: "rect",
|
|
1898
2178
|
order: box.order + order,
|
|
1899
|
-
bounds:
|
|
2179
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(shape, 0, 0),
|
|
1900
2180
|
...shape,
|
|
1901
2181
|
style: fade(component, { fill: solid(color), stroke: { kind: "none" }, ...extra })
|
|
1902
2182
|
});
|
|
@@ -1952,7 +2232,7 @@ function buildLine(component, box, thumbs, vertical) {
|
|
|
1952
2232
|
id: `widget-${component.id}-${part}`,
|
|
1953
2233
|
type: "ellipse",
|
|
1954
2234
|
order: box.order + order,
|
|
1955
|
-
bounds:
|
|
2235
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, 0),
|
|
1956
2236
|
cx,
|
|
1957
2237
|
cy,
|
|
1958
2238
|
rx: radius,
|
|
@@ -2114,7 +2394,7 @@ function buildSwitch(component, index) {
|
|
|
2114
2394
|
id: `widget-${component.id}-track`,
|
|
2115
2395
|
type: "rect",
|
|
2116
2396
|
order: box.order + 0.1,
|
|
2117
|
-
bounds:
|
|
2397
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(box, 0, 0),
|
|
2118
2398
|
x: box.x,
|
|
2119
2399
|
y: box.y,
|
|
2120
2400
|
width: box.width,
|
|
@@ -2129,7 +2409,7 @@ function buildSwitch(component, index) {
|
|
|
2129
2409
|
id: `widget-${component.id}-thumb`,
|
|
2130
2410
|
type: "ellipse",
|
|
2131
2411
|
order: box.order + 0.2,
|
|
2132
|
-
bounds:
|
|
2412
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(thumb, 0, 0),
|
|
2133
2413
|
cx: centerX,
|
|
2134
2414
|
cy: box.y + box.height / 2,
|
|
2135
2415
|
rx: radius,
|
|
@@ -2153,7 +2433,7 @@ function buildToggleButton(component, index) {
|
|
|
2153
2433
|
id: `widget-${component.id}-face`,
|
|
2154
2434
|
type: "rect",
|
|
2155
2435
|
order: box.order + 0.1,
|
|
2156
|
-
bounds:
|
|
2436
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(box, 0, 2),
|
|
2157
2437
|
x: box.x,
|
|
2158
2438
|
y: box.y,
|
|
2159
2439
|
width: box.width,
|
|
@@ -2192,6 +2472,7 @@ var builders = /* @__PURE__ */ new Map([
|
|
|
2192
2472
|
["progress", asComponentBuilder(buildProgress)],
|
|
2193
2473
|
["segmented", asComponentBuilder(buildSegmented)],
|
|
2194
2474
|
["knob", asComponentBuilder(buildKnob)],
|
|
2475
|
+
["hand", asComponentBuilder(buildHand)],
|
|
2195
2476
|
["range", asComponentBuilder(buildSlider)]
|
|
2196
2477
|
]);
|
|
2197
2478
|
function registerComponentBuilder(type, builder) {
|
|
@@ -2208,8 +2489,8 @@ function getComponentBuilder(type) {
|
|
|
2208
2489
|
|
|
2209
2490
|
// src/renderScene/artifacts/component/build.ts
|
|
2210
2491
|
function ariaOf(component) {
|
|
2211
|
-
const role =
|
|
2212
|
-
if (!role || !
|
|
2492
|
+
const role = chunkUHKFJBY5_cjs.getComponentDescriptor(component.type)?.role;
|
|
2493
|
+
if (!role || !chunkUHKFJBY5_cjs.isGenericComponent(component)) {
|
|
2213
2494
|
return void 0;
|
|
2214
2495
|
}
|
|
2215
2496
|
const flag = typeof component.value === "boolean" ? component.value : void 0;
|
|
@@ -2220,12 +2501,12 @@ function ariaOf(component) {
|
|
|
2220
2501
|
};
|
|
2221
2502
|
}
|
|
2222
2503
|
function labelOf(component) {
|
|
2223
|
-
return component.label ?? (
|
|
2504
|
+
return component.label ?? (chunkUHKFJBY5_cjs.isGenericComponent(component) ? component.id : String(component.value));
|
|
2224
2505
|
}
|
|
2225
2506
|
function buildComponents(components) {
|
|
2226
2507
|
return components.flatMap((component, index) => {
|
|
2227
2508
|
const build = getComponentBuilder(component.type) ?? buildPlaceholder;
|
|
2228
|
-
const nodes =
|
|
2509
|
+
const nodes = chunkUHKFJBY5_cjs.tag(
|
|
2229
2510
|
build(component, index),
|
|
2230
2511
|
"widget",
|
|
2231
2512
|
component.id,
|
|
@@ -2265,13 +2546,13 @@ function tabBox(input, thickness, length) {
|
|
|
2265
2546
|
y,
|
|
2266
2547
|
width: length,
|
|
2267
2548
|
height: thickness,
|
|
2268
|
-
path:
|
|
2549
|
+
path: chunkUHKFJBY5_cjs.bottomRoundedRectPath(x, y, length, thickness, TAB_RADIUS)
|
|
2269
2550
|
};
|
|
2270
2551
|
}
|
|
2271
2552
|
case "left": {
|
|
2272
2553
|
const x = input.x - thickness;
|
|
2273
2554
|
const y = input.y - inset;
|
|
2274
|
-
return { x, y, width: thickness, height: length, path:
|
|
2555
|
+
return { x, y, width: thickness, height: length, path: chunkUHKFJBY5_cjs.leftRoundedRectPath(x, y, thickness, length, TAB_RADIUS) };
|
|
2275
2556
|
}
|
|
2276
2557
|
case "right": {
|
|
2277
2558
|
const x = input.x + input.width;
|
|
@@ -2281,13 +2562,13 @@ function tabBox(input, thickness, length) {
|
|
|
2281
2562
|
y,
|
|
2282
2563
|
width: thickness,
|
|
2283
2564
|
height: length,
|
|
2284
|
-
path:
|
|
2565
|
+
path: chunkUHKFJBY5_cjs.rightRoundedRectPath(x, y, thickness, length, TAB_RADIUS)
|
|
2285
2566
|
};
|
|
2286
2567
|
}
|
|
2287
2568
|
default: {
|
|
2288
2569
|
const x = input.x - inset;
|
|
2289
2570
|
const y = input.y - thickness;
|
|
2290
|
-
return { x, y, width: length, height: thickness, path:
|
|
2571
|
+
return { x, y, width: length, height: thickness, path: chunkUHKFJBY5_cjs.topRoundedRectPath(x, y, length, thickness, TAB_RADIUS) };
|
|
2291
2572
|
}
|
|
2292
2573
|
}
|
|
2293
2574
|
}
|
|
@@ -2296,7 +2577,7 @@ function renderTitleTab(input) {
|
|
|
2296
2577
|
const padding = 16;
|
|
2297
2578
|
const length = Math.max(120, input.title.length * input.fontSize * 0.62 + padding * 2);
|
|
2298
2579
|
const box = tabBox(input, thickness, length);
|
|
2299
|
-
const bounds =
|
|
2580
|
+
const bounds = chunkUHKFJBY5_cjs.boxBounds(box, 6);
|
|
2300
2581
|
const vertical = input.labelPosition === "left" || input.labelPosition === "right";
|
|
2301
2582
|
return [
|
|
2302
2583
|
{
|
|
@@ -2324,7 +2605,7 @@ function horizontalTitleText(input, box, padding, bounds) {
|
|
|
2324
2605
|
width: Math.max(0, box.width - padding * 2),
|
|
2325
2606
|
height: box.height,
|
|
2326
2607
|
lines: [input.title],
|
|
2327
|
-
fontFamily: input.fontFamily ??
|
|
2608
|
+
fontFamily: input.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
2328
2609
|
fontSize: input.fontSize,
|
|
2329
2610
|
fontWeight: input.fontWeight,
|
|
2330
2611
|
color: input.textColor,
|
|
@@ -2348,7 +2629,7 @@ function verticalTitleText(input, box, padding, bounds) {
|
|
|
2348
2629
|
width: textLength,
|
|
2349
2630
|
height: textThickness,
|
|
2350
2631
|
lines: [input.title],
|
|
2351
|
-
fontFamily: input.fontFamily ??
|
|
2632
|
+
fontFamily: input.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
2352
2633
|
fontSize: input.fontSize,
|
|
2353
2634
|
fontWeight: input.fontWeight,
|
|
2354
2635
|
color: input.textColor,
|
|
@@ -2369,7 +2650,7 @@ var SQUARED_CORNER_BY_LABEL_POSITION = {
|
|
|
2369
2650
|
};
|
|
2370
2651
|
function frameBoundaryNode(frame, order, hasTab) {
|
|
2371
2652
|
const shadow = frame.shadow ?? true;
|
|
2372
|
-
const bounds =
|
|
2653
|
+
const bounds = chunkUHKFJBY5_cjs.boxBounds(
|
|
2373
2654
|
{ x: frame.x, y: frame.y, width: frame.width, height: frame.height },
|
|
2374
2655
|
frame.strokeWidth + (shadow ? 20 : 4)
|
|
2375
2656
|
);
|
|
@@ -2404,7 +2685,7 @@ function frameBoundaryNode(frame, order, hasTab) {
|
|
|
2404
2685
|
id: `frame-${frame.id}`,
|
|
2405
2686
|
order,
|
|
2406
2687
|
bounds,
|
|
2407
|
-
d:
|
|
2688
|
+
d: chunkUHKFJBY5_cjs.cornersRoundedRectPath(frame.x, frame.y, frame.width, frame.height, radii),
|
|
2408
2689
|
detail: { of: "frameBoundary", cornerRadius: frame.cornerRadius, squareCorner: squared },
|
|
2409
2690
|
style
|
|
2410
2691
|
};
|
|
@@ -2493,7 +2774,7 @@ function labelBase(context, lane, index) {
|
|
|
2493
2774
|
id: `swimlane-label-${context.swimlane.id}-${lane.id}`,
|
|
2494
2775
|
order: context.order + 0.5 + index / 100,
|
|
2495
2776
|
lines: [lane.label],
|
|
2496
|
-
fontFamily: context.swimlane.fontFamily ??
|
|
2777
|
+
fontFamily: context.swimlane.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
2497
2778
|
fontSize: context.swimlane.fontSize,
|
|
2498
2779
|
fontWeight: context.swimlane.fontWeight,
|
|
2499
2780
|
color: context.swimlane.textColor,
|
|
@@ -2509,7 +2790,7 @@ function horizontalLabel(context, lane, index) {
|
|
|
2509
2790
|
const y = centerY - thickness / 2;
|
|
2510
2791
|
return {
|
|
2511
2792
|
...labelBase(context, lane, index),
|
|
2512
|
-
bounds:
|
|
2793
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x, y, width, height: thickness }, -90, 12),
|
|
2513
2794
|
x,
|
|
2514
2795
|
y,
|
|
2515
2796
|
width,
|
|
@@ -2561,7 +2842,7 @@ function createSwimlaneRenderContext(swimlane, index) {
|
|
|
2561
2842
|
return {
|
|
2562
2843
|
swimlane,
|
|
2563
2844
|
order: 5e3 + index,
|
|
2564
|
-
bounds:
|
|
2845
|
+
bounds: chunkUHKFJBY5_cjs.boxBounds(
|
|
2565
2846
|
{ x: swimlane.x, y: swimlane.y, width: swimlane.width, height: swimlane.height },
|
|
2566
2847
|
swimlane.strokeWidth + 4
|
|
2567
2848
|
),
|
|
@@ -2600,9 +2881,9 @@ function buildSwimlane(swimlane, index) {
|
|
|
2600
2881
|
function buildContainers(input) {
|
|
2601
2882
|
return [
|
|
2602
2883
|
...input.frames.flatMap(
|
|
2603
|
-
(frame, index) =>
|
|
2884
|
+
(frame, index) => chunkUHKFJBY5_cjs.tag(buildFrame(frame, index), "frame", frame.id, void 0, frame.title ?? void 0)
|
|
2604
2885
|
),
|
|
2605
|
-
...input.swimlanes.flatMap((swimlane, index) =>
|
|
2886
|
+
...input.swimlanes.flatMap((swimlane, index) => chunkUHKFJBY5_cjs.tag(buildSwimlane(swimlane, index), "swimlane", swimlane.id))
|
|
2606
2887
|
];
|
|
2607
2888
|
}
|
|
2608
2889
|
|
|
@@ -2652,7 +2933,7 @@ var DEFAULT_COLOR = "#475569";
|
|
|
2652
2933
|
var CHAR_WIDTH = 0.6;
|
|
2653
2934
|
var pathData = (segments) => segments.map(([from, to]) => `M ${from.x} ${from.y} L ${to.x} ${to.y}`).join(" ");
|
|
2654
2935
|
function pathNode(dimension, name, order, segments) {
|
|
2655
|
-
const strokeWidth = Math.max(0,
|
|
2936
|
+
const strokeWidth = Math.max(0, chunkUHKFJBY5_cjs.finite(dimension.strokeWidth, 1));
|
|
2656
2937
|
const points = segments.flat();
|
|
2657
2938
|
return {
|
|
2658
2939
|
type: "path",
|
|
@@ -2674,7 +2955,7 @@ function pathNode(dimension, name, order, segments) {
|
|
|
2674
2955
|
};
|
|
2675
2956
|
}
|
|
2676
2957
|
function labelNode2(dimension, order, text, center, angle) {
|
|
2677
|
-
const fontSize =
|
|
2958
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(dimension.fontSize, 11);
|
|
2678
2959
|
const width = Math.max(24, text.length * fontSize * CHAR_WIDTH + 8);
|
|
2679
2960
|
const height = fontSize * 1.3;
|
|
2680
2961
|
return {
|
|
@@ -2692,7 +2973,7 @@ function labelNode2(dimension, order, text, center, angle) {
|
|
|
2692
2973
|
width,
|
|
2693
2974
|
height,
|
|
2694
2975
|
lines: [text],
|
|
2695
|
-
fontFamily:
|
|
2976
|
+
fontFamily: chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
2696
2977
|
fontSize,
|
|
2697
2978
|
fontWeight: "normal",
|
|
2698
2979
|
color: dimension.textColor ?? dimension.strokeColor ?? DEFAULT_COLOR,
|
|
@@ -2717,7 +2998,7 @@ function buildDimension(dimension, index) {
|
|
|
2717
2998
|
}
|
|
2718
2999
|
function buildDimensions(dimensions) {
|
|
2719
3000
|
return dimensions.flatMap(
|
|
2720
|
-
(dimension, index) =>
|
|
3001
|
+
(dimension, index) => chunkUHKFJBY5_cjs.tag(
|
|
2721
3002
|
buildDimension(dimension, index),
|
|
2722
3003
|
"dimension",
|
|
2723
3004
|
dimension.id,
|
|
@@ -2731,9 +3012,9 @@ function buildDimensions(dimensions) {
|
|
|
2731
3012
|
// src/renderScene/artifacts/isometric/context.ts
|
|
2732
3013
|
var FILL_PROP = { prop: "style.fill", propKind: "color", propSolidOnly: true };
|
|
2733
3014
|
function isometricContext(object, index) {
|
|
2734
|
-
const strokeWidth = Math.max(0,
|
|
2735
|
-
const rotation =
|
|
2736
|
-
const box =
|
|
3015
|
+
const strokeWidth = Math.max(0, chunkUHKFJBY5_cjs.finite(object.strokeWidth, 1));
|
|
3016
|
+
const rotation = chunkUHKFJBY5_cjs.finite(object.rotation, 0);
|
|
3017
|
+
const box = chunkUHKFJBY5_cjs.isometricBounds(object);
|
|
2737
3018
|
const rotationCenter = { x: box.x + box.width / 2, y: box.y + box.height / 2 };
|
|
2738
3019
|
return {
|
|
2739
3020
|
object,
|
|
@@ -2745,7 +3026,7 @@ function isometricContext(object, index) {
|
|
|
2745
3026
|
strokeWidth,
|
|
2746
3027
|
common: {
|
|
2747
3028
|
type: "path",
|
|
2748
|
-
bounds:
|
|
3029
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(box, rotation, strokeWidth + 2),
|
|
2749
3030
|
rotation,
|
|
2750
3031
|
rotationCenter,
|
|
2751
3032
|
style: {
|
|
@@ -2761,13 +3042,13 @@ function faceNode(context, name, offset, points, style) {
|
|
|
2761
3042
|
...context.common,
|
|
2762
3043
|
id: `isometric-${context.object.id}-${name}`,
|
|
2763
3044
|
order: context.order + offset,
|
|
2764
|
-
d:
|
|
3045
|
+
d: chunkUHKFJBY5_cjs.roundedPolygonPath([...points], 0),
|
|
2765
3046
|
style,
|
|
2766
3047
|
...FILL_PROP
|
|
2767
3048
|
};
|
|
2768
3049
|
}
|
|
2769
3050
|
function silhouette(object) {
|
|
2770
|
-
const faces =
|
|
3051
|
+
const faces = chunkUHKFJBY5_cjs.isometricFaces(object);
|
|
2771
3052
|
return [faces.top[0], faces.top[1], faces.right[2], faces.front[2], faces.front[3], faces.top[3]];
|
|
2772
3053
|
}
|
|
2773
3054
|
function hullNode(context, hullPath, cornerRadius) {
|
|
@@ -2784,15 +3065,15 @@ function hullNode(context, hullPath, cornerRadius) {
|
|
|
2784
3065
|
depth: Math.max(0, object.depth),
|
|
2785
3066
|
cornerRadius,
|
|
2786
3067
|
bounds: box,
|
|
2787
|
-
labelOffsetX:
|
|
2788
|
-
labelOffsetY:
|
|
3068
|
+
labelOffsetX: chunkUHKFJBY5_cjs.finite(object.labelOffsetX, 0),
|
|
3069
|
+
labelOffsetY: chunkUHKFJBY5_cjs.finite(object.labelOffsetY, 0)
|
|
2789
3070
|
},
|
|
2790
3071
|
style: { ...common.style, fill: { kind: "none" } }
|
|
2791
3072
|
};
|
|
2792
3073
|
}
|
|
2793
3074
|
function unseenHullNode(context) {
|
|
2794
3075
|
return {
|
|
2795
|
-
...hullNode(context,
|
|
3076
|
+
...hullNode(context, chunkUHKFJBY5_cjs.roundedPolygonPath(silhouette(context.object), 0), 0),
|
|
2796
3077
|
style: { ...context.common.style, fill: { kind: "none" }, stroke: { kind: "none" } }
|
|
2797
3078
|
};
|
|
2798
3079
|
}
|
|
@@ -2805,9 +3086,9 @@ var LABEL_PADDING_Y = 3;
|
|
|
2805
3086
|
var LABEL_CHAR_WIDTH = 6.5;
|
|
2806
3087
|
function labelPlacement(context) {
|
|
2807
3088
|
const { object } = context;
|
|
2808
|
-
const anchor =
|
|
2809
|
-
const bottomY = anchor.y - LABEL_GAP +
|
|
2810
|
-
return { anchor, centerX: anchor.x +
|
|
3089
|
+
const anchor = chunkUHKFJBY5_cjs.isometricTopFaceCenter(object);
|
|
3090
|
+
const bottomY = anchor.y - LABEL_GAP + chunkUHKFJBY5_cjs.finite(object.labelOffsetY, 0);
|
|
3091
|
+
return { anchor, centerX: anchor.x + chunkUHKFJBY5_cjs.finite(object.labelOffsetX, 0), topY: bottomY - LABEL_HEIGHT, bottomY };
|
|
2811
3092
|
}
|
|
2812
3093
|
function labelTextNode(context, placement, text) {
|
|
2813
3094
|
const { object, order, rotation, rotationCenter, box } = context;
|
|
@@ -2822,7 +3103,7 @@ function labelTextNode(context, placement, text) {
|
|
|
2822
3103
|
width: box.width,
|
|
2823
3104
|
height: LABEL_HEIGHT,
|
|
2824
3105
|
lines: [text],
|
|
2825
|
-
fontFamily:
|
|
3106
|
+
fontFamily: chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
2826
3107
|
fontSize: 12,
|
|
2827
3108
|
fontWeight: "normal",
|
|
2828
3109
|
color: "#111827",
|
|
@@ -2902,7 +3183,7 @@ function groundShadowNode(context, topOutline) {
|
|
|
2902
3183
|
}
|
|
2903
3184
|
const height = Math.max(0, object.height);
|
|
2904
3185
|
const heightFactor = 0.6 + Math.min(1, height / 150) * 0.7;
|
|
2905
|
-
const shadowDrop = height +
|
|
3186
|
+
const shadowDrop = height + chunkUHKFJBY5_cjs.finite(object.shadowStyle?.distance, 0);
|
|
2906
3187
|
const contactFootprint = topOutline.map((point) => ({ x: point.x, y: point.y + shadowDrop }));
|
|
2907
3188
|
const footprintCenter = {
|
|
2908
3189
|
x: contactFootprint.reduce((sum, point) => sum + point.x, 0) / contactFootprint.length,
|
|
@@ -2925,14 +3206,14 @@ function groundShadowNode(context, topOutline) {
|
|
|
2925
3206
|
maxX: Math.max(...footprintXs),
|
|
2926
3207
|
maxY: Math.max(...footprintYs)
|
|
2927
3208
|
},
|
|
2928
|
-
d:
|
|
3209
|
+
d: chunkUHKFJBY5_cjs.roundedPolygonPath(footprint, 0),
|
|
2929
3210
|
rotation,
|
|
2930
3211
|
rotationCenter,
|
|
2931
3212
|
style: {
|
|
2932
3213
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
2933
3214
|
stroke: { kind: "none" },
|
|
2934
3215
|
opacity: Math.min(1, (object.shadowStyle?.opacity ?? 0.18) * heightFactor),
|
|
2935
|
-
blur:
|
|
3216
|
+
blur: chunkUHKFJBY5_cjs.finite(object.shadowStyle?.blur, 8),
|
|
2936
3217
|
pointerEvents: "none"
|
|
2937
3218
|
}
|
|
2938
3219
|
};
|
|
@@ -2946,7 +3227,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2946
3227
|
const depth = Math.max(0, object.depth);
|
|
2947
3228
|
const center = {
|
|
2948
3229
|
x: box.x + box.width / 2,
|
|
2949
|
-
y: object.y + Math.max(0, object.height) + (width + depth) *
|
|
3230
|
+
y: object.y + Math.max(0, object.height) + (width + depth) * chunkUHKFJBY5_cjs.AXIS_SIN / 2
|
|
2950
3231
|
};
|
|
2951
3232
|
return {
|
|
2952
3233
|
type: "ellipse",
|
|
@@ -2966,7 +3247,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2966
3247
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
2967
3248
|
stroke: { kind: "none" },
|
|
2968
3249
|
opacity: object.shadowStyle?.opacity ?? 0.2,
|
|
2969
|
-
blur:
|
|
3250
|
+
blur: chunkUHKFJBY5_cjs.finite(object.shadowStyle?.blur, 8),
|
|
2970
3251
|
pointerEvents: "none"
|
|
2971
3252
|
}
|
|
2972
3253
|
};
|
|
@@ -2976,7 +3257,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2976
3257
|
function faceNodes(context, faces, hullClip) {
|
|
2977
3258
|
const { object, common } = context;
|
|
2978
3259
|
const noStroke = { ...common.style, stroke: { kind: "none" } };
|
|
2979
|
-
const fills =
|
|
3260
|
+
const fills = chunkUHKFJBY5_cjs.deriveFaceFills(object.fill ?? "#f8fafc");
|
|
2980
3261
|
const face = (name, offset, points, color) => faceNode(context, name, offset, points, { ...noStroke, fill: { kind: "solid", color }, clip: hullClip });
|
|
2981
3262
|
return [
|
|
2982
3263
|
face("top", 0, faces.top, fills.topFill),
|
|
@@ -3002,9 +3283,9 @@ function seamsNode(context, faces, hullClip) {
|
|
|
3002
3283
|
}
|
|
3003
3284
|
function buildBox(object, index) {
|
|
3004
3285
|
const context = isometricContext(object, index);
|
|
3005
|
-
const faces =
|
|
3006
|
-
const cornerRadius = Math.max(0,
|
|
3007
|
-
const hullPath =
|
|
3286
|
+
const faces = chunkUHKFJBY5_cjs.isometricFaces(object);
|
|
3287
|
+
const cornerRadius = Math.max(0, chunkUHKFJBY5_cjs.finite(object.cornerRadius, 8));
|
|
3288
|
+
const hullPath = chunkUHKFJBY5_cjs.roundedPolygonPath(silhouette(object), cornerRadius);
|
|
3008
3289
|
const hullClip = { type: "path", d: hullPath };
|
|
3009
3290
|
const groundShadow = groundShadowNode(context, faces.top);
|
|
3010
3291
|
const seams = object.seams === false ? void 0 : seamsNode(context, faces, hullClip);
|
|
@@ -3016,7 +3297,7 @@ function buildBox(object, index) {
|
|
|
3016
3297
|
|
|
3017
3298
|
// src/renderScene/artifacts/isometric/extruded.ts
|
|
3018
3299
|
function wallNode(context, side, index, fill2) {
|
|
3019
|
-
const color =
|
|
3300
|
+
const color = chunkUHKFJBY5_cjs.shadeFill(fill2, side.light);
|
|
3020
3301
|
return faceNode(context, `side-${index}`, 0.05 + index * 1e-3, side.points, {
|
|
3021
3302
|
...context.common.style,
|
|
3022
3303
|
stroke: { kind: "solid", color },
|
|
@@ -3041,7 +3322,7 @@ function wallEdgesNode(context, side, index) {
|
|
|
3041
3322
|
}
|
|
3042
3323
|
function buildExtruded(object, index, footprint) {
|
|
3043
3324
|
const context = isometricContext(object, index);
|
|
3044
|
-
const { top, sides } =
|
|
3325
|
+
const { top, sides } = chunkUHKFJBY5_cjs.extrudeFootprint(object, footprint, Math.max(0, chunkUHKFJBY5_cjs.finite(object.cornerRadius, 0)));
|
|
3045
3326
|
const fill2 = object.fill ?? "#f8fafc";
|
|
3046
3327
|
const groundShadow = groundShadowNode(context, top);
|
|
3047
3328
|
const topFace = faceNode(context, "top", 0.2, top, { ...context.common.style, fill: { kind: "solid", color: fill2 } });
|
|
@@ -3078,9 +3359,9 @@ function buildSphere(object, index) {
|
|
|
3078
3359
|
kind: "linear-gradient",
|
|
3079
3360
|
angle: 135,
|
|
3080
3361
|
stops: [
|
|
3081
|
-
{ offset: 0, color:
|
|
3362
|
+
{ offset: 0, color: chunkUHKFJBY5_cjs.shadeFill(fill2, 1.22) },
|
|
3082
3363
|
{ offset: 0.5, color: fill2 },
|
|
3083
|
-
{ offset: 1, color:
|
|
3364
|
+
{ offset: 1, color: chunkUHKFJBY5_cjs.shadeFill(fill2, 0.82) }
|
|
3084
3365
|
]
|
|
3085
3366
|
}
|
|
3086
3367
|
},
|
|
@@ -3116,12 +3397,12 @@ function buildIsometricObject(object, index) {
|
|
|
3116
3397
|
if (object.form === "sphere") {
|
|
3117
3398
|
return buildSphere(object, index);
|
|
3118
3399
|
}
|
|
3119
|
-
const footprint =
|
|
3400
|
+
const footprint = chunkUHKFJBY5_cjs.cleanFootprint(object.footprint);
|
|
3120
3401
|
return footprint.length > 0 ? buildExtruded(object, index, footprint) : buildBox(object, index);
|
|
3121
3402
|
}
|
|
3122
3403
|
function buildIsometricObjects(objects) {
|
|
3123
3404
|
return objects.flatMap(
|
|
3124
|
-
(object, index) =>
|
|
3405
|
+
(object, index) => chunkUHKFJBY5_cjs.tag(
|
|
3125
3406
|
buildIsometricObject(object, index),
|
|
3126
3407
|
"isometric",
|
|
3127
3408
|
object.id,
|
|
@@ -3150,7 +3431,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
3150
3431
|
if (!label) {
|
|
3151
3432
|
return [];
|
|
3152
3433
|
}
|
|
3153
|
-
const fontSize =
|
|
3434
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(context.link.style?.fontSize, 10);
|
|
3154
3435
|
const position = endpointLabelPosition(context.points, end);
|
|
3155
3436
|
const width = 90;
|
|
3156
3437
|
return [
|
|
@@ -3164,7 +3445,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
3164
3445
|
width,
|
|
3165
3446
|
height: fontSize * 2,
|
|
3166
3447
|
lines: [label],
|
|
3167
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3448
|
+
fontFamily: context.link.style?.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
3168
3449
|
fontSize,
|
|
3169
3450
|
fontWeight: "normal",
|
|
3170
3451
|
color: context.color,
|
|
@@ -3194,7 +3475,7 @@ function renderMainLabel(context) {
|
|
|
3194
3475
|
width: context.label.width,
|
|
3195
3476
|
height: context.label.fontSize * 2,
|
|
3196
3477
|
lines: context.label.lines,
|
|
3197
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3478
|
+
fontFamily: context.link.style?.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
3198
3479
|
fontSize: context.label.fontSize,
|
|
3199
3480
|
fontWeight: "normal",
|
|
3200
3481
|
color: context.color,
|
|
@@ -3248,10 +3529,10 @@ function linkBounds(points, padding) {
|
|
|
3248
3529
|
}
|
|
3249
3530
|
function labelLayout(link, measureText) {
|
|
3250
3531
|
const visible = Boolean(link.showText && link.text);
|
|
3251
|
-
const fontSize =
|
|
3532
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(link.style?.fontSize, 10);
|
|
3252
3533
|
const width = Math.min(250, Math.max(fontSize * 2, (link.text?.length ?? 0) * fontSize * 0.65 + 10));
|
|
3253
|
-
const metrics = measureText?.(link.style?.fontFamily ??
|
|
3254
|
-
const lines = visible ?
|
|
3534
|
+
const metrics = measureText?.(link.style?.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT, fontSize);
|
|
3535
|
+
const lines = visible ? chunkUHKFJBY5_cjs.wrapText(link.text ?? "", width, fontSize, metrics) : [];
|
|
3255
3536
|
return { visible, fontSize, width, height: lines.length * fontSize * 1.4, lines };
|
|
3256
3537
|
}
|
|
3257
3538
|
function linkStyle(item, strokeWidth, color, dash) {
|
|
@@ -3268,26 +3549,26 @@ function linkStyle(item, strokeWidth, color, dash) {
|
|
|
3268
3549
|
dash,
|
|
3269
3550
|
lineCap: "round",
|
|
3270
3551
|
lineJoin: "round",
|
|
3271
|
-
opacity:
|
|
3552
|
+
opacity: chunkUHKFJBY5_cjs.finite(link.style?.opacity, 1),
|
|
3272
3553
|
shadow: resolveShadow(link.style?.shadow)
|
|
3273
3554
|
};
|
|
3274
3555
|
}
|
|
3275
3556
|
function createLinkRenderContext(item, index, measureText) {
|
|
3276
3557
|
const { link, from, to } = item;
|
|
3277
3558
|
const pathType = link.style?.pathType ?? "orthogonal";
|
|
3278
|
-
const { points, segments } =
|
|
3279
|
-
const strokeWidth =
|
|
3559
|
+
const { points, segments } = chunkUHKFJBY5_cjs.calculateLinkRoute(link, from, to, pathType);
|
|
3560
|
+
const strokeWidth = chunkUHKFJBY5_cjs.finite(link.style?.strokeWidth, 2);
|
|
3280
3561
|
const color = getLinkStrokeColor(link.style?.color) || "#64748b";
|
|
3281
3562
|
const label = labelLayout(link, measureText);
|
|
3282
3563
|
const contentDash = getDashArray(strokeWidth, link.style?.strokeStyle ?? "solid");
|
|
3283
|
-
const gap = label.visible && !contentDash ?
|
|
3564
|
+
const gap = label.visible && !contentDash ? chunkUHKFJBY5_cjs.labelGapDash(points, pathType, label.width, label.height) : null;
|
|
3284
3565
|
const dash = gap ? [gap.dashBefore, gap.gapLength, 1e6] : contentDash;
|
|
3285
3566
|
return {
|
|
3286
3567
|
link,
|
|
3287
3568
|
pathType,
|
|
3288
3569
|
points,
|
|
3289
3570
|
segments,
|
|
3290
|
-
midpoint:
|
|
3571
|
+
midpoint: chunkUHKFJBY5_cjs.getLineMidpoint(points, pathType, from, to),
|
|
3291
3572
|
strokeWidth,
|
|
3292
3573
|
bounds: linkBounds(points, strokeWidth + 14),
|
|
3293
3574
|
color,
|
|
@@ -3333,7 +3614,7 @@ function pathData2(points, pathType, segments, strokeWidth) {
|
|
|
3333
3614
|
return `M ${points[0]} ${points[1]} C ${points[2]} ${points[3]} ${points[4]} ${points[5]} ${points[6]} ${points[7]}`;
|
|
3334
3615
|
}
|
|
3335
3616
|
if (pathType === "orthogonal" && segments.length > 0) {
|
|
3336
|
-
return
|
|
3617
|
+
return chunkUHKFJBY5_cjs.roundedOrthogonalPathData(segments, Math.max(16, strokeWidth * 4));
|
|
3337
3618
|
}
|
|
3338
3619
|
return polylinePathData(points);
|
|
3339
3620
|
}
|
|
@@ -3437,7 +3718,7 @@ function buildLink(item, index, measureText) {
|
|
|
3437
3718
|
}
|
|
3438
3719
|
function buildLinks(links, measureText) {
|
|
3439
3720
|
return links.flatMap(
|
|
3440
|
-
(item, index) =>
|
|
3721
|
+
(item, index) => chunkUHKFJBY5_cjs.tag(
|
|
3441
3722
|
buildLink(item, index, measureText),
|
|
3442
3723
|
"link",
|
|
3443
3724
|
item.link.id,
|
|
@@ -3452,7 +3733,7 @@ function buildFreeformPath(path, index) {
|
|
|
3452
3733
|
if (path.isVisible === false || path.points.length < 2) {
|
|
3453
3734
|
return [];
|
|
3454
3735
|
}
|
|
3455
|
-
const strokeWidth =
|
|
3736
|
+
const strokeWidth = chunkUHKFJBY5_cjs.finite(path.strokeWidth, 2);
|
|
3456
3737
|
const extra = strokeWidth + 12;
|
|
3457
3738
|
const bounds = {
|
|
3458
3739
|
minX: Math.min(...path.points.map((point) => point.x)) - extra,
|
|
@@ -3460,7 +3741,7 @@ function buildFreeformPath(path, index) {
|
|
|
3460
3741
|
maxX: Math.max(...path.points.map((point) => point.x)) + extra,
|
|
3461
3742
|
maxY: Math.max(...path.points.map((point) => point.y)) + extra
|
|
3462
3743
|
};
|
|
3463
|
-
const tension =
|
|
3744
|
+
const tension = chunkUHKFJBY5_cjs.finite(path.tension, 0);
|
|
3464
3745
|
const closed = path.closed === true;
|
|
3465
3746
|
return [
|
|
3466
3747
|
{
|
|
@@ -3468,7 +3749,7 @@ function buildFreeformPath(path, index) {
|
|
|
3468
3749
|
id: `path-${path.id}`,
|
|
3469
3750
|
order: 3e4 + index,
|
|
3470
3751
|
bounds,
|
|
3471
|
-
d:
|
|
3752
|
+
d: chunkUHKFJBY5_cjs.freeformPathData({ points: path.points, tension, closed }),
|
|
3472
3753
|
markerStart: path.startMarker,
|
|
3473
3754
|
markerEnd: path.endMarker,
|
|
3474
3755
|
detail: {
|
|
@@ -3484,13 +3765,13 @@ function buildFreeformPath(path, index) {
|
|
|
3484
3765
|
dash: path.dash?.length ? path.dash : void 0,
|
|
3485
3766
|
lineCap: "round",
|
|
3486
3767
|
lineJoin: "round",
|
|
3487
|
-
opacity:
|
|
3768
|
+
opacity: chunkUHKFJBY5_cjs.finite(path.opacity, 1)
|
|
3488
3769
|
}
|
|
3489
3770
|
}
|
|
3490
3771
|
];
|
|
3491
3772
|
}
|
|
3492
3773
|
function buildFreeformPaths(paths) {
|
|
3493
|
-
return paths.flatMap((path, index) =>
|
|
3774
|
+
return paths.flatMap((path, index) => chunkUHKFJBY5_cjs.tag(buildFreeformPath(path, index), "path", path.id, "path", "Path"));
|
|
3494
3775
|
}
|
|
3495
3776
|
|
|
3496
3777
|
// src/renderScene/artifacts/shape/geometry/base.ts
|
|
@@ -3506,7 +3787,7 @@ function shapeNodeBase(context) {
|
|
|
3506
3787
|
|
|
3507
3788
|
// src/renderScene/artifacts/shape/geometry/simple.ts
|
|
3508
3789
|
function renderPath(context) {
|
|
3509
|
-
const path =
|
|
3790
|
+
const path = chunkUHKFJBY5_cjs.localShapePath(context.shape.shapeType, context.x, context.y, context.width, context.height);
|
|
3510
3791
|
if (!path) {
|
|
3511
3792
|
return [];
|
|
3512
3793
|
}
|
|
@@ -3522,7 +3803,7 @@ function renderBoundedPath(context) {
|
|
|
3522
3803
|
}));
|
|
3523
3804
|
}
|
|
3524
3805
|
function renderRectangle(context) {
|
|
3525
|
-
const rx = context.shape.shapeType === "pill" ?
|
|
3806
|
+
const rx = context.shape.shapeType === "pill" ? chunkUHKFJBY5_cjs.pillCornerRadius(context.width, context.height) : context.shape.shapeType === "rounded_rectangle" ? chunkUHKFJBY5_cjs.finite(context.shape.cornerRadius, 8) : 0;
|
|
3526
3807
|
return [
|
|
3527
3808
|
{
|
|
3528
3809
|
...shapeNodeBase(context),
|
|
@@ -3551,7 +3832,7 @@ function renderSymbol(context) {
|
|
|
3551
3832
|
if (!context.shape.symbol || context.shape.symbol.points.length < 2) {
|
|
3552
3833
|
return renderRectangle(context);
|
|
3553
3834
|
}
|
|
3554
|
-
const tension =
|
|
3835
|
+
const tension = chunkUHKFJBY5_cjs.finite(context.shape.symbol.tension, 0);
|
|
3555
3836
|
const points = context.shape.symbol.points.map(([x, y]) => ({
|
|
3556
3837
|
x: context.x + x * context.width,
|
|
3557
3838
|
y: context.y + y * context.height
|
|
@@ -3560,7 +3841,7 @@ function renderSymbol(context) {
|
|
|
3560
3841
|
{
|
|
3561
3842
|
...shapeNodeBase(context),
|
|
3562
3843
|
type: "path",
|
|
3563
|
-
d:
|
|
3844
|
+
d: chunkUHKFJBY5_cjs.freeformPathData({ points, tension, closed: true }),
|
|
3564
3845
|
rotationCenter: context.rotationCenter,
|
|
3565
3846
|
detail: {
|
|
3566
3847
|
of: "symbolGeometry",
|
|
@@ -3597,6 +3878,68 @@ function renderShapeGeometry(context) {
|
|
|
3597
3878
|
return renderer(context);
|
|
3598
3879
|
}
|
|
3599
3880
|
|
|
3881
|
+
// src/renderScene/artifacts/shape/image.ts
|
|
3882
|
+
function clipOf(outline2, box) {
|
|
3883
|
+
if (outline2?.type === "path") {
|
|
3884
|
+
return { type: "path", d: outline2.d };
|
|
3885
|
+
}
|
|
3886
|
+
if (outline2?.type === "ellipse") {
|
|
3887
|
+
const { cx, cy, rx, ry } = outline2;
|
|
3888
|
+
return {
|
|
3889
|
+
type: "path",
|
|
3890
|
+
d: `M${cx - rx} ${cy}A${rx} ${ry} 0 1 0 ${cx + rx} ${cy}A${rx} ${ry} 0 1 0 ${cx - rx} ${cy}Z`
|
|
3891
|
+
};
|
|
3892
|
+
}
|
|
3893
|
+
return { type: "rect", ...box, rx: outline2?.type === "rect" ? outline2.rx ?? 0 : 0 };
|
|
3894
|
+
}
|
|
3895
|
+
function croppedBox(image, crop, pixels, box) {
|
|
3896
|
+
const scaleX = box.width / crop.width;
|
|
3897
|
+
const scaleY = box.height / crop.height;
|
|
3898
|
+
const scale = image.fit === "contain" ? Math.min(scaleX, scaleY) : Math.max(scaleX, scaleY);
|
|
3899
|
+
const [sx, sy] = image.fit === "fill" ? [scaleX, scaleY] : [scale, scale];
|
|
3900
|
+
return {
|
|
3901
|
+
x: box.x + (box.width - crop.width * sx) / 2 - crop.x * sx,
|
|
3902
|
+
y: box.y + (box.height - crop.height * sy) / 2 - crop.y * sy,
|
|
3903
|
+
width: pixels[0] * sx,
|
|
3904
|
+
height: pixels[1] * sy
|
|
3905
|
+
};
|
|
3906
|
+
}
|
|
3907
|
+
var ASPECTS = { cover: "slice", contain: "meet", fill: "none" };
|
|
3908
|
+
function renderShapeImage(context, outline2, diagnostics) {
|
|
3909
|
+
const image = context.shape.image;
|
|
3910
|
+
if (!image) {
|
|
3911
|
+
return void 0;
|
|
3912
|
+
}
|
|
3913
|
+
if (image.crop && !image.pixels) {
|
|
3914
|
+
diagnostics.push({
|
|
3915
|
+
severity: "warning",
|
|
3916
|
+
code: "image-crop-without-size",
|
|
3917
|
+
ownerId: context.shape.id,
|
|
3918
|
+
message: `The image '${context.shape.id}' has a crop but no imageSize, so it is shown uncropped. Give it the size of the file, as imageSize: width, height.`
|
|
3919
|
+
});
|
|
3920
|
+
}
|
|
3921
|
+
const box = { x: context.x, y: context.y, width: context.width, height: context.height };
|
|
3922
|
+
const cropped = image.crop && image.pixels;
|
|
3923
|
+
return {
|
|
3924
|
+
type: "image",
|
|
3925
|
+
id: `${context.id}-image`,
|
|
3926
|
+
order: context.order,
|
|
3927
|
+
bounds: context.bounds,
|
|
3928
|
+
...cropped ? croppedBox(image, image.crop, image.pixels, box) : box,
|
|
3929
|
+
href: image.src,
|
|
3930
|
+
aspect: cropped ? "none" : ASPECTS[image.fit],
|
|
3931
|
+
rotation: context.rotation,
|
|
3932
|
+
rotationCenter: context.rotationCenter,
|
|
3933
|
+
style: {
|
|
3934
|
+
opacity: context.style.opacity,
|
|
3935
|
+
blur: context.style.blur,
|
|
3936
|
+
blend: context.style.blend,
|
|
3937
|
+
clip: clipOf(outline2, box),
|
|
3938
|
+
pointerEvents: "none"
|
|
3939
|
+
}
|
|
3940
|
+
};
|
|
3941
|
+
}
|
|
3942
|
+
|
|
3600
3943
|
// src/renderScene/artifacts/shape/shaderSurface.ts
|
|
3601
3944
|
var RECT_PROGRAMS = /* @__PURE__ */ new Set([
|
|
3602
3945
|
"reactivePanel",
|
|
@@ -3635,7 +3978,7 @@ function renderShapeShaderSurface(context) {
|
|
|
3635
3978
|
id: `${context.id}-shader`,
|
|
3636
3979
|
type: "shader-surface",
|
|
3637
3980
|
order: context.order,
|
|
3638
|
-
bounds:
|
|
3981
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds(surfaceBounds, context.rotation, 0),
|
|
3639
3982
|
...surfaceBounds,
|
|
3640
3983
|
rotation: context.rotation,
|
|
3641
3984
|
shader: context.shape.shader,
|
|
@@ -3705,24 +4048,24 @@ function shapeDash(shape, strokeWidth) {
|
|
|
3705
4048
|
}
|
|
3706
4049
|
function shapeStyle(shape, diagnostics) {
|
|
3707
4050
|
const defaults = shapeDefaults(shape, diagnostics);
|
|
3708
|
-
const strokeWidth =
|
|
4051
|
+
const strokeWidth = chunkUHKFJBY5_cjs.finite(shape.strokeWidth, defaults.strokeWidth);
|
|
3709
4052
|
const shadow = shape.shadowStyle ?? (shape.hasShadow ? { enabled: true, color: "#000000", opacity: 0.25, blur: 10, angle: 45, distance: 5 } : void 0);
|
|
3710
|
-
const angle =
|
|
4053
|
+
const angle = chunkUHKFJBY5_cjs.finite(shadow?.angle, 45) * Math.PI / 180;
|
|
3711
4054
|
return {
|
|
3712
|
-
fill:
|
|
3713
|
-
stroke:
|
|
4055
|
+
fill: chunkUHKFJBY5_cjs.paint(shape.fillColor, diagnostics, shape.id),
|
|
4056
|
+
stroke: chunkUHKFJBY5_cjs.paint(shape.strokeColor, diagnostics, shape.id),
|
|
3714
4057
|
strokeWidth,
|
|
3715
4058
|
dash: shapeDash(shape, strokeWidth),
|
|
3716
4059
|
lineCap: shape.strokeStyle === "dotted" ? "round" : "butt",
|
|
3717
|
-
opacity:
|
|
4060
|
+
opacity: chunkUHKFJBY5_cjs.finite(shape.opacity, defaults.opacity),
|
|
3718
4061
|
blur: shape.blur !== void 0 && shape.blur > 0 ? shape.blur : void 0,
|
|
3719
4062
|
blend: shape.blend,
|
|
3720
4063
|
shadow: shadow?.enabled ? {
|
|
3721
4064
|
color: shadow.color ?? "#000000",
|
|
3722
|
-
opacity:
|
|
3723
|
-
blur:
|
|
3724
|
-
dx: Math.cos(angle) *
|
|
3725
|
-
dy: Math.sin(angle) *
|
|
4065
|
+
opacity: chunkUHKFJBY5_cjs.finite(shadow.opacity, 0.25),
|
|
4066
|
+
blur: chunkUHKFJBY5_cjs.finite(shadow.blur, 10),
|
|
4067
|
+
dx: Math.cos(angle) * chunkUHKFJBY5_cjs.finite(shadow.distance, 5),
|
|
4068
|
+
dy: Math.sin(angle) * chunkUHKFJBY5_cjs.finite(shadow.distance, 5)
|
|
3726
4069
|
} : void 0
|
|
3727
4070
|
};
|
|
3728
4071
|
}
|
|
@@ -3798,11 +4141,11 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3798
4141
|
if (!shape.text) {
|
|
3799
4142
|
return null;
|
|
3800
4143
|
}
|
|
3801
|
-
const fontSize =
|
|
4144
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(shape.fontSize, shapeDefaults(shape, []).fontSize);
|
|
3802
4145
|
const padding = shape.isText ? 0 : Math.max(8, strokeWidth * 2);
|
|
3803
|
-
const area = shape.shapeType === "person" ?
|
|
4146
|
+
const area = shape.shapeType === "person" ? chunkUHKFJBY5_cjs.personLabelArea(x, y, width, height) : { x, y, width, height };
|
|
3804
4147
|
const textWidth = Math.max(0, area.width - padding * 2);
|
|
3805
|
-
const fontFamily2 = shape.fontFamily ||
|
|
4148
|
+
const fontFamily2 = shape.fontFamily || chunkUHKFJBY5_cjs.DEFAULT_FONT;
|
|
3806
4149
|
const metrics = measureText?.(fontFamily2, fontSize);
|
|
3807
4150
|
const textNode = {
|
|
3808
4151
|
type: "text",
|
|
@@ -3813,7 +4156,7 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3813
4156
|
y: area.y + padding,
|
|
3814
4157
|
width: textWidth,
|
|
3815
4158
|
height: Math.max(0, area.height - padding * 2),
|
|
3816
|
-
lines:
|
|
4159
|
+
lines: chunkUHKFJBY5_cjs.wrapText(shape.text, textWidth, fontSize, metrics),
|
|
3817
4160
|
fontFamily: fontFamily2,
|
|
3818
4161
|
fontSize,
|
|
3819
4162
|
fontWeight: shape.fontWeight ?? "normal",
|
|
@@ -3821,12 +4164,12 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3821
4164
|
color: shape.textColor || "#111827",
|
|
3822
4165
|
align: shape.textAlign ?? "center",
|
|
3823
4166
|
verticalAlign: shape.textVerticalAlign ?? "middle",
|
|
3824
|
-
lineHeight:
|
|
4167
|
+
lineHeight: chunkUHKFJBY5_cjs.finite(shape.lineHeight, 1.3),
|
|
3825
4168
|
rotation,
|
|
3826
4169
|
rotationCenter
|
|
3827
4170
|
};
|
|
3828
4171
|
if (hasBoldMarkup(shape.text)) {
|
|
3829
|
-
const { measure, spaceWidth } = metrics ??
|
|
4172
|
+
const { measure, spaceWidth } = metrics ?? chunkUHKFJBY5_cjs.heuristicRichMeasure(fontSize);
|
|
3830
4173
|
textNode.richLines = wrapRichText(shape.text, textWidth, measure, spaceWidth);
|
|
3831
4174
|
}
|
|
3832
4175
|
return textNode;
|
|
@@ -3865,19 +4208,19 @@ function renderDoubleStroke(context, strokeWidth) {
|
|
|
3865
4208
|
return nodes;
|
|
3866
4209
|
}
|
|
3867
4210
|
function createRenderContext(shape, index, diagnostics) {
|
|
3868
|
-
const x =
|
|
3869
|
-
const y =
|
|
3870
|
-
const width = Math.max(0,
|
|
3871
|
-
const height = Math.max(0,
|
|
3872
|
-
const rotation =
|
|
3873
|
-
const strokeWidth =
|
|
4211
|
+
const x = chunkUHKFJBY5_cjs.finite(shape.x, 0);
|
|
4212
|
+
const y = chunkUHKFJBY5_cjs.finite(shape.y, 0);
|
|
4213
|
+
const width = Math.max(0, chunkUHKFJBY5_cjs.finite(shape.width, 100));
|
|
4214
|
+
const height = Math.max(0, chunkUHKFJBY5_cjs.finite(shape.height, 100));
|
|
4215
|
+
const rotation = chunkUHKFJBY5_cjs.finite(shape.rotation, 0);
|
|
4216
|
+
const strokeWidth = chunkUHKFJBY5_cjs.finite(shape.strokeWidth, 2);
|
|
3874
4217
|
return {
|
|
3875
4218
|
strokeWidth,
|
|
3876
4219
|
context: {
|
|
3877
4220
|
shape,
|
|
3878
4221
|
id: `shape-${shape.id}`,
|
|
3879
4222
|
order: 1e4 + index,
|
|
3880
|
-
bounds:
|
|
4223
|
+
bounds: chunkUHKFJBY5_cjs.rotatedBounds({ x, y, width, height }, rotation, strokeWidth + (shape.hasShadow ? 20 : 2)),
|
|
3881
4224
|
rotation,
|
|
3882
4225
|
rotationCenter: { x: x + width / 2, y: y + height / 2 },
|
|
3883
4226
|
style: shapeStyle(shape, diagnostics),
|
|
@@ -3903,6 +4246,15 @@ function buildShape(shape, index, diagnostics, measureText) {
|
|
|
3903
4246
|
}
|
|
3904
4247
|
nodes.push(shader);
|
|
3905
4248
|
}
|
|
4249
|
+
const image = renderShapeImage(context, nodes[0], diagnostics);
|
|
4250
|
+
if (image) {
|
|
4251
|
+
for (const node of nodes) {
|
|
4252
|
+
if (node.type === "ellipse" || node.type === "path" || node.type === "rect") {
|
|
4253
|
+
node.style = { ...node.style, pointerEvents: "all" };
|
|
4254
|
+
}
|
|
4255
|
+
}
|
|
4256
|
+
nodes.push(image);
|
|
4257
|
+
}
|
|
3906
4258
|
const text = renderShapeText(context, strokeWidth, measureText);
|
|
3907
4259
|
if (text) {
|
|
3908
4260
|
nodes.push(text);
|
|
@@ -3911,7 +4263,7 @@ function buildShape(shape, index, diagnostics, measureText) {
|
|
|
3911
4263
|
}
|
|
3912
4264
|
function buildShapes(shapes, diagnostics, measureText) {
|
|
3913
4265
|
return shapes.flatMap(
|
|
3914
|
-
(shape, index) =>
|
|
4266
|
+
(shape, index) => chunkUHKFJBY5_cjs.tag(
|
|
3915
4267
|
buildShape(shape, index, diagnostics, measureText),
|
|
3916
4268
|
"shape",
|
|
3917
4269
|
shape.id,
|
|
@@ -3928,7 +4280,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
3928
4280
|
return null;
|
|
3929
4281
|
}
|
|
3930
4282
|
return {
|
|
3931
|
-
...
|
|
4283
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
3932
4284
|
role: "axis",
|
|
3933
4285
|
id: `chart-x-label-${chart.id}`,
|
|
3934
4286
|
order,
|
|
@@ -3938,7 +4290,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
3938
4290
|
chart,
|
|
3939
4291
|
align: "center"
|
|
3940
4292
|
}),
|
|
3941
|
-
prop:
|
|
4293
|
+
prop: chunkUHKFJBY5_cjs.axisLabelProp("x")
|
|
3942
4294
|
};
|
|
3943
4295
|
}
|
|
3944
4296
|
function buildYAxisLabel(chart, layout, order) {
|
|
@@ -3946,7 +4298,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
3946
4298
|
return null;
|
|
3947
4299
|
}
|
|
3948
4300
|
return {
|
|
3949
|
-
...
|
|
4301
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
3950
4302
|
role: "axis",
|
|
3951
4303
|
id: `chart-y-label-${chart.id}`,
|
|
3952
4304
|
order,
|
|
@@ -3962,7 +4314,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
3962
4314
|
align: "center",
|
|
3963
4315
|
rotation: -90
|
|
3964
4316
|
}),
|
|
3965
|
-
prop:
|
|
4317
|
+
prop: chunkUHKFJBY5_cjs.axisLabelProp("y")
|
|
3966
4318
|
};
|
|
3967
4319
|
}
|
|
3968
4320
|
function buildAxisLabels(chart, layout, order) {
|
|
@@ -3985,7 +4337,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
3985
4337
|
return chart.series.map((series, index) => {
|
|
3986
4338
|
const centerY = layout.plot.y + (index + 0.5) * slotWidth;
|
|
3987
4339
|
return {
|
|
3988
|
-
...
|
|
4340
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
3989
4341
|
role: "axis",
|
|
3990
4342
|
id: `chart-y-tick-${chart.id}-${index}`,
|
|
3991
4343
|
order: order + index,
|
|
@@ -3995,7 +4347,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
3995
4347
|
chart,
|
|
3996
4348
|
align: "right"
|
|
3997
4349
|
}),
|
|
3998
|
-
prop:
|
|
4350
|
+
prop: chunkUHKFJBY5_cjs.seriesLabelProp(series.id)
|
|
3999
4351
|
};
|
|
4000
4352
|
});
|
|
4001
4353
|
}
|
|
@@ -4021,7 +4373,7 @@ function isStackedLegendPosition(position) {
|
|
|
4021
4373
|
return position === "bottomLeft" || position === "bottomRight";
|
|
4022
4374
|
}
|
|
4023
4375
|
function legendItemWidths(chart) {
|
|
4024
|
-
return legendSeries(chart).map((item) => Math.max(42, item.label.length *
|
|
4376
|
+
return legendSeries(chart).map((item) => Math.max(42, item.label.length * chunkUHKFJBY5_cjs.finite(chart.fontSize, 12) * 0.58 + 22));
|
|
4025
4377
|
}
|
|
4026
4378
|
function stackedLegendColumnWidth(chart) {
|
|
4027
4379
|
const widths = legendItemWidths(chart);
|
|
@@ -4074,9 +4426,9 @@ function renderLegendItem(render2, item) {
|
|
|
4074
4426
|
}
|
|
4075
4427
|
function createLegendSwatch(render2, item) {
|
|
4076
4428
|
const { chart, bounds, diagnostics } = render2;
|
|
4077
|
-
const fallback =
|
|
4429
|
+
const fallback = chunkUHKFJBY5_cjs.CHART_COLORS[item.seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
4078
4430
|
const solidOnly = chart.chartType === "line";
|
|
4079
|
-
const color = solidOnly ?
|
|
4431
|
+
const color = solidOnly ? chunkUHKFJBY5_cjs.representativeColor(item.series.color, fallback) : item.series.color ?? fallback;
|
|
4080
4432
|
return {
|
|
4081
4433
|
type: "rect",
|
|
4082
4434
|
id: `chart-legend-swatch-${chart.id}-${item.series.id}`,
|
|
@@ -4087,16 +4439,16 @@ function createLegendSwatch(render2, item) {
|
|
|
4087
4439
|
width: 10,
|
|
4088
4440
|
height: 10,
|
|
4089
4441
|
rx: 3,
|
|
4090
|
-
prop:
|
|
4442
|
+
prop: chunkUHKFJBY5_cjs.seriesColorProp(item.series.id),
|
|
4091
4443
|
propKind: "color",
|
|
4092
4444
|
propSolidOnly: solidOnly,
|
|
4093
|
-
style: { fill:
|
|
4445
|
+
style: { fill: chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id) }
|
|
4094
4446
|
};
|
|
4095
4447
|
}
|
|
4096
4448
|
function createLegendLabel(render2, item) {
|
|
4097
4449
|
const { chart, bounds } = render2;
|
|
4098
4450
|
return {
|
|
4099
|
-
...
|
|
4451
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4100
4452
|
role: "legend",
|
|
4101
4453
|
id: `chart-legend-${chart.id}-${item.series.id}`,
|
|
4102
4454
|
order: item.order + 1,
|
|
@@ -4105,7 +4457,7 @@ function createLegendLabel(render2, item) {
|
|
|
4105
4457
|
text: item.series.label,
|
|
4106
4458
|
chart
|
|
4107
4459
|
}),
|
|
4108
|
-
prop:
|
|
4460
|
+
prop: chunkUHKFJBY5_cjs.seriesLabelProp(item.series.id)
|
|
4109
4461
|
};
|
|
4110
4462
|
}
|
|
4111
4463
|
|
|
@@ -4124,19 +4476,19 @@ function hasCartesianDecorations(chart) {
|
|
|
4124
4476
|
return !CHARTS_WITHOUT_CARTESIAN_DECORATIONS.has(chart.chartType);
|
|
4125
4477
|
}
|
|
4126
4478
|
function tickOffset(chart) {
|
|
4127
|
-
return hasCartesianDecorations(chart) ? Math.max(0,
|
|
4479
|
+
return hasCartesianDecorations(chart) ? Math.max(0, chunkUHKFJBY5_cjs.finite(chart.tickLength, 0)) : 0;
|
|
4128
4480
|
}
|
|
4129
4481
|
function xLabelOffset(chart) {
|
|
4130
|
-
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0,
|
|
4482
|
+
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0, chunkUHKFJBY5_cjs.finite(chart.xLabelGap, 0)) : 0);
|
|
4131
4483
|
}
|
|
4132
4484
|
function yLabelOffset(chart) {
|
|
4133
|
-
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0,
|
|
4485
|
+
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0, chunkUHKFJBY5_cjs.finite(chart.yLabelGap, 0)) : 0);
|
|
4134
4486
|
}
|
|
4135
4487
|
function isHorizontalBoxplot(chart) {
|
|
4136
4488
|
return chart.chartType === "boxplot" && chart.config?.orientation === "horizontal";
|
|
4137
4489
|
}
|
|
4138
4490
|
function boxplotCategoryLabelWidth(chart) {
|
|
4139
|
-
const fontSize =
|
|
4491
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(chart.fontSize, 12);
|
|
4140
4492
|
const longest = Math.max(0, ...chart.series.map((series) => (series.label || series.id).length));
|
|
4141
4493
|
return longest * fontSize * 0.58 + 16;
|
|
4142
4494
|
}
|
|
@@ -4148,18 +4500,18 @@ function treemapSideLegendSide(chart, showLegend) {
|
|
|
4148
4500
|
return chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : null;
|
|
4149
4501
|
}
|
|
4150
4502
|
function barCategoryLabelWidth(chart) {
|
|
4151
|
-
const fontSize =
|
|
4503
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(chart.axisFontSize ?? chart.fontSize, 12);
|
|
4152
4504
|
const categories = chart.config?.categories ?? [];
|
|
4153
4505
|
return Math.max(0, ...categories.map((category) => category.length)) * fontSize * 0.58 + 16;
|
|
4154
4506
|
}
|
|
4155
4507
|
function leftLabelWidth(chart) {
|
|
4156
|
-
if (chart.axisLabelSpace && chart.axisLabelSpace > 0 && (isHorizontalBoxplot(chart) ||
|
|
4508
|
+
if (chart.axisLabelSpace && chart.axisLabelSpace > 0 && (isHorizontalBoxplot(chart) || chunkUHKFJBY5_cjs.isHorizontalBar(chart))) {
|
|
4157
4509
|
return chart.axisLabelSpace;
|
|
4158
4510
|
}
|
|
4159
4511
|
if (isHorizontalBoxplot(chart)) {
|
|
4160
4512
|
return boxplotCategoryLabelWidth(chart);
|
|
4161
4513
|
}
|
|
4162
|
-
if (
|
|
4514
|
+
if (chunkUHKFJBY5_cjs.isHorizontalBar(chart)) {
|
|
4163
4515
|
return chart.categoryAlign === "left" || chart.categoryAlign === "inside" ? 20 : barCategoryLabelWidth(chart);
|
|
4164
4516
|
}
|
|
4165
4517
|
if (chart.showValueAxis === false) {
|
|
@@ -4168,12 +4520,12 @@ function leftLabelWidth(chart) {
|
|
|
4168
4520
|
return chart.axisY.label ? 60 : 46;
|
|
4169
4521
|
}
|
|
4170
4522
|
function tiltedBottomRoom(chart) {
|
|
4171
|
-
const tilt =
|
|
4523
|
+
const tilt = chunkUHKFJBY5_cjs.labelTilt(chart);
|
|
4172
4524
|
if (tilt <= 0) {
|
|
4173
4525
|
return 0;
|
|
4174
4526
|
}
|
|
4175
|
-
const labels = chart.chartType === "bar" && !
|
|
4176
|
-
return labels.length > 0 ? Math.max(0,
|
|
4527
|
+
const labels = chart.chartType === "bar" && !chunkUHKFJBY5_cjs.isHorizontalBar(chart) ? chart.config?.categories ?? [] : chart.chartType === "boxplot" && !isHorizontalBoxplot(chart) ? chart.series.map((series) => series.label || series.id) : [];
|
|
4528
|
+
return labels.length > 0 ? Math.max(0, chunkUHKFJBY5_cjs.tiltedLabelRoom(chart, labels, tilt) - 18) : 0;
|
|
4177
4529
|
}
|
|
4178
4530
|
function legendPlaceOf(chart) {
|
|
4179
4531
|
const showLegend = chart.showLegend !== false;
|
|
@@ -4198,14 +4550,14 @@ function padRightOf(legend) {
|
|
|
4198
4550
|
}
|
|
4199
4551
|
function padBottomOf(chart, showLabels, legend) {
|
|
4200
4552
|
const valueRow = chart.chartType === "bar" && chart.config?.showBarLabels === true && chart.config.barLabelPosition === "axis";
|
|
4201
|
-
const horizontalValueAxis =
|
|
4202
|
-
const base = showLabels ?
|
|
4553
|
+
const horizontalValueAxis = chunkUHKFJBY5_cjs.isHorizontalBar(chart) && chart.showValueAxis !== false;
|
|
4554
|
+
const base = showLabels ? chunkUHKFJBY5_cjs.isHorizontalBar(chart) ? horizontalValueAxis ? 34 : 12 : (chart.axisX.label ? 52 : 34) + (valueRow ? 18 : 0) : 12;
|
|
4203
4555
|
const hasColorBar = chart.chartType === "field" && legend.showLegend && Boolean(chart.config?.scale?.stops.length);
|
|
4204
4556
|
const legendInRow = legend.hasItems && !legend.atTop && !legend.stacked;
|
|
4205
4557
|
return xLabelOffset(chart) + base + (showLabels ? tiltedBottomRoom(chart) : 0) + (hasColorBar ? 44 : 0) + (legendInRow ? 16 + LEGEND_ROW_HEIGHT : 0);
|
|
4206
4558
|
}
|
|
4207
4559
|
function padTopOf(chart, legend) {
|
|
4208
|
-
const titleHeight = chart.title ? Math.max(44, 20 +
|
|
4560
|
+
const titleHeight = chart.title ? Math.max(44, 20 + chunkUHKFJBY5_cjs.finite(chart.titleSize, 14) * 1.6) : 0;
|
|
4209
4561
|
return titleHeight || (legend.atTop && legend.hasItems ? 44 : 24);
|
|
4210
4562
|
}
|
|
4211
4563
|
function decorations(chart) {
|
|
@@ -4216,9 +4568,9 @@ function decorations(chart) {
|
|
|
4216
4568
|
const padBottom = padBottomOf(chart, showLabels, legend);
|
|
4217
4569
|
const padTop = padTopOf(chart, legend);
|
|
4218
4570
|
return {
|
|
4219
|
-
bounds:
|
|
4571
|
+
bounds: chunkUHKFJBY5_cjs.boxBounds(
|
|
4220
4572
|
{ x: chart.x, y: chart.y, width: chart.width, height: chart.height },
|
|
4221
|
-
|
|
4573
|
+
chunkUHKFJBY5_cjs.finite(chart.strokeWidth, 1) + 2
|
|
4222
4574
|
),
|
|
4223
4575
|
plot: {
|
|
4224
4576
|
x: chart.x + padLeft,
|
|
@@ -4240,26 +4592,26 @@ function categoryLabels(chart, count) {
|
|
|
4240
4592
|
return Array.from({ length: count }, (_value, index) => String(index + 1));
|
|
4241
4593
|
}
|
|
4242
4594
|
function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
4243
|
-
const count =
|
|
4595
|
+
const count = chunkUHKFJBY5_cjs.barCategoryCount(chart);
|
|
4244
4596
|
const slotWidth = layout.plot.width / count;
|
|
4245
4597
|
const labels = categoryLabels(chart, count);
|
|
4246
4598
|
const editable = Boolean(chart.config?.categories?.length);
|
|
4247
|
-
const tilt =
|
|
4599
|
+
const tilt = chunkUHKFJBY5_cjs.labelTilt(chart);
|
|
4248
4600
|
const left = chart.categoryAlign === "left";
|
|
4249
4601
|
const groupGap = left ? Math.min(
|
|
4250
|
-
Math.max(0,
|
|
4602
|
+
Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.barGroupGap, 8)),
|
|
4251
4603
|
Math.max(0, slotWidth - 1)
|
|
4252
4604
|
) : 0;
|
|
4253
4605
|
return Array.from({ length: count }, (_value, index) => {
|
|
4254
4606
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
4255
4607
|
if (tilt > 0) {
|
|
4256
4608
|
const text = labels[index] ?? String(index + 1);
|
|
4257
|
-
const { frame, rotation } =
|
|
4609
|
+
const { frame, rotation } = chunkUHKFJBY5_cjs.labelBelowFrame(chart, text, tilt, {
|
|
4258
4610
|
x: centerX,
|
|
4259
4611
|
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart)
|
|
4260
4612
|
});
|
|
4261
4613
|
return {
|
|
4262
|
-
...
|
|
4614
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4263
4615
|
role: "axis",
|
|
4264
4616
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4265
4617
|
order: order + index,
|
|
@@ -4270,11 +4622,11 @@ function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
|
4270
4622
|
align: "right",
|
|
4271
4623
|
rotation
|
|
4272
4624
|
}),
|
|
4273
|
-
prop: editable ?
|
|
4625
|
+
prop: editable ? chunkUHKFJBY5_cjs.categoryProp(index) : void 0
|
|
4274
4626
|
};
|
|
4275
4627
|
}
|
|
4276
4628
|
return {
|
|
4277
|
-
...
|
|
4629
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4278
4630
|
role: "axis",
|
|
4279
4631
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4280
4632
|
order: order + index,
|
|
@@ -4289,24 +4641,24 @@ function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
|
4289
4641
|
chart,
|
|
4290
4642
|
align: left ? "left" : "center"
|
|
4291
4643
|
}),
|
|
4292
|
-
prop: editable ?
|
|
4644
|
+
prop: editable ? chunkUHKFJBY5_cjs.categoryProp(index) : void 0
|
|
4293
4645
|
};
|
|
4294
4646
|
});
|
|
4295
4647
|
}
|
|
4296
4648
|
function buildSeriesXAxisTicks(chart, layout, order) {
|
|
4297
4649
|
const count = Math.max(1, chart.series.length);
|
|
4298
4650
|
const slotWidth = layout.plot.width / count;
|
|
4299
|
-
const tilt =
|
|
4651
|
+
const tilt = chunkUHKFJBY5_cjs.labelTilt(chart);
|
|
4300
4652
|
return chart.series.map((series, index) => {
|
|
4301
4653
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
4302
4654
|
if (tilt > 0) {
|
|
4303
4655
|
const text = series.label || series.id;
|
|
4304
|
-
const { frame, rotation } =
|
|
4656
|
+
const { frame, rotation } = chunkUHKFJBY5_cjs.labelBelowFrame(chart, text, tilt, {
|
|
4305
4657
|
x: centerX,
|
|
4306
4658
|
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart)
|
|
4307
4659
|
});
|
|
4308
4660
|
return {
|
|
4309
|
-
...
|
|
4661
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4310
4662
|
role: "axis",
|
|
4311
4663
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4312
4664
|
order: order + index,
|
|
@@ -4317,11 +4669,11 @@ function buildSeriesXAxisTicks(chart, layout, order) {
|
|
|
4317
4669
|
align: "right",
|
|
4318
4670
|
rotation
|
|
4319
4671
|
}),
|
|
4320
|
-
prop:
|
|
4672
|
+
prop: chunkUHKFJBY5_cjs.seriesLabelProp(series.id)
|
|
4321
4673
|
};
|
|
4322
4674
|
}
|
|
4323
4675
|
return {
|
|
4324
|
-
...
|
|
4676
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4325
4677
|
role: "axis",
|
|
4326
4678
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4327
4679
|
order: order + index,
|
|
@@ -4336,16 +4688,16 @@ function buildSeriesXAxisTicks(chart, layout, order) {
|
|
|
4336
4688
|
chart,
|
|
4337
4689
|
align: "center"
|
|
4338
4690
|
}),
|
|
4339
|
-
prop:
|
|
4691
|
+
prop: chunkUHKFJBY5_cjs.seriesLabelProp(series.id)
|
|
4340
4692
|
};
|
|
4341
4693
|
});
|
|
4342
4694
|
}
|
|
4343
4695
|
|
|
4344
4696
|
// src/renderScene/charts/decorations/numericXAxis.ts
|
|
4345
4697
|
function buildNumericXAxisTicks(chart, layout, order) {
|
|
4346
|
-
return
|
|
4347
|
-
const x = layout.plot.x +
|
|
4348
|
-
return
|
|
4698
|
+
return chunkUHKFJBY5_cjs.chartTicks(chart.axisX).map((tick, index) => {
|
|
4699
|
+
const x = layout.plot.x + chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisX, layout.plot.width);
|
|
4700
|
+
return chunkUHKFJBY5_cjs.chartText({
|
|
4349
4701
|
role: "axis",
|
|
4350
4702
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
4351
4703
|
order: order + index,
|
|
@@ -4360,9 +4712,9 @@ function buildNumericXAxisTicks(chart, layout, order) {
|
|
|
4360
4712
|
|
|
4361
4713
|
// src/renderScene/charts/decorations/numericYAxis.ts
|
|
4362
4714
|
function buildNumericYAxisTicks(chart, layout, order) {
|
|
4363
|
-
return
|
|
4364
|
-
const y = layout.plot.y + layout.plot.height -
|
|
4365
|
-
return
|
|
4715
|
+
return chunkUHKFJBY5_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
4716
|
+
const y = layout.plot.y + layout.plot.height - chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisY, layout.plot.height);
|
|
4717
|
+
return chunkUHKFJBY5_cjs.chartText({
|
|
4366
4718
|
role: "axis",
|
|
4367
4719
|
id: `chart-y-tick-${chart.id}-${tick}`,
|
|
4368
4720
|
order: order + index,
|
|
@@ -4397,10 +4749,10 @@ function buildYAxisTicks(chart, layout, order) {
|
|
|
4397
4749
|
function xTickPositions(chart, layout) {
|
|
4398
4750
|
const { plot } = layout;
|
|
4399
4751
|
if (chart.chartType === "bar") {
|
|
4400
|
-
const count =
|
|
4752
|
+
const count = chunkUHKFJBY5_cjs.barCategoryCount(chart);
|
|
4401
4753
|
return Array.from({ length: count }, (_value, index) => plot.x + (index + 0.5) * plot.width / count);
|
|
4402
4754
|
}
|
|
4403
|
-
return
|
|
4755
|
+
return chunkUHKFJBY5_cjs.chartTicks(chart.axisX).map((tick) => plot.x + chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisX, plot.width));
|
|
4404
4756
|
}
|
|
4405
4757
|
function axisLineDash(chart, width) {
|
|
4406
4758
|
if (chart.axisLineStyle === "dashed") {
|
|
@@ -4409,8 +4761,8 @@ function axisLineDash(chart, width) {
|
|
|
4409
4761
|
return chart.axisLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : {};
|
|
4410
4762
|
}
|
|
4411
4763
|
function buildAxisLines(chart, layout, order) {
|
|
4412
|
-
const lineWidth =
|
|
4413
|
-
const tickLength =
|
|
4764
|
+
const lineWidth = chunkUHKFJBY5_cjs.finite(chart.axisLineWidth, 0);
|
|
4765
|
+
const tickLength = chunkUHKFJBY5_cjs.finite(chart.tickLength, 0);
|
|
4414
4766
|
if (lineWidth <= 0 && tickLength <= 0) {
|
|
4415
4767
|
return [];
|
|
4416
4768
|
}
|
|
@@ -4431,20 +4783,20 @@ function buildAxisLines(chart, layout, order) {
|
|
|
4431
4783
|
}
|
|
4432
4784
|
add("line-x", `M ${plot.x} ${bottom} L ${plot.x + plot.width} ${bottom}`);
|
|
4433
4785
|
}
|
|
4434
|
-
if (tickLength > 0 &&
|
|
4435
|
-
|
|
4436
|
-
const x = plot.x +
|
|
4786
|
+
if (tickLength > 0 && chunkUHKFJBY5_cjs.isHorizontalBar(chart)) {
|
|
4787
|
+
chunkUHKFJBY5_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4788
|
+
const x = plot.x + chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4437
4789
|
add(`tick-v-${tick}`, `M ${x} ${bottom} L ${x} ${bottom + tickLength}`);
|
|
4438
4790
|
});
|
|
4439
|
-
const rows =
|
|
4791
|
+
const rows = chunkUHKFJBY5_cjs.horizontalRows(chart, plot);
|
|
4440
4792
|
for (let index = 0; index < rows.count; index++) {
|
|
4441
|
-
const y =
|
|
4793
|
+
const y = chunkUHKFJBY5_cjs.rowTop(rows, plot, index) + rows.labelRow + rows.barsHeight / 2;
|
|
4442
4794
|
add(`tick-c-${index}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
4443
4795
|
}
|
|
4444
4796
|
}
|
|
4445
|
-
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !
|
|
4446
|
-
|
|
4447
|
-
const y = bottom -
|
|
4797
|
+
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !chunkUHKFJBY5_cjs.isHorizontalBar(chart)) {
|
|
4798
|
+
chunkUHKFJBY5_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4799
|
+
const y = bottom - chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
4448
4800
|
add(`tick-y-${tick}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
4449
4801
|
});
|
|
4450
4802
|
xTickPositions(chart, layout).forEach((x, index) => {
|
|
@@ -4459,14 +4811,14 @@ function categoryNames(chart, count) {
|
|
|
4459
4811
|
}
|
|
4460
4812
|
function buildHorizontalBarAxes(chart, layout, order) {
|
|
4461
4813
|
const { plot, bounds } = layout;
|
|
4462
|
-
const rows =
|
|
4814
|
+
const rows = chunkUHKFJBY5_cjs.horizontalRows(chart, plot);
|
|
4463
4815
|
const above = chart.categoryAlign === "left";
|
|
4464
4816
|
const inside = chart.categoryAlign === "inside";
|
|
4465
4817
|
const editable = Boolean(chart.config?.categories?.length);
|
|
4466
4818
|
const nodes = categoryNames(chart, rows.count).map((name, index) => {
|
|
4467
|
-
const top =
|
|
4819
|
+
const top = chunkUHKFJBY5_cjs.rowTop(rows, plot, index);
|
|
4468
4820
|
return {
|
|
4469
|
-
...
|
|
4821
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4470
4822
|
role: "axis",
|
|
4471
4823
|
id: `chart-y-category-${chart.id}-${index}`,
|
|
4472
4824
|
order: order + index,
|
|
@@ -4476,19 +4828,19 @@ function buildHorizontalBarAxes(chart, layout, order) {
|
|
|
4476
4828
|
chart,
|
|
4477
4829
|
align: above || inside ? "left" : "right"
|
|
4478
4830
|
}),
|
|
4479
|
-
prop: editable ?
|
|
4831
|
+
prop: editable ? chunkUHKFJBY5_cjs.categoryProp(index) : void 0
|
|
4480
4832
|
};
|
|
4481
4833
|
});
|
|
4482
4834
|
if (chart.showValueAxis !== false) {
|
|
4483
|
-
|
|
4484
|
-
const x = plot.x +
|
|
4835
|
+
chunkUHKFJBY5_cjs.chartTicks(chart.axisY).forEach((tick, index) => {
|
|
4836
|
+
const x = plot.x + chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4485
4837
|
nodes.push(
|
|
4486
|
-
|
|
4838
|
+
chunkUHKFJBY5_cjs.chartText({
|
|
4487
4839
|
role: "axis",
|
|
4488
4840
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
4489
4841
|
order: order + rows.count + index,
|
|
4490
4842
|
bounds,
|
|
4491
|
-
frame: { x: x - 20, y: plot.y + plot.height + 4 +
|
|
4843
|
+
frame: { x: x - 20, y: plot.y + plot.height + 4 + chunkUHKFJBY5_cjs.finite(chart.tickLength, 0), width: 40, height: 18 },
|
|
4492
4844
|
text: String(tick),
|
|
4493
4845
|
chart,
|
|
4494
4846
|
align: "center"
|
|
@@ -4507,7 +4859,7 @@ function buildChartAxes(chart, layout, order) {
|
|
|
4507
4859
|
return lines;
|
|
4508
4860
|
}
|
|
4509
4861
|
order += lines.length;
|
|
4510
|
-
if (
|
|
4862
|
+
if (chunkUHKFJBY5_cjs.isHorizontalBar(chart)) {
|
|
4511
4863
|
return [...lines, ...buildHorizontalBarAxes(chart, layout, order)];
|
|
4512
4864
|
}
|
|
4513
4865
|
const xTicks = buildXAxisTicks(chart, layout, order);
|
|
@@ -4585,7 +4937,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4585
4937
|
const centerX = plot.x + plot.width / 2;
|
|
4586
4938
|
const centerY = plot.y + plot.height / 2;
|
|
4587
4939
|
const radius = Math.max(0, Math.min(plot.width, plot.height) / 2);
|
|
4588
|
-
const width =
|
|
4940
|
+
const width = chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1);
|
|
4589
4941
|
if (chart.gridLineStyle === "dotted") {
|
|
4590
4942
|
return buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width);
|
|
4591
4943
|
}
|
|
@@ -4596,7 +4948,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4596
4948
|
...gridLineDashStyle(chart, width)
|
|
4597
4949
|
};
|
|
4598
4950
|
const nodes = [];
|
|
4599
|
-
|
|
4951
|
+
chunkUHKFJBY5_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min).forEach((tick) => {
|
|
4600
4952
|
const ringRadius = radius * ringRatio(chart, tick);
|
|
4601
4953
|
nodes.push({
|
|
4602
4954
|
type: "ellipse",
|
|
@@ -4610,8 +4962,8 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4610
4962
|
style
|
|
4611
4963
|
});
|
|
4612
4964
|
});
|
|
4613
|
-
|
|
4614
|
-
const angle =
|
|
4965
|
+
chunkUHKFJBY5_cjs.chartTicks(chart.axisX).forEach((tick) => {
|
|
4966
|
+
const angle = chunkUHKFJBY5_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, tick);
|
|
4615
4967
|
const edgeX = centerX + Math.cos(angle) * radius;
|
|
4616
4968
|
const edgeY = centerY + Math.sin(angle) * radius;
|
|
4617
4969
|
nodes.push({
|
|
@@ -4626,13 +4978,13 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4626
4978
|
return nodes;
|
|
4627
4979
|
}
|
|
4628
4980
|
function buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width) {
|
|
4629
|
-
const yTicks =
|
|
4630
|
-
const xTicks =
|
|
4981
|
+
const yTicks = chunkUHKFJBY5_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min);
|
|
4982
|
+
const xTicks = chunkUHKFJBY5_cjs.chartTicks(chart.axisX);
|
|
4631
4983
|
const nodes = [];
|
|
4632
4984
|
yTicks.forEach((yTick) => {
|
|
4633
4985
|
const ringRadius = radius * ringRatio(chart, yTick);
|
|
4634
4986
|
xTicks.forEach((xTick) => {
|
|
4635
|
-
const angle =
|
|
4987
|
+
const angle = chunkUHKFJBY5_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, xTick);
|
|
4636
4988
|
const x = centerX + Math.cos(angle) * ringRadius;
|
|
4637
4989
|
const y = centerY + Math.sin(angle) * ringRadius;
|
|
4638
4990
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
@@ -4654,8 +5006,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4654
5006
|
if (chart.gridShape === "circle" && CIRCULAR_GRID_CHART_TYPES.has(chart.chartType)) {
|
|
4655
5007
|
return buildCircularChartGrid(chart, plot, bounds, order);
|
|
4656
5008
|
}
|
|
4657
|
-
const width =
|
|
4658
|
-
if (
|
|
5009
|
+
const width = chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1);
|
|
5010
|
+
if (chunkUHKFJBY5_cjs.isHorizontalBar(chart)) {
|
|
4659
5011
|
return buildHorizontalBarGrid(chart, plot, bounds, order, width);
|
|
4660
5012
|
}
|
|
4661
5013
|
const clip = chart.chartType === "field" ? fieldSurfaceClip(chart, plot) : void 0;
|
|
@@ -4670,8 +5022,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4670
5022
|
clip
|
|
4671
5023
|
};
|
|
4672
5024
|
const nodes = [];
|
|
4673
|
-
(chart.gridAxes === "y" ? [] :
|
|
4674
|
-
const x = plot.x +
|
|
5025
|
+
(chart.gridAxes === "y" ? [] : chunkUHKFJBY5_cjs.chartTicks(chart.axisX)).forEach((tick) => {
|
|
5026
|
+
const x = plot.x + chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisX, plot.width);
|
|
4675
5027
|
nodes.push({
|
|
4676
5028
|
type: "path",
|
|
4677
5029
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -4681,8 +5033,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4681
5033
|
style
|
|
4682
5034
|
});
|
|
4683
5035
|
});
|
|
4684
|
-
(chart.gridAxes === "x" ? [] :
|
|
4685
|
-
const y = plot.y + plot.height -
|
|
5036
|
+
(chart.gridAxes === "x" ? [] : chunkUHKFJBY5_cjs.chartTicks(chart.axisY)).forEach((tick) => {
|
|
5037
|
+
const y = plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
4686
5038
|
nodes.push({
|
|
4687
5039
|
type: "path",
|
|
4688
5040
|
id: `chart-grid-y-${chart.id}-${tick}`,
|
|
@@ -4704,8 +5056,8 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
4704
5056
|
strokeWidth: width,
|
|
4705
5057
|
...chart.gridLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : gridLineDashStyle(chart, width)
|
|
4706
5058
|
};
|
|
4707
|
-
return
|
|
4708
|
-
const x = plot.x +
|
|
5059
|
+
return chunkUHKFJBY5_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
5060
|
+
const x = plot.x + chunkUHKFJBY5_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4709
5061
|
return {
|
|
4710
5062
|
type: "path",
|
|
4711
5063
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -4717,13 +5069,13 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
4717
5069
|
});
|
|
4718
5070
|
}
|
|
4719
5071
|
function buildDottedRectGrid(chart, plot, bounds, order, width, clip) {
|
|
4720
|
-
const xTicks =
|
|
4721
|
-
const yTicks =
|
|
5072
|
+
const xTicks = chunkUHKFJBY5_cjs.chartTicks(chart.axisX);
|
|
5073
|
+
const yTicks = chunkUHKFJBY5_cjs.chartTicks(chart.axisY);
|
|
4722
5074
|
const nodes = [];
|
|
4723
5075
|
xTicks.forEach((xTick) => {
|
|
4724
|
-
const x = plot.x +
|
|
5076
|
+
const x = plot.x + chunkUHKFJBY5_cjs.mapChartValue(xTick, chart.axisX, plot.width);
|
|
4725
5077
|
yTicks.forEach((yTick) => {
|
|
4726
|
-
const y = plot.y + plot.height -
|
|
5078
|
+
const y = plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(yTick, chart.axisY, plot.height);
|
|
4727
5079
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
4728
5080
|
nodes.push(createGridDot(chart, id, order + nodes.length, bounds, x, y, width, clip));
|
|
4729
5081
|
});
|
|
@@ -4746,7 +5098,7 @@ function createChartRuleMarks(render2) {
|
|
|
4746
5098
|
return {
|
|
4747
5099
|
rule,
|
|
4748
5100
|
color: rule.color || render2.chart.strokeColor || "#475569",
|
|
4749
|
-
y: render2.plot.y + render2.plot.height -
|
|
5101
|
+
y: render2.plot.y + render2.plot.height - chunkUHKFJBY5_cjs.mapChartValue(rule.at, render2.chart.axisY, render2.plot.height),
|
|
4750
5102
|
lineOrder,
|
|
4751
5103
|
labelOrder
|
|
4752
5104
|
};
|
|
@@ -4766,7 +5118,7 @@ function createChartRuleLine(render2, mark) {
|
|
|
4766
5118
|
order: mark.lineOrder,
|
|
4767
5119
|
bounds: render2.bounds,
|
|
4768
5120
|
d: `M ${render2.plot.x} ${mark.y} L ${render2.plot.x + render2.plot.width} ${mark.y}`,
|
|
4769
|
-
prop:
|
|
5121
|
+
prop: chunkUHKFJBY5_cjs.ruleAtProp(mark.rule.id),
|
|
4770
5122
|
propKind: "value",
|
|
4771
5123
|
style: {
|
|
4772
5124
|
fill: { kind: "none" },
|
|
@@ -4777,9 +5129,9 @@ function createChartRuleLine(render2, mark) {
|
|
|
4777
5129
|
};
|
|
4778
5130
|
}
|
|
4779
5131
|
function createChartRuleLabel(render2, mark) {
|
|
4780
|
-
const fontSize = Math.max(9,
|
|
5132
|
+
const fontSize = Math.max(9, chunkUHKFJBY5_cjs.finite(render2.chart.fontSize, 12) - 2);
|
|
4781
5133
|
return {
|
|
4782
|
-
...
|
|
5134
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4783
5135
|
id: `chart-rule-label-${render2.chart.id}-${mark.rule.id}`,
|
|
4784
5136
|
order: mark.labelOrder ?? mark.lineOrder + 1,
|
|
4785
5137
|
bounds: render2.bounds,
|
|
@@ -4788,19 +5140,19 @@ function createChartRuleLabel(render2, mark) {
|
|
|
4788
5140
|
chart: render2.chart
|
|
4789
5141
|
}),
|
|
4790
5142
|
color: mark.color,
|
|
4791
|
-
prop:
|
|
5143
|
+
prop: chunkUHKFJBY5_cjs.ruleTextProp(mark.rule.id)
|
|
4792
5144
|
};
|
|
4793
5145
|
}
|
|
4794
5146
|
|
|
4795
5147
|
// src/renderScene/charts/chartBackdrop.ts
|
|
4796
5148
|
function chartImageRect(chart) {
|
|
4797
|
-
const inset =
|
|
5149
|
+
const inset = chunkUHKFJBY5_cjs.finite(chart.strokeWidth, 1) / 2;
|
|
4798
5150
|
return {
|
|
4799
5151
|
x: chart.x + inset,
|
|
4800
5152
|
y: chart.y + inset,
|
|
4801
5153
|
width: Math.max(1, chart.width - inset * 2),
|
|
4802
5154
|
height: Math.max(1, chart.height - inset * 2),
|
|
4803
|
-
rx: Math.max(0,
|
|
5155
|
+
rx: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.cornerRadius, 12) - inset)
|
|
4804
5156
|
};
|
|
4805
5157
|
}
|
|
4806
5158
|
function buildChartBackdrop(chart, bounds, order) {
|
|
@@ -4842,7 +5194,7 @@ function buildChartBackdrop(chart, bounds, order) {
|
|
|
4842
5194
|
// src/renderScene/charts/renderers/bar/glass.ts
|
|
4843
5195
|
function createGlassBackdropNodes(context, id, d) {
|
|
4844
5196
|
const { chart, bounds, nextOrder } = context;
|
|
4845
|
-
const blur =
|
|
5197
|
+
const blur = chunkUHKFJBY5_cjs.finite(chart.config?.barGlassBlur, 0);
|
|
4846
5198
|
if (blur <= 0 || !chart.fillImage) {
|
|
4847
5199
|
return [];
|
|
4848
5200
|
}
|
|
@@ -4860,7 +5212,7 @@ function createGlassBackdropNodes(context, id, d) {
|
|
|
4860
5212
|
href: chart.fillImage.url,
|
|
4861
5213
|
style: {
|
|
4862
5214
|
blur,
|
|
4863
|
-
saturate:
|
|
5215
|
+
saturate: chunkUHKFJBY5_cjs.finite(chart.config?.barGlassSaturation, 1),
|
|
4864
5216
|
clip: { type: "path", d },
|
|
4865
5217
|
pointerEvents: "none"
|
|
4866
5218
|
}
|
|
@@ -4911,8 +5263,8 @@ function createBarGlowNode(context, id, d, color, glow, bounds = context.bounds)
|
|
|
4911
5263
|
bounds,
|
|
4912
5264
|
d,
|
|
4913
5265
|
style: {
|
|
4914
|
-
fill:
|
|
4915
|
-
shadow: { color:
|
|
5266
|
+
fill: chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id),
|
|
5267
|
+
shadow: { color: chunkUHKFJBY5_cjs.representativeColor(color, "#ffffff"), opacity: 0.9, blur: glow, dx: 0, dy: 0 },
|
|
4916
5268
|
pointerEvents: "none"
|
|
4917
5269
|
}
|
|
4918
5270
|
};
|
|
@@ -4923,14 +5275,14 @@ function barLabelsEnabled(context) {
|
|
|
4923
5275
|
return context.chart.config?.showBarLabels === true;
|
|
4924
5276
|
}
|
|
4925
5277
|
function resolvePlacement(target, size) {
|
|
4926
|
-
const fits = target.frame.height >= size.height +
|
|
5278
|
+
const fits = target.frame.height >= size.height + chunkUHKFJBY5_cjs.BAR_LABEL.gap * 2;
|
|
4927
5279
|
return target.placement !== "outside" && !fits ? "outside" : target.placement;
|
|
4928
5280
|
}
|
|
4929
5281
|
function labelTop(placement, frame, height) {
|
|
4930
5282
|
if (placement === "outside") {
|
|
4931
|
-
return frame.y - height -
|
|
5283
|
+
return frame.y - height - chunkUHKFJBY5_cjs.BAR_LABEL.gap;
|
|
4932
5284
|
}
|
|
4933
|
-
return placement === "inside" ? frame.y +
|
|
5285
|
+
return placement === "inside" ? frame.y + chunkUHKFJBY5_cjs.BAR_LABEL.gap : frame.y + frame.height / 2 - height / 2;
|
|
4934
5286
|
}
|
|
4935
5287
|
function createPillNode(context, id, box, color) {
|
|
4936
5288
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
@@ -4940,11 +5292,11 @@ function createPillNode(context, id, box, color) {
|
|
|
4940
5292
|
id: `${id}-pill`,
|
|
4941
5293
|
order: nextOrder(),
|
|
4942
5294
|
bounds,
|
|
4943
|
-
d:
|
|
5295
|
+
d: chunkUHKFJBY5_cjs.pillPath(box.left, box.top, box.width, box.height),
|
|
4944
5296
|
style: {
|
|
4945
|
-
fill: config?.barLabelPillColor ?
|
|
4946
|
-
stroke:
|
|
4947
|
-
strokeWidth:
|
|
5297
|
+
fill: config?.barLabelPillColor ? chunkUHKFJBY5_cjs.paint(config.barLabelPillColor, diagnostics, chart.id) : { kind: "none" },
|
|
5298
|
+
stroke: chunkUHKFJBY5_cjs.paint(config?.barLabelBorderColor ?? color, diagnostics, chart.id),
|
|
5299
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(config?.barLabelBorderWidth, 1),
|
|
4948
5300
|
pointerEvents: "none"
|
|
4949
5301
|
}
|
|
4950
5302
|
};
|
|
@@ -4953,7 +5305,7 @@ function createTextNode(context, id, box, text, placement, fontSize, color) {
|
|
|
4953
5305
|
const { chart, bounds, nextOrder } = context;
|
|
4954
5306
|
const config = chart.config;
|
|
4955
5307
|
return {
|
|
4956
|
-
...
|
|
5308
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4957
5309
|
id,
|
|
4958
5310
|
order: nextOrder(),
|
|
4959
5311
|
bounds,
|
|
@@ -4974,7 +5326,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4974
5326
|
const config = chart.config;
|
|
4975
5327
|
const top = plot.y + plot.height + 4 + 16 + Math.max(0, chart.tickLength ?? 0);
|
|
4976
5328
|
return {
|
|
4977
|
-
...
|
|
5329
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
4978
5330
|
id: target.id,
|
|
4979
5331
|
order: nextOrder(),
|
|
4980
5332
|
bounds,
|
|
@@ -4983,7 +5335,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4983
5335
|
y: target.frame.y + target.frame.height / 2 - fontSize * 0.6,
|
|
4984
5336
|
width: plot.width - 14,
|
|
4985
5337
|
height: fontSize * 1.2
|
|
4986
|
-
} : { x: plot.x, y: target.frame.y -
|
|
5338
|
+
} : { x: plot.x, y: target.frame.y - chunkUHKFJBY5_cjs.CATEGORY_LABEL_ROW, width: plot.width, height: fontSize * 1.2 } : { x: target.frame.x, y: top, width: target.frame.width, height: fontSize * 1.2 },
|
|
4987
5339
|
text,
|
|
4988
5340
|
chart,
|
|
4989
5341
|
align: target.horizontal ? "right" : chart.categoryAlign === "left" ? "left" : "center"
|
|
@@ -4997,24 +5349,24 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4997
5349
|
}
|
|
4998
5350
|
function horizontalPlacement(target, size) {
|
|
4999
5351
|
const requested = target.placement === "axis" ? "outside" : target.placement;
|
|
5000
|
-
const fits = target.frame.width >= size.width +
|
|
5352
|
+
const fits = target.frame.width >= size.width + chunkUHKFJBY5_cjs.BAR_LABEL.gap * 2;
|
|
5001
5353
|
return requested !== "outside" && !fits ? "outside" : requested;
|
|
5002
5354
|
}
|
|
5003
5355
|
function horizontalBox(target, size, placement) {
|
|
5004
5356
|
const { frame } = target;
|
|
5005
|
-
const left = placement === "outside" ? frame.x + frame.width +
|
|
5357
|
+
const left = placement === "outside" ? frame.x + frame.width + chunkUHKFJBY5_cjs.BAR_LABEL.gap : placement === "inside" ? frame.x + frame.width - size.width - chunkUHKFJBY5_cjs.BAR_LABEL.gap : frame.x + frame.width / 2 - size.width / 2;
|
|
5006
5358
|
return { ...size, left, top: frame.y + frame.height / 2 - size.height / 2 };
|
|
5007
5359
|
}
|
|
5008
5360
|
function createBarLabelNodes(context, target) {
|
|
5009
5361
|
const { chart } = context;
|
|
5010
5362
|
const config = chart.config;
|
|
5011
|
-
const fontSize = Math.max(8,
|
|
5012
|
-
const text =
|
|
5363
|
+
const fontSize = Math.max(8, chunkUHKFJBY5_cjs.finite(config?.barLabelFontSize, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12)));
|
|
5364
|
+
const text = chunkUHKFJBY5_cjs.formatBarLabel(target.value, config?.barLabelFormat);
|
|
5013
5365
|
if (target.placement === "axis") {
|
|
5014
5366
|
return [createAxisValueNode(context, target, text, fontSize)];
|
|
5015
5367
|
}
|
|
5016
5368
|
const pill = config?.barLabelPill === true;
|
|
5017
|
-
const size =
|
|
5369
|
+
const size = chunkUHKFJBY5_cjs.barLabelSize(text, fontSize, pill);
|
|
5018
5370
|
const placement = target.horizontal ? horizontalPlacement(target, size) : resolvePlacement(target, size);
|
|
5019
5371
|
const box = target.horizontal ? horizontalBox(target, size, placement) : {
|
|
5020
5372
|
...size,
|
|
@@ -5055,7 +5407,7 @@ function barTrackClip(context, frame) {
|
|
|
5055
5407
|
}
|
|
5056
5408
|
return {
|
|
5057
5409
|
type: "path",
|
|
5058
|
-
d:
|
|
5410
|
+
d: chunkUHKFJBY5_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, context.chart.config?.barCornerRadius ?? 2)
|
|
5059
5411
|
};
|
|
5060
5412
|
}
|
|
5061
5413
|
function barTrackEnabled(context) {
|
|
@@ -5065,8 +5417,8 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
5065
5417
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
5066
5418
|
const config = chart.config;
|
|
5067
5419
|
const radius = config?.barCornerRadius ?? 2;
|
|
5068
|
-
const segments =
|
|
5069
|
-
const d = segments > 0 ?
|
|
5420
|
+
const segments = chunkUHKFJBY5_cjs.finite(config?.barSegments, 0);
|
|
5421
|
+
const d = segments > 0 ? chunkUHKFJBY5_cjs.segmentedBarPath(frame, orientation, segments, chunkUHKFJBY5_cjs.finite(config?.barSegmentGap, 4), radius, 1, true) : chunkUHKFJBY5_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, radius);
|
|
5070
5422
|
const nodes = [
|
|
5071
5423
|
{
|
|
5072
5424
|
type: "path",
|
|
@@ -5075,7 +5427,7 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
5075
5427
|
bounds,
|
|
5076
5428
|
d,
|
|
5077
5429
|
style: {
|
|
5078
|
-
fill:
|
|
5430
|
+
fill: chunkUHKFJBY5_cjs.paint(config?.barTrackColor ?? chart.gridColor ?? "#e2e8f0", diagnostics, chart.id),
|
|
5079
5431
|
pointerEvents: "none"
|
|
5080
5432
|
}
|
|
5081
5433
|
}
|
|
@@ -5091,13 +5443,13 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
5091
5443
|
frame.y,
|
|
5092
5444
|
frame.width,
|
|
5093
5445
|
frame.height,
|
|
5094
|
-
|
|
5095
|
-
Math.max(MIN_HATCH_SPACING,
|
|
5446
|
+
chunkUHKFJBY5_cjs.finite(config.barTrackHatchAngle, DEFAULT_HATCH.angle),
|
|
5447
|
+
Math.max(MIN_HATCH_SPACING, chunkUHKFJBY5_cjs.finite(config.barTrackHatchSpacing, DEFAULT_HATCH.spacing))
|
|
5096
5448
|
),
|
|
5097
5449
|
style: {
|
|
5098
5450
|
fill: { kind: "none" },
|
|
5099
|
-
stroke:
|
|
5100
|
-
strokeWidth:
|
|
5451
|
+
stroke: chunkUHKFJBY5_cjs.paint(config.barTrackHatchColor ?? chart.gridColor ?? "#cbd5e1", diagnostics, chart.id),
|
|
5452
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(config.barTrackHatchWidth, DEFAULT_HATCH.width),
|
|
5101
5453
|
pointerEvents: "none",
|
|
5102
5454
|
clip: { type: "path", d }
|
|
5103
5455
|
}
|
|
@@ -5144,23 +5496,23 @@ function groupedShape(context, frame) {
|
|
|
5144
5496
|
const { chart, plot } = context;
|
|
5145
5497
|
const config = chart.config;
|
|
5146
5498
|
const radius = config?.barCornerRadius ?? 2;
|
|
5147
|
-
const segments =
|
|
5499
|
+
const segments = chunkUHKFJBY5_cjs.finite(config?.barSegments, 0);
|
|
5148
5500
|
if (segments > 0) {
|
|
5149
|
-
return
|
|
5501
|
+
return chunkUHKFJBY5_cjs.segmentedBarPath(
|
|
5150
5502
|
{ x: frame.x, y: plot.y, width: frame.width, height: plot.height },
|
|
5151
5503
|
"vertical",
|
|
5152
5504
|
segments,
|
|
5153
|
-
|
|
5505
|
+
chunkUHKFJBY5_cjs.finite(config?.barSegmentGap, 4),
|
|
5154
5506
|
radius,
|
|
5155
5507
|
frame.height / plot.height,
|
|
5156
5508
|
config?.barSegmentSnap !== false
|
|
5157
5509
|
);
|
|
5158
5510
|
}
|
|
5159
|
-
return
|
|
5511
|
+
return chunkUHKFJBY5_cjs.barPath(frame.x, frame.y, frame.width, frame.height, radius, config?.barRoundedBottom === true);
|
|
5160
5512
|
}
|
|
5161
5513
|
function createGroupedGlow(context, mark) {
|
|
5162
5514
|
const { chart } = context;
|
|
5163
|
-
const glow =
|
|
5515
|
+
const glow = chunkUHKFJBY5_cjs.finite(chart.config?.barGlow, 0);
|
|
5164
5516
|
if (glow <= 0 || mark.frame.height <= 0) {
|
|
5165
5517
|
return [];
|
|
5166
5518
|
}
|
|
@@ -5171,10 +5523,10 @@ function createGroupedGlow(context, mark) {
|
|
|
5171
5523
|
}
|
|
5172
5524
|
function createGroupedBarLayout(context) {
|
|
5173
5525
|
const { chart, plot } = context;
|
|
5174
|
-
const valueCount =
|
|
5526
|
+
const valueCount = chunkUHKFJBY5_cjs.barCategoryCount(chart);
|
|
5175
5527
|
const slotWidth = plot.width / valueCount;
|
|
5176
|
-
const groupGap = Math.min(Math.max(0,
|
|
5177
|
-
const barGap = Math.max(0,
|
|
5528
|
+
const groupGap = Math.min(Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
5529
|
+
const barGap = Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.barGap, 2));
|
|
5178
5530
|
return {
|
|
5179
5531
|
slotWidth,
|
|
5180
5532
|
seriesWidth: Math.max(1, (slotWidth - groupGap) / Math.max(1, chart.series.length)),
|
|
@@ -5184,10 +5536,10 @@ function createGroupedBarLayout(context) {
|
|
|
5184
5536
|
}
|
|
5185
5537
|
function createSeriesBarMarks(context, layout, series, seriesIndex) {
|
|
5186
5538
|
const { chart, plot } = context;
|
|
5187
|
-
const seriesColor2 = series.color ??
|
|
5539
|
+
const seriesColor2 = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
5188
5540
|
return series.values.map((value, valueIndex) => {
|
|
5189
5541
|
const numericValue = Array.isArray(value) ? value[1] : value;
|
|
5190
|
-
const height = Math.max(0,
|
|
5542
|
+
const height = Math.max(0, chunkUHKFJBY5_cjs.mapChartValue(numericValue, chart.axisY, plot.height));
|
|
5191
5543
|
return {
|
|
5192
5544
|
seriesId: series.id,
|
|
5193
5545
|
valueIndex,
|
|
@@ -5221,10 +5573,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
5221
5573
|
const radius = chart.config?.barCornerRadius ?? 2;
|
|
5222
5574
|
const { x, width } = mark.frame;
|
|
5223
5575
|
const path = groupedShape(context, mark.frame);
|
|
5224
|
-
const fill2 =
|
|
5225
|
-
const stroke =
|
|
5226
|
-
const strokeWidth =
|
|
5227
|
-
const shadow =
|
|
5576
|
+
const fill2 = chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5577
|
+
const stroke = chunkUHKFJBY5_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5578
|
+
const strokeWidth = chunkUHKFJBY5_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5579
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5228
5580
|
const shadowCaster = shadow ? {
|
|
5229
5581
|
type: "path",
|
|
5230
5582
|
id: `chart-bar-shadow-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
@@ -5254,10 +5606,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
5254
5606
|
valueIndex: mark.valueIndex,
|
|
5255
5607
|
mark: "bar",
|
|
5256
5608
|
radius,
|
|
5257
|
-
colorProp:
|
|
5609
|
+
colorProp: chunkUHKFJBY5_cjs.seriesValueColorProp(mark.seriesId, mark.valueIndex),
|
|
5258
5610
|
hasColorOverride: mark.hasColorOverride
|
|
5259
5611
|
},
|
|
5260
|
-
prop:
|
|
5612
|
+
prop: chunkUHKFJBY5_cjs.seriesValueProp(mark.seriesId, mark.valueIndex),
|
|
5261
5613
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
5262
5614
|
};
|
|
5263
5615
|
const glass = createGlassBackdropNodes(context, `${mark.seriesId}-${mark.valueIndex}`, path);
|
|
@@ -5268,15 +5620,15 @@ function createGroupedBarError(context, mark) {
|
|
|
5268
5620
|
return null;
|
|
5269
5621
|
}
|
|
5270
5622
|
const { chart, plot, bounds, nextOrder } = context;
|
|
5271
|
-
const [lower, upper] =
|
|
5272
|
-
return
|
|
5623
|
+
const [lower, upper] = chunkUHKFJBY5_cjs.errorBarRange(mark.value, mark.error);
|
|
5624
|
+
return chunkUHKFJBY5_cjs.createVerticalErrorWhiskerNode({
|
|
5273
5625
|
id: `chart-bar-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
5274
5626
|
order: nextOrder(),
|
|
5275
5627
|
bounds,
|
|
5276
5628
|
geometry: {
|
|
5277
5629
|
centerX: mark.frame.x + mark.frame.width / 2,
|
|
5278
|
-
startY: plot.y + plot.height -
|
|
5279
|
-
endY: plot.y + plot.height -
|
|
5630
|
+
startY: plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
5631
|
+
endY: plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
5280
5632
|
},
|
|
5281
5633
|
color: chart.textColor ?? "#0f172a",
|
|
5282
5634
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -5286,9 +5638,9 @@ function createGroupedBarError(context, mark) {
|
|
|
5286
5638
|
// src/renderScene/charts/renderers/bar/horizontal.ts
|
|
5287
5639
|
function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
5288
5640
|
const { chart, plot } = context;
|
|
5289
|
-
const top =
|
|
5641
|
+
const top = chunkUHKFJBY5_cjs.rowTop(rows, plot, valueIndex) + rows.labelRow;
|
|
5290
5642
|
if (context.stackedMode) {
|
|
5291
|
-
const segment =
|
|
5643
|
+
const segment = chunkUHKFJBY5_cjs.stackedSegment(chart, context.stackedMode, valueIndex, seriesIndex, plot.width);
|
|
5292
5644
|
const start = Math.min(segment.pixelStart, segment.pixelEnd);
|
|
5293
5645
|
return {
|
|
5294
5646
|
x: plot.x + start,
|
|
@@ -5297,27 +5649,27 @@ function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
|
5297
5649
|
height: rows.barsHeight
|
|
5298
5650
|
};
|
|
5299
5651
|
}
|
|
5300
|
-
const barGap = Math.max(0,
|
|
5652
|
+
const barGap = Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.barGap, 2));
|
|
5301
5653
|
const seriesHeight = rows.barsHeight / Math.max(1, chart.series.length);
|
|
5302
|
-
const width = Math.max(0,
|
|
5654
|
+
const width = Math.max(0, chunkUHKFJBY5_cjs.mapChartValue(value, chart.axisY, plot.width));
|
|
5303
5655
|
return { x: plot.x, y: top + seriesIndex * seriesHeight, width, height: Math.max(1, seriesHeight - barGap) };
|
|
5304
5656
|
}
|
|
5305
5657
|
function barPath2(context, frame) {
|
|
5306
5658
|
const { chart, plot } = context;
|
|
5307
5659
|
const config = chart.config;
|
|
5308
|
-
const segments = context.stackedMode && chart.series.length > 1 ? 0 :
|
|
5660
|
+
const segments = context.stackedMode && chart.series.length > 1 ? 0 : chunkUHKFJBY5_cjs.finite(config?.barSegments, 0);
|
|
5309
5661
|
if (segments > 0) {
|
|
5310
|
-
return
|
|
5662
|
+
return chunkUHKFJBY5_cjs.segmentedBarPath(
|
|
5311
5663
|
{ x: plot.x, y: frame.y, width: plot.width, height: frame.height },
|
|
5312
5664
|
"horizontal",
|
|
5313
5665
|
segments,
|
|
5314
|
-
|
|
5666
|
+
chunkUHKFJBY5_cjs.finite(config?.barSegmentGap, 4),
|
|
5315
5667
|
config?.barCornerRadius ?? 2,
|
|
5316
5668
|
frame.width / plot.width,
|
|
5317
5669
|
config?.barSegmentSnap !== false
|
|
5318
5670
|
);
|
|
5319
5671
|
}
|
|
5320
|
-
return
|
|
5672
|
+
return chunkUHKFJBY5_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, config?.barCornerRadius ?? 2);
|
|
5321
5673
|
}
|
|
5322
5674
|
function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
5323
5675
|
const { plot } = context;
|
|
@@ -5337,16 +5689,16 @@ function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
|
5337
5689
|
maxY: frame.y + frame.height
|
|
5338
5690
|
},
|
|
5339
5691
|
path: barPath2(context, frame),
|
|
5340
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5692
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length]
|
|
5341
5693
|
};
|
|
5342
5694
|
}
|
|
5343
5695
|
function barNodes(context, mark) {
|
|
5344
5696
|
const { chart, diagnostics, nextOrder } = context;
|
|
5345
5697
|
const config = chart.config;
|
|
5346
|
-
const stroke =
|
|
5347
|
-
const strokeWidth =
|
|
5348
|
-
const shadow =
|
|
5349
|
-
const fill2 =
|
|
5698
|
+
const stroke = chunkUHKFJBY5_cjs.paint(config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5699
|
+
const strokeWidth = chunkUHKFJBY5_cjs.finite(config?.barBorderWidth, 0);
|
|
5700
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5701
|
+
const fill2 = chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5350
5702
|
const nodes = [...createGlassBackdropNodes(context, mark.id, mark.path)];
|
|
5351
5703
|
if (shadow) {
|
|
5352
5704
|
nodes.push({
|
|
@@ -5370,7 +5722,7 @@ function barNodes(context, mark) {
|
|
|
5370
5722
|
valueIndex: mark.valueIndex,
|
|
5371
5723
|
mark: "bar",
|
|
5372
5724
|
radius: config?.barCornerRadius ?? 2,
|
|
5373
|
-
colorProp:
|
|
5725
|
+
colorProp: chunkUHKFJBY5_cjs.seriesValueColorProp(mark.series.id, mark.valueIndex),
|
|
5374
5726
|
hasColorOverride: mark.series.colors?.[mark.valueIndex] != null
|
|
5375
5727
|
},
|
|
5376
5728
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
@@ -5400,7 +5752,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
5400
5752
|
layers.tracks.push(...createBarTrackNodes(context, mark.id, mark.trackFrame, "horizontal"));
|
|
5401
5753
|
}
|
|
5402
5754
|
layers.bars.push(...barNodes(context, mark));
|
|
5403
|
-
const glow =
|
|
5755
|
+
const glow = chunkUHKFJBY5_cjs.finite(chart.config?.barGlow, 0);
|
|
5404
5756
|
if (glow > 0 && mark.frame.width > 0) {
|
|
5405
5757
|
layers.glows.push(
|
|
5406
5758
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${mark.id}`, mark.path, mark.color, glow, mark.bounds)
|
|
@@ -5409,7 +5761,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
5409
5761
|
layers.labels.push(...labelNodes2(context, mark, highest));
|
|
5410
5762
|
}
|
|
5411
5763
|
function renderHorizontalBars(context) {
|
|
5412
|
-
const rows =
|
|
5764
|
+
const rows = chunkUHKFJBY5_cjs.horizontalRows(context.chart, context.plot);
|
|
5413
5765
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
5414
5766
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
5415
5767
|
const numeric = series.values.map((value) => typeof value === "number" ? value : value[1]);
|
|
@@ -5424,8 +5776,8 @@ function renderHorizontalBars(context) {
|
|
|
5424
5776
|
// src/renderScene/charts/renderers/bar/stacked.ts
|
|
5425
5777
|
function slotOf(context, mode) {
|
|
5426
5778
|
const { chart, plot } = context;
|
|
5427
|
-
const slotWidth = plot.width /
|
|
5428
|
-
const groupGap = Math.min(Math.max(0,
|
|
5779
|
+
const slotWidth = plot.width / chunkUHKFJBY5_cjs.barCategoryCount(chart);
|
|
5780
|
+
const groupGap = Math.min(Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
5429
5781
|
return {
|
|
5430
5782
|
slotWidth,
|
|
5431
5783
|
groupGap,
|
|
@@ -5436,19 +5788,19 @@ function slotOf(context, mode) {
|
|
|
5436
5788
|
}
|
|
5437
5789
|
function pathOf(context, x, y, height, slot, radius) {
|
|
5438
5790
|
const { chart, plot } = context;
|
|
5439
|
-
const segments = chart.series.length === 1 ?
|
|
5791
|
+
const segments = chart.series.length === 1 ? chunkUHKFJBY5_cjs.finite(chart.config?.barSegments, 0) : 0;
|
|
5440
5792
|
if (segments > 0) {
|
|
5441
|
-
return
|
|
5793
|
+
return chunkUHKFJBY5_cjs.segmentedBarPath(
|
|
5442
5794
|
{ x, y: plot.y, width: slot.barWidth, height: plot.height },
|
|
5443
5795
|
"vertical",
|
|
5444
5796
|
segments,
|
|
5445
|
-
|
|
5797
|
+
chunkUHKFJBY5_cjs.finite(chart.config?.barSegmentGap, 4),
|
|
5446
5798
|
radius,
|
|
5447
5799
|
height / plot.height,
|
|
5448
5800
|
chart.config?.barSegmentSnap !== false
|
|
5449
5801
|
);
|
|
5450
5802
|
}
|
|
5451
|
-
return
|
|
5803
|
+
return chunkUHKFJBY5_cjs.barPath(x, y, slot.barWidth, height, radius, chart.config?.barRoundedBottom === true);
|
|
5452
5804
|
}
|
|
5453
5805
|
function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame) {
|
|
5454
5806
|
const { chart } = context;
|
|
@@ -5470,7 +5822,7 @@ function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame
|
|
|
5470
5822
|
}
|
|
5471
5823
|
function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
5472
5824
|
const { chart, plot } = context;
|
|
5473
|
-
const segment =
|
|
5825
|
+
const segment = chunkUHKFJBY5_cjs.stackedSegment(chart, mode, valueIndex, seriesIndex, plot.height);
|
|
5474
5826
|
const radius = slot.outerSeriesIndex === null || seriesIndex === slot.outerSeriesIndex ? slot.cornerRadius : 0;
|
|
5475
5827
|
const x = plot.x + valueIndex * slot.slotWidth + slot.groupGap / 2;
|
|
5476
5828
|
const y = plot.y + plot.height - Math.max(segment.pixelStart, segment.pixelEnd);
|
|
@@ -5479,7 +5831,7 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
5479
5831
|
series,
|
|
5480
5832
|
valueIndex,
|
|
5481
5833
|
radius,
|
|
5482
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5834
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length],
|
|
5483
5835
|
x,
|
|
5484
5836
|
y,
|
|
5485
5837
|
height,
|
|
@@ -5490,10 +5842,10 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
5490
5842
|
function segmentNodes(context, mark) {
|
|
5491
5843
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
5492
5844
|
const { series, valueIndex, path } = mark;
|
|
5493
|
-
const fill2 =
|
|
5494
|
-
const stroke =
|
|
5495
|
-
const strokeWidth =
|
|
5496
|
-
const shadow =
|
|
5845
|
+
const fill2 = chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5846
|
+
const stroke = chunkUHKFJBY5_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5847
|
+
const strokeWidth = chunkUHKFJBY5_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5848
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5497
5849
|
const nodes = [];
|
|
5498
5850
|
if (shadow) {
|
|
5499
5851
|
const plotClip = `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z`;
|
|
@@ -5525,10 +5877,10 @@ function segmentNodes(context, mark) {
|
|
|
5525
5877
|
valueIndex,
|
|
5526
5878
|
mark: "bar",
|
|
5527
5879
|
radius: mark.radius,
|
|
5528
|
-
colorProp:
|
|
5880
|
+
colorProp: chunkUHKFJBY5_cjs.seriesValueColorProp(series.id, valueIndex),
|
|
5529
5881
|
hasColorOverride: series.colors?.[valueIndex] != null
|
|
5530
5882
|
},
|
|
5531
|
-
prop:
|
|
5883
|
+
prop: chunkUHKFJBY5_cjs.seriesValueProp(series.id, valueIndex),
|
|
5532
5884
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
5533
5885
|
});
|
|
5534
5886
|
return nodes;
|
|
@@ -5542,7 +5894,7 @@ function pushSegment(context, mode, layers, slot, series, seriesIndex, valueInde
|
|
|
5542
5894
|
layers.bars.push(...segmentNodes(context, mark));
|
|
5543
5895
|
const frame = { x: mark.x, y: mark.y, width: slot.barWidth, height: mark.height };
|
|
5544
5896
|
pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame);
|
|
5545
|
-
const glow =
|
|
5897
|
+
const glow = chunkUHKFJBY5_cjs.finite(chart.config?.barGlow, 0);
|
|
5546
5898
|
if (glow > 0) {
|
|
5547
5899
|
layers.glows.push(
|
|
5548
5900
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${series.id}-${valueIndex}`, mark.path, mark.color, glow)
|
|
@@ -5553,7 +5905,7 @@ function renderStackedBars(context, mode) {
|
|
|
5553
5905
|
const { chart } = context;
|
|
5554
5906
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
5555
5907
|
const slot = slotOf(context, mode);
|
|
5556
|
-
const valueCount =
|
|
5908
|
+
const valueCount = chunkUHKFJBY5_cjs.barCategoryCount(chart);
|
|
5557
5909
|
for (let valueIndex = 0; valueIndex < valueCount; valueIndex++) {
|
|
5558
5910
|
chart.series.forEach((series, seriesIndex) => {
|
|
5559
5911
|
pushSegment(context, mode, layers, slot, series, seriesIndex, valueIndex);
|
|
@@ -5568,7 +5920,7 @@ function isSeriesMax2(values, index) {
|
|
|
5568
5920
|
|
|
5569
5921
|
// src/renderScene/charts/renderers/bar.ts
|
|
5570
5922
|
function renderBar(context) {
|
|
5571
|
-
if (
|
|
5923
|
+
if (chunkUHKFJBY5_cjs.isHorizontalBar(context.chart)) {
|
|
5572
5924
|
return renderHorizontalBars(context);
|
|
5573
5925
|
}
|
|
5574
5926
|
if (context.stackedMode) {
|
|
@@ -5583,7 +5935,7 @@ function createBoxplotLayout(context) {
|
|
|
5583
5935
|
const orientation = chart.config?.orientation ?? "vertical";
|
|
5584
5936
|
const boxCount = Math.max(1, chart.series.length);
|
|
5585
5937
|
const slotWidth = (orientation === "horizontal" ? plot.height : plot.width) / boxCount;
|
|
5586
|
-
const borderColor =
|
|
5938
|
+
const borderColor = chunkUHKFJBY5_cjs.representativeColor(chart.config?.barBorderColor, "#000000");
|
|
5587
5939
|
const widthFraction = Math.min(1, Math.max(0.05, chart.config?.boxWidth ?? 0.6));
|
|
5588
5940
|
return {
|
|
5589
5941
|
orientation,
|
|
@@ -5592,15 +5944,15 @@ function createBoxplotLayout(context) {
|
|
|
5592
5944
|
cornerRadius: chart.config?.barCornerRadius ?? 2,
|
|
5593
5945
|
showPoints: chart.config?.showBoxplotPoints ?? true,
|
|
5594
5946
|
borderColor,
|
|
5595
|
-
borderWidth:
|
|
5596
|
-
whiskerWidth: Math.max(0,
|
|
5597
|
-
medianWidth: Math.max(0,
|
|
5947
|
+
borderWidth: chunkUHKFJBY5_cjs.finite(chart.config?.barBorderWidth, 1),
|
|
5948
|
+
whiskerWidth: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.boxWhiskerWidth, 1)),
|
|
5949
|
+
medianWidth: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.boxMedianWidth, 2)),
|
|
5598
5950
|
medianColor: chart.config?.boxMedianColor ?? borderColor,
|
|
5599
5951
|
whiskerColor: chart.config?.boxWhiskerColor,
|
|
5600
|
-
capSize: Math.max(0,
|
|
5601
|
-
pointSize: Math.max(0,
|
|
5602
|
-
pointOpacity: Math.min(1, Math.max(0,
|
|
5603
|
-
jitter: Math.max(0,
|
|
5952
|
+
capSize: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.boxCapSize, 0.4)),
|
|
5953
|
+
pointSize: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.boxPointSize, 3)),
|
|
5954
|
+
pointOpacity: Math.min(1, Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.boxPointOpacity, 0.7))),
|
|
5955
|
+
jitter: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.boxJitter, 1))
|
|
5604
5956
|
};
|
|
5605
5957
|
}
|
|
5606
5958
|
|
|
@@ -5611,7 +5963,7 @@ function boxplotPoint(orientation, center, value) {
|
|
|
5611
5963
|
function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
5612
5964
|
const { chart, plot } = context;
|
|
5613
5965
|
const { orientation } = layout;
|
|
5614
|
-
const valueAt = (value) => orientation === "horizontal" ? plot.x +
|
|
5966
|
+
const valueAt = (value) => orientation === "horizontal" ? plot.x + chunkUHKFJBY5_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
5615
5967
|
const center = plot[orientation === "horizontal" ? "y" : "x"] + seriesIndex * layout.slotWidth + layout.slotWidth / 2;
|
|
5616
5968
|
return {
|
|
5617
5969
|
center,
|
|
@@ -5626,7 +5978,7 @@ function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
|
5626
5978
|
// src/renderScene/charts/renderers/boxplot/points.ts
|
|
5627
5979
|
function renderSamplePoints(context, layout, mark) {
|
|
5628
5980
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
5629
|
-
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x +
|
|
5981
|
+
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x + chunkUHKFJBY5_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
5630
5982
|
if (layout.pointSize <= 0) {
|
|
5631
5983
|
return [];
|
|
5632
5984
|
}
|
|
@@ -5642,7 +5994,7 @@ function renderSamplePoints(context, layout, mark) {
|
|
|
5642
5994
|
cy: y,
|
|
5643
5995
|
rx: layout.pointSize,
|
|
5644
5996
|
ry: layout.pointSize,
|
|
5645
|
-
style: { fill:
|
|
5997
|
+
style: { fill: chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id), opacity: layout.pointOpacity }
|
|
5646
5998
|
};
|
|
5647
5999
|
});
|
|
5648
6000
|
}
|
|
@@ -5666,7 +6018,7 @@ function renderBoxAndWhiskers(context, layout, mark) {
|
|
|
5666
6018
|
}
|
|
5667
6019
|
function whiskerColor(layout, mark) {
|
|
5668
6020
|
if (layout.whiskerColor === "series") {
|
|
5669
|
-
return
|
|
6021
|
+
return chunkUHKFJBY5_cjs.representativeColor(mark.color, layout.borderColor);
|
|
5670
6022
|
}
|
|
5671
6023
|
return layout.whiskerColor;
|
|
5672
6024
|
}
|
|
@@ -5748,7 +6100,7 @@ function createBoxNode(context, layout, mark) {
|
|
|
5748
6100
|
height,
|
|
5749
6101
|
rx: layout.cornerRadius,
|
|
5750
6102
|
style: {
|
|
5751
|
-
fill:
|
|
6103
|
+
fill: chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id),
|
|
5752
6104
|
stroke: { kind: "solid", color: layout.borderColor },
|
|
5753
6105
|
strokeWidth: layout.borderWidth
|
|
5754
6106
|
}
|
|
@@ -5757,12 +6109,12 @@ function createBoxNode(context, layout, mark) {
|
|
|
5757
6109
|
|
|
5758
6110
|
// src/renderScene/charts/renderers/boxplot/series.ts
|
|
5759
6111
|
function renderBoxplotSeries(context, layout, series, seriesIndex) {
|
|
5760
|
-
const stats =
|
|
6112
|
+
const stats = chunkUHKFJBY5_cjs.computeBoxplotStats(series.values);
|
|
5761
6113
|
if (!stats) {
|
|
5762
6114
|
return [];
|
|
5763
6115
|
}
|
|
5764
6116
|
const geometry = createBoxplotGeometry(context, layout, seriesIndex, stats);
|
|
5765
|
-
const color = series.color ??
|
|
6117
|
+
const color = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
5766
6118
|
const mark = {
|
|
5767
6119
|
id: `${context.chart.id}-${series.id}`,
|
|
5768
6120
|
series,
|
|
@@ -5824,21 +6176,21 @@ function metricComponent(chart, point) {
|
|
|
5824
6176
|
}
|
|
5825
6177
|
function customPointPosition(context, value) {
|
|
5826
6178
|
return {
|
|
5827
|
-
x: context.plot.x +
|
|
5828
|
-
y: context.plot.y + context.plot.height -
|
|
6179
|
+
x: context.plot.x + chunkUHKFJBY5_cjs.mapChartValue(value[0], context.chart.axisX, context.plot.width),
|
|
6180
|
+
y: context.plot.y + context.plot.height - chunkUHKFJBY5_cjs.mapChartValue(value[1], context.chart.axisY, context.plot.height)
|
|
5829
6181
|
};
|
|
5830
6182
|
}
|
|
5831
6183
|
function customSeriesStyle(context, series, seriesIndex) {
|
|
5832
|
-
const color = series.color ??
|
|
6184
|
+
const color = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
5833
6185
|
return {
|
|
5834
|
-
fill:
|
|
6186
|
+
fill: chunkUHKFJBY5_cjs.paint(color, context.diagnostics, context.chart.id),
|
|
5835
6187
|
stroke: series.stroke ? { kind: "solid", color: series.stroke } : void 0,
|
|
5836
|
-
strokeWidth: series.stroke ?
|
|
6188
|
+
strokeWidth: series.stroke ? chunkUHKFJBY5_cjs.finite(series.strokeWidth, 1) : void 0
|
|
5837
6189
|
};
|
|
5838
6190
|
}
|
|
5839
6191
|
function createCustomSymbolMark(context, mark) {
|
|
5840
6192
|
const symbol = mark.series.symbol;
|
|
5841
|
-
const size =
|
|
6193
|
+
const size = chunkUHKFJBY5_cjs.finite(mark.series.size, 3);
|
|
5842
6194
|
const scale = symbol?.normalized ? size * 2 : 1;
|
|
5843
6195
|
const offset = symbol?.normalized ? 0.5 : 0;
|
|
5844
6196
|
const points = (symbol?.points ?? []).map(([x, y]) => ({
|
|
@@ -5850,12 +6202,12 @@ function createCustomSymbolMark(context, mark) {
|
|
|
5850
6202
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
5851
6203
|
order: context.nextOrder(),
|
|
5852
6204
|
bounds: context.bounds,
|
|
5853
|
-
d:
|
|
6205
|
+
d: chunkUHKFJBY5_cjs.freeformPathData({ points, tension: chunkUHKFJBY5_cjs.finite(symbol?.tension, 0), closed: true }),
|
|
5854
6206
|
style: mark.style
|
|
5855
6207
|
};
|
|
5856
6208
|
}
|
|
5857
6209
|
function createCustomPointMark(context, mark) {
|
|
5858
|
-
const radius =
|
|
6210
|
+
const radius = chunkUHKFJBY5_cjs.finite(mark.series.size, 3);
|
|
5859
6211
|
return {
|
|
5860
6212
|
type: "ellipse",
|
|
5861
6213
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
@@ -5879,7 +6231,7 @@ function renderConnectedPairs(context) {
|
|
|
5879
6231
|
const zones = chart.config?.zones ?? [];
|
|
5880
6232
|
const betterColor = zones[0]?.color ?? "#10b981";
|
|
5881
6233
|
const worseColor = zones[1]?.color ?? "#ec4899";
|
|
5882
|
-
const tieColor = zones[2]?.color ??
|
|
6234
|
+
const tieColor = zones[2]?.color ?? chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL;
|
|
5883
6235
|
const reverse = Boolean(chart.config?.reverseComparison);
|
|
5884
6236
|
const count = Math.min(beforeValues.length, afterValues.length);
|
|
5885
6237
|
const categories = chart.config?.categories ?? [];
|
|
@@ -5894,7 +6246,7 @@ function renderConnectedPairs(context) {
|
|
|
5894
6246
|
const better = reverse ? afterMetric < beforeMetric : afterMetric > beforeMetric;
|
|
5895
6247
|
const worse = reverse ? afterMetric > beforeMetric : afterMetric < beforeMetric;
|
|
5896
6248
|
const comparisonColor = better ? betterColor : worse ? worseColor : tieColor;
|
|
5897
|
-
const radius =
|
|
6249
|
+
const radius = chunkUHKFJBY5_cjs.finite(afterSeries.size, 3);
|
|
5898
6250
|
nodes.push(createConnectorLine(context, index, beforePoint, afterPoint, comparisonColor));
|
|
5899
6251
|
nodes.push(
|
|
5900
6252
|
createCustomPointMark(context, {
|
|
@@ -5902,9 +6254,9 @@ function renderConnectedPairs(context) {
|
|
|
5902
6254
|
valueIndex: index,
|
|
5903
6255
|
point: beforePoint,
|
|
5904
6256
|
style: {
|
|
5905
|
-
fill:
|
|
6257
|
+
fill: chunkUHKFJBY5_cjs.paint(chart.config?.customBeforeFill ?? chart.gridColor ?? "#e2e8f0", context.diagnostics, chart.id),
|
|
5906
6258
|
stroke: { kind: "solid", color: chart.config?.customBeforeStroke ?? HOLLOW_POINT_STROKE },
|
|
5907
|
-
strokeWidth:
|
|
6259
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.config?.customBeforeStrokeWidth, 1.5)
|
|
5908
6260
|
}
|
|
5909
6261
|
})
|
|
5910
6262
|
);
|
|
@@ -5914,7 +6266,7 @@ function renderConnectedPairs(context) {
|
|
|
5914
6266
|
valueIndex: index,
|
|
5915
6267
|
point: afterPoint,
|
|
5916
6268
|
style: {
|
|
5917
|
-
fill:
|
|
6269
|
+
fill: chunkUHKFJBY5_cjs.paint(comparisonColor, context.diagnostics, chart.id),
|
|
5918
6270
|
stroke: void 0,
|
|
5919
6271
|
strokeWidth: void 0
|
|
5920
6272
|
}
|
|
@@ -5941,7 +6293,7 @@ function createConnectorLine(context, index, from, to, color) {
|
|
|
5941
6293
|
style: {
|
|
5942
6294
|
fill: { kind: "none" },
|
|
5943
6295
|
stroke: { kind: "solid", color },
|
|
5944
|
-
strokeWidth:
|
|
6296
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.config?.customConnectorWidth, 2),
|
|
5945
6297
|
opacity: chart.config?.customConnectorOpacity,
|
|
5946
6298
|
dash: connectorDash(chart.config?.customConnectorDash)
|
|
5947
6299
|
}
|
|
@@ -5962,7 +6314,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
5962
6314
|
height: 16
|
|
5963
6315
|
};
|
|
5964
6316
|
return {
|
|
5965
|
-
...
|
|
6317
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
5966
6318
|
id: `chart-custom-label-${chart.id}-${index}`,
|
|
5967
6319
|
order: nextOrder(),
|
|
5968
6320
|
bounds,
|
|
@@ -5971,7 +6323,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
5971
6323
|
chart,
|
|
5972
6324
|
align: horizontal ? "left" : "center"
|
|
5973
6325
|
}),
|
|
5974
|
-
fontSize: Math.max(6,
|
|
6326
|
+
fontSize: Math.max(6, chunkUHKFJBY5_cjs.finite(chart.config?.customLabelSize, Math.max(9, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
5975
6327
|
...chart.config?.customLabelColor ? { color: chart.config.customLabelColor } : {}
|
|
5976
6328
|
};
|
|
5977
6329
|
}
|
|
@@ -5983,8 +6335,8 @@ function classifyFieldData(context) {
|
|
|
5983
6335
|
const vectorSeries = chart.series.filter((series) => tupleSize(series.values[0]) === 4);
|
|
5984
6336
|
const scalarSamples = scalarSeries.flatMap(
|
|
5985
6337
|
(series) => series.values.map(([x, y, value]) => ({
|
|
5986
|
-
x:
|
|
5987
|
-
y: plot.height -
|
|
6338
|
+
x: chunkUHKFJBY5_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
6339
|
+
y: plot.height - chunkUHKFJBY5_cjs.mapChartValue(y, chart.axisY, plot.height),
|
|
5988
6340
|
value
|
|
5989
6341
|
}))
|
|
5990
6342
|
);
|
|
@@ -6048,20 +6400,20 @@ function createLegendLabels(context, minimum, maximum, geometry) {
|
|
|
6048
6400
|
const { chart, bounds, nextOrder } = context;
|
|
6049
6401
|
const y = geometry.y + geometry.height + 3;
|
|
6050
6402
|
return [
|
|
6051
|
-
|
|
6403
|
+
chunkUHKFJBY5_cjs.chartText({
|
|
6052
6404
|
id: `chart-field-colorbar-min-${chart.id}`,
|
|
6053
6405
|
order: nextOrder(),
|
|
6054
6406
|
bounds,
|
|
6055
6407
|
frame: { x: geometry.x, y, width: 80, height: 16 },
|
|
6056
|
-
text:
|
|
6408
|
+
text: chunkUHKFJBY5_cjs.formatFieldValue(minimum),
|
|
6057
6409
|
chart
|
|
6058
6410
|
}),
|
|
6059
|
-
|
|
6411
|
+
chunkUHKFJBY5_cjs.chartText({
|
|
6060
6412
|
id: `chart-field-colorbar-max-${chart.id}`,
|
|
6061
6413
|
order: nextOrder(),
|
|
6062
6414
|
bounds,
|
|
6063
6415
|
frame: { x: geometry.x + geometry.width - 80, y, width: 80, height: 16 },
|
|
6064
|
-
text:
|
|
6416
|
+
text: chunkUHKFJBY5_cjs.formatFieldValue(maximum),
|
|
6065
6417
|
chart,
|
|
6066
6418
|
align: "right"
|
|
6067
6419
|
})
|
|
@@ -6074,7 +6426,7 @@ function colorAtRamp(ramp, value) {
|
|
|
6074
6426
|
if (!ramp?.stops.length) {
|
|
6075
6427
|
return RAMP_FALLBACK_COLOR;
|
|
6076
6428
|
}
|
|
6077
|
-
return
|
|
6429
|
+
return chunkUHKFJBY5_cjs.interpolateHexColorStops(ramp.stops, value);
|
|
6078
6430
|
}
|
|
6079
6431
|
|
|
6080
6432
|
// src/renderScene/charts/field/isolines.ts
|
|
@@ -6284,7 +6636,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
6284
6636
|
}
|
|
6285
6637
|
const chains = stitchIsolineSegments(segments);
|
|
6286
6638
|
const path = chains.map(
|
|
6287
|
-
(chain) =>
|
|
6639
|
+
(chain) => chunkUHKFJBY5_cjs.linePathData(
|
|
6288
6640
|
chain.map(([x, y]) => ({ x: plot.x + x, y: plot.y + y })),
|
|
6289
6641
|
ISOLINE_TENSION
|
|
6290
6642
|
)
|
|
@@ -6308,7 +6660,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
6308
6660
|
function renderVectorField(context, seriesList) {
|
|
6309
6661
|
const nodes = [];
|
|
6310
6662
|
seriesList.forEach((series, seriesIndex) => {
|
|
6311
|
-
const color = series.color ??
|
|
6663
|
+
const color = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
6312
6664
|
series.values.forEach((vector, vectorIndex) => {
|
|
6313
6665
|
nodes.push(createVectorNode(context, series.id, vector, vectorIndex, color));
|
|
6314
6666
|
});
|
|
@@ -6318,10 +6670,10 @@ function renderVectorField(context, seriesList) {
|
|
|
6318
6670
|
function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
6319
6671
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
6320
6672
|
const [x, y, angle, magnitude] = vector;
|
|
6321
|
-
const startX = plot.x +
|
|
6322
|
-
const startY = plot.y + plot.height -
|
|
6323
|
-
const endX = plot.x +
|
|
6324
|
-
const endY = plot.y + plot.height -
|
|
6673
|
+
const startX = plot.x + chunkUHKFJBY5_cjs.mapChartValue(x, chart.axisX, plot.width);
|
|
6674
|
+
const startY = plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(y, chart.axisY, plot.height);
|
|
6675
|
+
const endX = plot.x + chunkUHKFJBY5_cjs.mapChartValue(x + Math.cos(angle) * magnitude, chart.axisX, plot.width);
|
|
6676
|
+
const endY = plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(y + Math.sin(angle) * magnitude, chart.axisY, plot.height);
|
|
6325
6677
|
return {
|
|
6326
6678
|
type: "path",
|
|
6327
6679
|
id: `chart-field-vector-${chart.id}-${seriesId}-${vectorIndex}`,
|
|
@@ -6331,7 +6683,7 @@ function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
|
6331
6683
|
markerEnd: "filled_arrow",
|
|
6332
6684
|
style: {
|
|
6333
6685
|
fill: { kind: "none" },
|
|
6334
|
-
stroke:
|
|
6686
|
+
stroke: chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id),
|
|
6335
6687
|
strokeWidth: 2
|
|
6336
6688
|
}
|
|
6337
6689
|
};
|
|
@@ -6378,7 +6730,7 @@ function createHeatmapCell(layout, series, rowIndex, columnIndex) {
|
|
|
6378
6730
|
};
|
|
6379
6731
|
}
|
|
6380
6732
|
function colorForValue(value, layout) {
|
|
6381
|
-
return
|
|
6733
|
+
return chunkUHKFJBY5_cjs.zoneColorAtValue(value, layout.bands, layout.zones);
|
|
6382
6734
|
}
|
|
6383
6735
|
function renderHeatmapCell(context, layout, cell) {
|
|
6384
6736
|
const background = createCellBackground(context, layout, cell);
|
|
@@ -6393,7 +6745,7 @@ function createCellBackground(context, layout, cell) {
|
|
|
6393
6745
|
const style = {
|
|
6394
6746
|
fill: { kind: "solid", color: cell.color },
|
|
6395
6747
|
stroke: { kind: "solid", color: chart.config?.cellStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
6396
|
-
strokeWidth:
|
|
6748
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.config?.cellStrokeWidth, chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1))
|
|
6397
6749
|
};
|
|
6398
6750
|
if (chart.config?.cellShape === "circle") {
|
|
6399
6751
|
return {
|
|
@@ -6420,9 +6772,9 @@ function createCellBackground(context, layout, cell) {
|
|
|
6420
6772
|
}
|
|
6421
6773
|
function createCellValueLabel(context, layout, cell) {
|
|
6422
6774
|
const { chart, bounds, nextOrder } = context;
|
|
6423
|
-
const size = Math.max(6,
|
|
6775
|
+
const size = Math.max(6, chunkUHKFJBY5_cjs.finite(chart.config?.cellValueSize, layout.fontSize));
|
|
6424
6776
|
return {
|
|
6425
|
-
...
|
|
6777
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
6426
6778
|
id: `chart-heatmap-value-${chart.id}-${cell.seriesId}-${cell.columnIndex}`,
|
|
6427
6779
|
order: nextOrder(),
|
|
6428
6780
|
bounds,
|
|
@@ -6437,7 +6789,7 @@ function createCellValueLabel(context, layout, cell) {
|
|
|
6437
6789
|
align: "center"
|
|
6438
6790
|
}),
|
|
6439
6791
|
...chart.config?.cellValueSize === void 0 ? {} : { fontSize: size },
|
|
6440
|
-
color: chart.config?.cellValueColor ??
|
|
6792
|
+
color: chart.config?.cellValueColor ?? chunkUHKFJBY5_cjs.contrastTextColor(cell.color)
|
|
6441
6793
|
};
|
|
6442
6794
|
}
|
|
6443
6795
|
|
|
@@ -6450,9 +6802,9 @@ function createHeatmapLayout(context) {
|
|
|
6450
6802
|
return {
|
|
6451
6803
|
rows: chart.series,
|
|
6452
6804
|
columns,
|
|
6453
|
-
bands:
|
|
6454
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
6455
|
-
fontSize: Math.max(9,
|
|
6805
|
+
bands: chunkUHKFJBY5_cjs.axisBands(chart.axisY),
|
|
6806
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkUHKFJBY5_cjs.DEFAULT_HEATMAP_ZONES,
|
|
6807
|
+
fontSize: Math.max(9, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12)),
|
|
6456
6808
|
headerFontSize: headerFontSize(chart),
|
|
6457
6809
|
legendGap: legendGap(chart),
|
|
6458
6810
|
sides,
|
|
@@ -6460,10 +6812,10 @@ function createHeatmapLayout(context) {
|
|
|
6460
6812
|
grid: createHeatmapGrid(context, reservedSpace, sides, columns.length)
|
|
6461
6813
|
};
|
|
6462
6814
|
}
|
|
6463
|
-
var headerFontSize = (chart) => Math.max(9,
|
|
6464
|
-
var rowGap = (chart) => Math.min(120, Math.max(0,
|
|
6465
|
-
var columnGap = (chart) => Math.min(120, Math.max(0,
|
|
6466
|
-
var legendGap = (chart) => Math.min(80, Math.max(0,
|
|
6815
|
+
var headerFontSize = (chart) => Math.max(9, chunkUHKFJBY5_cjs.finite(chart.axisFontSize ?? chart.fontSize, 12));
|
|
6816
|
+
var rowGap = (chart) => Math.min(120, Math.max(0, chunkUHKFJBY5_cjs.finite(chart.yLabelGap, 6)));
|
|
6817
|
+
var columnGap = (chart) => Math.min(120, Math.max(0, chunkUHKFJBY5_cjs.finite(chart.xLabelGap, 4)));
|
|
6818
|
+
var legendGap = (chart) => Math.min(80, Math.max(0, chunkUHKFJBY5_cjs.finite(chart.legendGap, 6)));
|
|
6467
6819
|
function heatmapSides(context) {
|
|
6468
6820
|
const { chart } = context;
|
|
6469
6821
|
return {
|
|
@@ -6482,7 +6834,7 @@ function heatmapReservedSpace(context, sides) {
|
|
|
6482
6834
|
const { chart } = context;
|
|
6483
6835
|
const fontSize = headerFontSize(chart);
|
|
6484
6836
|
const longestLabel = chart.series.reduce(
|
|
6485
|
-
(max, series) => Math.max(max,
|
|
6837
|
+
(max, series) => Math.max(max, chunkUHKFJBY5_cjs.estimateTextWidth(series.label ?? "", fontSize, false)),
|
|
6486
6838
|
0
|
|
6487
6839
|
);
|
|
6488
6840
|
const vertical = sides.legend === "left" || sides.legend === "right";
|
|
@@ -6498,8 +6850,8 @@ function heatmapReservedSpace(context, sides) {
|
|
|
6498
6850
|
}
|
|
6499
6851
|
function columnHeaderRoom(context) {
|
|
6500
6852
|
const { chart } = context;
|
|
6501
|
-
const tilt =
|
|
6502
|
-
return tilt > 0 ? Math.min(context.plot.height * 0.4,
|
|
6853
|
+
const tilt = chunkUHKFJBY5_cjs.labelTilt(chart);
|
|
6854
|
+
return tilt > 0 ? Math.min(context.plot.height * 0.4, chunkUHKFJBY5_cjs.tiltedLabelRoom(chart, heatmapColumns(context), tilt) + columnGap(chart) + 4) : headerFontSize(chart) + 2 + columnGap(chart) + 6;
|
|
6503
6855
|
}
|
|
6504
6856
|
function createHeatmapGrid(context, reservedSpace, sides, columnCount) {
|
|
6505
6857
|
const { chart } = context;
|
|
@@ -6510,7 +6862,7 @@ function createHeatmapGrid(context, reservedSpace, sides, columnCount) {
|
|
|
6510
6862
|
const width = Math.max(1, context.plot.width - left - right);
|
|
6511
6863
|
const height = Math.max(1, context.plot.height - top - bottom);
|
|
6512
6864
|
const rowCount = chart.series.length;
|
|
6513
|
-
const cellGap = Math.max(0,
|
|
6865
|
+
const cellGap = Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.cellGap, 0));
|
|
6514
6866
|
let cellWidth = columnCount ? width / columnCount : width;
|
|
6515
6867
|
let cellHeight = rowCount ? height / rowCount : height;
|
|
6516
6868
|
let gridWidth = width;
|
|
@@ -6530,7 +6882,7 @@ function createHeatmapGrid(context, reservedSpace, sides, columnCount) {
|
|
|
6530
6882
|
cellWidth,
|
|
6531
6883
|
cellHeight,
|
|
6532
6884
|
cellGap,
|
|
6533
|
-
cellRadius: Math.max(0,
|
|
6885
|
+
cellRadius: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.barCornerRadius, cellGap))
|
|
6534
6886
|
};
|
|
6535
6887
|
}
|
|
6536
6888
|
|
|
@@ -6549,7 +6901,7 @@ function createRowHeader(context, layout, series, rowIndex) {
|
|
|
6549
6901
|
const room = layout.reservedSpace.rowHeaders;
|
|
6550
6902
|
const gap = rowGap(chart);
|
|
6551
6903
|
const x = layout.sides.rows === "left" ? layout.grid.x - room : layout.grid.x + layout.grid.width + gap;
|
|
6552
|
-
return
|
|
6904
|
+
return chunkUHKFJBY5_cjs.chartText({
|
|
6553
6905
|
id: `chart-heatmap-row-${chart.id}-${series.id}`,
|
|
6554
6906
|
order: nextOrder(),
|
|
6555
6907
|
bounds,
|
|
@@ -6575,12 +6927,12 @@ function createColumnHeader(context, layout, label, columnIndex) {
|
|
|
6575
6927
|
const { chart, bounds, nextOrder } = context;
|
|
6576
6928
|
const above = layout.sides.columns === "top";
|
|
6577
6929
|
const centerX = layout.grid.x + (columnIndex + 0.5) * layout.grid.cellWidth;
|
|
6578
|
-
const tilt =
|
|
6930
|
+
const tilt = chunkUHKFJBY5_cjs.labelTilt(chart);
|
|
6579
6931
|
const gap = columnGap(chart);
|
|
6580
6932
|
const id = `chart-heatmap-col-${chart.id}-${columnIndex}`;
|
|
6581
6933
|
if (tilt > 0) {
|
|
6582
|
-
const { frame, rotation } = above ?
|
|
6583
|
-
return
|
|
6934
|
+
const { frame, rotation } = above ? chunkUHKFJBY5_cjs.labelAboveFrame(chart, label, tilt, { x: centerX, y: layout.grid.y - gap }) : chunkUHKFJBY5_cjs.labelBelowFrame(chart, label, tilt, { x: centerX, y: layout.grid.y + layout.grid.height + gap });
|
|
6935
|
+
return chunkUHKFJBY5_cjs.chartText({
|
|
6584
6936
|
id,
|
|
6585
6937
|
order: nextOrder(),
|
|
6586
6938
|
bounds,
|
|
@@ -6592,7 +6944,7 @@ function createColumnHeader(context, layout, label, columnIndex) {
|
|
|
6592
6944
|
role: "axis"
|
|
6593
6945
|
});
|
|
6594
6946
|
}
|
|
6595
|
-
return
|
|
6947
|
+
return chunkUHKFJBY5_cjs.chartText({
|
|
6596
6948
|
id,
|
|
6597
6949
|
order: nextOrder(),
|
|
6598
6950
|
bounds,
|
|
@@ -6670,7 +7022,7 @@ function renderHeatmapLegend(context, layout) {
|
|
|
6670
7022
|
return [];
|
|
6671
7023
|
}
|
|
6672
7024
|
const place = barPlace(layout);
|
|
6673
|
-
const barBounds =
|
|
7025
|
+
const barBounds = chunkUHKFJBY5_cjs.boxBounds({ x: place.x, y: place.y, width: place.width, height: place.height });
|
|
6674
7026
|
return [createGradientBar(context, layout, place, barBounds), ...createBoundaryTicks(context, layout, place)];
|
|
6675
7027
|
}
|
|
6676
7028
|
function bandRatio(layout, value) {
|
|
@@ -6684,7 +7036,7 @@ function createGradientBar(context, layout, place, barBounds) {
|
|
|
6684
7036
|
const zones = layout.zones.slice(0, bandCount);
|
|
6685
7037
|
const stops = zones.map((zone, index) => ({
|
|
6686
7038
|
offset: bandRatio(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
6687
|
-
color: zone.color ??
|
|
7039
|
+
color: zone.color ?? chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL
|
|
6688
7040
|
}));
|
|
6689
7041
|
return {
|
|
6690
7042
|
type: "rect",
|
|
@@ -6699,7 +7051,7 @@ function createGradientBar(context, layout, place, barBounds) {
|
|
|
6699
7051
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
6700
7052
|
style: {
|
|
6701
7053
|
// Across the grid it runs from the lowest value on the left; beside it from the lowest at the bottom.
|
|
6702
|
-
fill: stops.length ? { kind: "linear-gradient", angle: place.vertical ? 270 : 0, stops } : { kind: "solid", color:
|
|
7054
|
+
fill: stops.length ? { kind: "linear-gradient", angle: place.vertical ? 270 : 0, stops } : { kind: "solid", color: chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL },
|
|
6703
7055
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
6704
7056
|
strokeWidth: 1
|
|
6705
7057
|
}
|
|
@@ -6725,12 +7077,12 @@ function createBoundaryTicks(context, layout, place) {
|
|
|
6725
7077
|
strokeWidth: 1
|
|
6726
7078
|
}
|
|
6727
7079
|
};
|
|
6728
|
-
const label =
|
|
7080
|
+
const label = chunkUHKFJBY5_cjs.chartText({
|
|
6729
7081
|
id: `chart-heatmap-legend-tick-label-${chart.id}-${index}`,
|
|
6730
7082
|
order: nextOrder(),
|
|
6731
7083
|
bounds,
|
|
6732
7084
|
...labelAt(place, at, index === 0, index === lastIndex, labelHeight),
|
|
6733
|
-
text:
|
|
7085
|
+
text: chunkUHKFJBY5_cjs.formatFieldValue(value),
|
|
6734
7086
|
chart
|
|
6735
7087
|
});
|
|
6736
7088
|
return [tick, label];
|
|
@@ -7097,22 +7449,22 @@ function renderHexbin(context) {
|
|
|
7097
7449
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
7098
7450
|
const nodes = [];
|
|
7099
7451
|
const config = chart.config;
|
|
7100
|
-
const hexRadius = Math.max(1, config?.hexRadius ??
|
|
7452
|
+
const hexRadius = Math.max(1, config?.hexRadius ?? chunkUHKFJBY5_cjs.DEFAULT_HEX_RADIUS);
|
|
7101
7453
|
const drawRadius = Math.max(0.5, hexRadius - Math.max(0, config?.hexGap ?? 0) * GAP_TO_RADIUS);
|
|
7102
7454
|
const strokeWidth = config?.hexStrokeWidth ?? 0;
|
|
7103
7455
|
const minOpacity = Math.min(1, Math.max(0, config?.hexMinOpacity ?? DEFAULT_MIN_OPACITY));
|
|
7104
|
-
const shadow =
|
|
7456
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7105
7457
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
7106
7458
|
chart.series.forEach((series, seriesIndex) => {
|
|
7107
7459
|
const explicit = series.values.length > 0 && Array.isArray(series.values[0]);
|
|
7108
7460
|
const pairs = explicit ? series.values : series.values.map((y, i) => [chart.axisX.min + i * chart.axisX.step, y]);
|
|
7109
7461
|
const pixelPoints2 = pairs.map(([vx, vy]) => ({
|
|
7110
|
-
x:
|
|
7111
|
-
y: plot.height -
|
|
7462
|
+
x: chunkUHKFJBY5_cjs.mapChartValue(vx, chart.axisX, plot.width),
|
|
7463
|
+
y: plot.height - chunkUHKFJBY5_cjs.mapChartValue(vy, chart.axisY, plot.height)
|
|
7112
7464
|
}));
|
|
7113
7465
|
const bins = computeHexBins(pixelPoints2, hexRadius);
|
|
7114
7466
|
const maxCount = Math.max(1, ...bins.map((bin) => bin.count));
|
|
7115
|
-
const color = series.color ??
|
|
7467
|
+
const color = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
7116
7468
|
const ramp = config?.scale;
|
|
7117
7469
|
bins.forEach((bin, i) => {
|
|
7118
7470
|
const share = bin.count / maxCount;
|
|
@@ -7124,8 +7476,8 @@ function renderHexbin(context) {
|
|
|
7124
7476
|
bounds,
|
|
7125
7477
|
d: hexPath(plot.x + bin.cx, plot.y + bin.cy, drawRadius),
|
|
7126
7478
|
style: {
|
|
7127
|
-
fill:
|
|
7128
|
-
stroke: strokeWidth > 0 ?
|
|
7479
|
+
fill: chunkUHKFJBY5_cjs.paint(fill2, diagnostics, chart.id),
|
|
7480
|
+
stroke: strokeWidth > 0 ? chunkUHKFJBY5_cjs.paint(config?.hexStrokeColor ?? fill2, diagnostics, chart.id) : void 0,
|
|
7129
7481
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
7130
7482
|
opacity: ramp ? void 0 : Math.max(minOpacity, share),
|
|
7131
7483
|
shadow,
|
|
@@ -7147,8 +7499,8 @@ function seriesValuePairs(chart, series) {
|
|
|
7147
7499
|
function pixelPoints(context, pairs) {
|
|
7148
7500
|
const { chart, plot } = context;
|
|
7149
7501
|
return pairs.map(([x, y]) => ({
|
|
7150
|
-
x: plot.x +
|
|
7151
|
-
y: plot.y + plot.height -
|
|
7502
|
+
x: plot.x + chunkUHKFJBY5_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
7503
|
+
y: plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(y, chart.axisY, plot.height)
|
|
7152
7504
|
}));
|
|
7153
7505
|
}
|
|
7154
7506
|
|
|
@@ -7158,7 +7510,7 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
7158
7510
|
const baselineY = plot.y + plot.height;
|
|
7159
7511
|
const first = points[0];
|
|
7160
7512
|
const last = points[points.length - 1];
|
|
7161
|
-
const d = `${
|
|
7513
|
+
const d = `${chunkUHKFJBY5_cjs.linePathData(points, tension)} L ${last.x} ${baselineY} L ${first.x} ${baselineY} Z`;
|
|
7162
7514
|
const top = Math.min(...points.map((point) => point.y));
|
|
7163
7515
|
const centerX = (Math.min(...points.map((point) => point.x)) + Math.max(...points.map((point) => point.x))) / 2;
|
|
7164
7516
|
const halfHeight = (baselineY - top) / 2;
|
|
@@ -7180,8 +7532,8 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
7180
7532
|
kind: "linear-gradient",
|
|
7181
7533
|
angle: 90,
|
|
7182
7534
|
stops: [
|
|
7183
|
-
{ offset: 0, color:
|
|
7184
|
-
{ offset: 100, color:
|
|
7535
|
+
{ offset: 0, color: chunkUHKFJBY5_cjs.colorWithAlpha(color, areaOpacity) },
|
|
7536
|
+
{ offset: 100, color: chunkUHKFJBY5_cjs.colorWithAlpha(color, 0) }
|
|
7185
7537
|
]
|
|
7186
7538
|
},
|
|
7187
7539
|
stroke: { kind: "none" },
|
|
@@ -7204,7 +7556,7 @@ function guideNode(context, mark) {
|
|
|
7204
7556
|
d: `M ${mark.point.x} ${mark.point.y} V ${plot.y + plot.height}`,
|
|
7205
7557
|
style: {
|
|
7206
7558
|
fill: { kind: "none" },
|
|
7207
|
-
stroke:
|
|
7559
|
+
stroke: chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id),
|
|
7208
7560
|
strokeWidth: 1,
|
|
7209
7561
|
dash: [3, 4],
|
|
7210
7562
|
opacity: 0.55,
|
|
@@ -7225,7 +7577,7 @@ function dotNode(context, mark) {
|
|
|
7225
7577
|
rx: mark.radius,
|
|
7226
7578
|
ry: mark.radius,
|
|
7227
7579
|
style: {
|
|
7228
|
-
fill:
|
|
7580
|
+
fill: chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id),
|
|
7229
7581
|
shadow: glow ? { color: mark.color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : void 0,
|
|
7230
7582
|
pointerEvents: "none"
|
|
7231
7583
|
}
|
|
@@ -7238,7 +7590,7 @@ function labelNode3(context, mark, value) {
|
|
|
7238
7590
|
const text = formatHighlight(config?.highlightLabelFormat, config?.categories?.[mark.index] ?? "", value);
|
|
7239
7591
|
const width = Math.max(48, text.length * fontSize * 0.62);
|
|
7240
7592
|
return {
|
|
7241
|
-
...
|
|
7593
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
7242
7594
|
id: `chart-highlight-label-${mark.key}`,
|
|
7243
7595
|
order: nextOrder(),
|
|
7244
7596
|
bounds,
|
|
@@ -7318,15 +7670,15 @@ function createLineError(context, mark) {
|
|
|
7318
7670
|
return null;
|
|
7319
7671
|
}
|
|
7320
7672
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7321
|
-
const [lower, upper] =
|
|
7322
|
-
return
|
|
7673
|
+
const [lower, upper] = chunkUHKFJBY5_cjs.errorBarRange(mark.value, mark.error);
|
|
7674
|
+
return chunkUHKFJBY5_cjs.createVerticalErrorWhiskerNode({
|
|
7323
7675
|
id: `chart-line-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
7324
7676
|
order: nextOrder(),
|
|
7325
7677
|
bounds,
|
|
7326
7678
|
geometry: {
|
|
7327
7679
|
centerX: mark.position.x,
|
|
7328
|
-
startY: plot.y + plot.height -
|
|
7329
|
-
endY: plot.y + plot.height -
|
|
7680
|
+
startY: plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
7681
|
+
endY: plot.y + plot.height - chunkUHKFJBY5_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
7330
7682
|
},
|
|
7331
7683
|
color: mark.color,
|
|
7332
7684
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -7350,8 +7702,8 @@ function createLinePoint(context, mark) {
|
|
|
7350
7702
|
ry: visible ? radius : 6,
|
|
7351
7703
|
detail: { of: "chartValue", series: mark.seriesId, valueIndex: mark.valueIndex },
|
|
7352
7704
|
style: {
|
|
7353
|
-
fill: visible ?
|
|
7354
|
-
stroke: visible && strokeWidth > 0 ?
|
|
7705
|
+
fill: visible ? chunkUHKFJBY5_cjs.paint(fill2, diagnostics, chart.id) : { kind: "none" },
|
|
7706
|
+
stroke: visible && strokeWidth > 0 ? chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id) : void 0,
|
|
7355
7707
|
strokeWidth: visible && strokeWidth > 0 ? strokeWidth : void 0,
|
|
7356
7708
|
pointerEvents: visible ? void 0 : "all"
|
|
7357
7709
|
}
|
|
@@ -7371,22 +7723,22 @@ function createLinePath(context, series, points, color, tension) {
|
|
|
7371
7723
|
order: nextOrder(),
|
|
7372
7724
|
bounds: gradient ? { minX: plot.x, maxX: plot.x + plot.width, minY: plot.y, maxY: plot.y + plot.height } : bounds,
|
|
7373
7725
|
detail: { of: "chartSeries", series: series.id, lineTension: tension || void 0 },
|
|
7374
|
-
d:
|
|
7726
|
+
d: chunkUHKFJBY5_cjs.linePathData(points, tension),
|
|
7375
7727
|
style: {
|
|
7376
7728
|
fill: { kind: "none" },
|
|
7377
|
-
stroke:
|
|
7729
|
+
stroke: chunkUHKFJBY5_cjs.paint(gradient ?? color, diagnostics, chart.id),
|
|
7378
7730
|
strokeWidth: series.strokeWidth ?? config?.lineWidth ?? 2,
|
|
7379
7731
|
dash: series.dash,
|
|
7380
7732
|
lineCap: config?.lineWidth === void 0 ? void 0 : "round",
|
|
7381
7733
|
lineJoin: "round",
|
|
7382
|
-
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } :
|
|
7734
|
+
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle)
|
|
7383
7735
|
}
|
|
7384
7736
|
};
|
|
7385
7737
|
}
|
|
7386
7738
|
|
|
7387
7739
|
// src/renderScene/charts/renderers/line/series.ts
|
|
7388
7740
|
function seriesColor(series, seriesIndex) {
|
|
7389
|
-
return
|
|
7741
|
+
return chunkUHKFJBY5_cjs.representativeColor(series.color, chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length]);
|
|
7390
7742
|
}
|
|
7391
7743
|
function renderLineSeriesArea(context, series, seriesIndex) {
|
|
7392
7744
|
const areaOpacity = context.chart.config?.areaOpacity;
|
|
@@ -7450,7 +7802,7 @@ function renderGridLines(context, layout) {
|
|
|
7450
7802
|
style: {
|
|
7451
7803
|
fill: { kind: "none" },
|
|
7452
7804
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
7453
|
-
strokeWidth:
|
|
7805
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1)
|
|
7454
7806
|
}
|
|
7455
7807
|
};
|
|
7456
7808
|
});
|
|
@@ -7458,7 +7810,7 @@ function renderGridLines(context, layout) {
|
|
|
7458
7810
|
function renderPercentageLabels(context, layout) {
|
|
7459
7811
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7460
7812
|
return PERCENT_TICKS.map((percent) => ({
|
|
7461
|
-
...
|
|
7813
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
7462
7814
|
id: `chart-mekko-pct-${chart.id}-${percent}`,
|
|
7463
7815
|
order: nextOrder(),
|
|
7464
7816
|
bounds,
|
|
@@ -7490,7 +7842,7 @@ function renderMekkoColumnLabels(context, layout, columnIndex, column) {
|
|
|
7490
7842
|
function createTotalLabel(context, layout, columnIndex, column) {
|
|
7491
7843
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7492
7844
|
return {
|
|
7493
|
-
...
|
|
7845
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
7494
7846
|
id: `chart-mekko-total-${chart.id}-${columnIndex}`,
|
|
7495
7847
|
order: nextOrder(),
|
|
7496
7848
|
bounds,
|
|
@@ -7511,7 +7863,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
7511
7863
|
const { chart, bounds, nextOrder } = context;
|
|
7512
7864
|
const { label, width } = column;
|
|
7513
7865
|
return {
|
|
7514
|
-
...
|
|
7866
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
7515
7867
|
id: `chart-mekko-col-label-${chart.id}-${columnIndex}`,
|
|
7516
7868
|
order: nextOrder(),
|
|
7517
7869
|
bounds,
|
|
@@ -7525,7 +7877,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
7525
7877
|
chart,
|
|
7526
7878
|
align: "center"
|
|
7527
7879
|
}),
|
|
7528
|
-
lines:
|
|
7880
|
+
lines: chunkUHKFJBY5_cjs.wrapText(label, width, layout.smallFontSize),
|
|
7529
7881
|
fontSize: layout.smallFontSize
|
|
7530
7882
|
};
|
|
7531
7883
|
}
|
|
@@ -7535,8 +7887,8 @@ function createMekkoLayout(context) {
|
|
|
7535
7887
|
const labels = mekkoColumnLabels(context);
|
|
7536
7888
|
const labelGutterWidth = context.showLabels ? 30 : 0;
|
|
7537
7889
|
const grid = createMekkoGrid(context, labelGutterWidth);
|
|
7538
|
-
const fontSize = Math.max(9,
|
|
7539
|
-
const columnGap2 = Math.max(0,
|
|
7890
|
+
const fontSize = Math.max(9, chunkUHKFJBY5_cjs.finite(context.chart.fontSize, 12));
|
|
7891
|
+
const columnGap2 = Math.max(0, chunkUHKFJBY5_cjs.finite(context.chart.config?.mekkoColumnGap, 4));
|
|
7540
7892
|
const smallFontSize = Math.max(8, fontSize - 1);
|
|
7541
7893
|
return {
|
|
7542
7894
|
columns: createMekkoColumns(context, grid, labels, columnGap2),
|
|
@@ -7544,8 +7896,8 @@ function createMekkoLayout(context) {
|
|
|
7544
7896
|
smallFontSize,
|
|
7545
7897
|
labelGutterWidth,
|
|
7546
7898
|
columnGap: columnGap2,
|
|
7547
|
-
labelSize: Math.max(6,
|
|
7548
|
-
valueSize: Math.max(6,
|
|
7899
|
+
labelSize: Math.max(6, chunkUHKFJBY5_cjs.finite(context.chart.config?.mekkoLabelSize, smallFontSize)),
|
|
7900
|
+
valueSize: Math.max(6, chunkUHKFJBY5_cjs.finite(context.chart.config?.mekkoValueSize, smallFontSize)),
|
|
7549
7901
|
grid
|
|
7550
7902
|
};
|
|
7551
7903
|
}
|
|
@@ -7602,12 +7954,12 @@ function createColumnBackdrop(context, layout, columnIndex) {
|
|
|
7602
7954
|
id: `chart-mekko-column-backdrop-${chart.id}-${columnIndex}`,
|
|
7603
7955
|
order: nextOrder(),
|
|
7604
7956
|
bounds,
|
|
7605
|
-
d:
|
|
7606
|
-
style: { fill:
|
|
7957
|
+
d: chunkUHKFJBY5_cjs.barShapePath(column.x, layout.grid.y, column.width, layout.grid.height, cornerRadius),
|
|
7958
|
+
style: { fill: chunkUHKFJBY5_cjs.paint(chart.gridColor ?? "#e2e8f0", diagnostics, chart.id), opacity: BACKDROP_OPACITY }
|
|
7607
7959
|
};
|
|
7608
7960
|
}
|
|
7609
7961
|
function mekkoCornerRadius(context) {
|
|
7610
|
-
return Math.max(0,
|
|
7962
|
+
return Math.max(0, chunkUHKFJBY5_cjs.finite(context.chart.config?.barCornerRadius, 2));
|
|
7611
7963
|
}
|
|
7612
7964
|
function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
7613
7965
|
const segments = [];
|
|
@@ -7618,7 +7970,7 @@ function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
|
7618
7970
|
const height = (column.total > 0 ? value / column.total : 0) * column.height;
|
|
7619
7971
|
const y = column.y + cumulativeHeight;
|
|
7620
7972
|
cumulativeHeight += height;
|
|
7621
|
-
const color = series.color ??
|
|
7973
|
+
const color = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
7622
7974
|
segments.push({
|
|
7623
7975
|
columnIndex,
|
|
7624
7976
|
seriesId: series.id,
|
|
@@ -7641,12 +7993,12 @@ function renderSegment(context, layout, segment, nextColor) {
|
|
|
7641
7993
|
}
|
|
7642
7994
|
function createSegmentNode(context, segment, nextColor) {
|
|
7643
7995
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
7644
|
-
const shadow =
|
|
7996
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7645
7997
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
7646
7998
|
const config = chart.config;
|
|
7647
7999
|
const radius = segment.isTop || config?.mekkoRoundAll ? mekkoCornerRadius(context) : 0;
|
|
7648
8000
|
const { x, y, width, height } = segment.frame;
|
|
7649
|
-
const segmentGap = Math.max(0,
|
|
8001
|
+
const segmentGap = Math.max(0, chunkUHKFJBY5_cjs.finite(config?.mekkoSegmentGap, 0));
|
|
7650
8002
|
const fallback = "#94a3b8";
|
|
7651
8003
|
const gradientBounds = {
|
|
7652
8004
|
minX: x + width / 2 - height / 2,
|
|
@@ -7658,20 +8010,20 @@ function createSegmentNode(context, segment, nextColor) {
|
|
|
7658
8010
|
kind: "linear-gradient",
|
|
7659
8011
|
angle: 90,
|
|
7660
8012
|
stops: [
|
|
7661
|
-
{ offset: 0, color:
|
|
7662
|
-
{ offset: 100, color:
|
|
8013
|
+
{ offset: 0, color: chunkUHKFJBY5_cjs.representativeColor(segment.color, fallback) },
|
|
8014
|
+
{ offset: 100, color: chunkUHKFJBY5_cjs.representativeColor(nextColor, fallback) }
|
|
7663
8015
|
]
|
|
7664
|
-
} :
|
|
8016
|
+
} : chunkUHKFJBY5_cjs.paint(segment.color, diagnostics, chart.id);
|
|
7665
8017
|
return {
|
|
7666
8018
|
type: "path",
|
|
7667
8019
|
id: `chart-mekko-seg-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
7668
8020
|
order: nextOrder(),
|
|
7669
8021
|
bounds: nextColor ? gradientBounds : bounds,
|
|
7670
|
-
d:
|
|
8022
|
+
d: chunkUHKFJBY5_cjs.barPath(x, y + segmentGap / 2, width, Math.max(0, height - segmentGap), radius, Boolean(config?.mekkoRoundAll)),
|
|
7671
8023
|
style: {
|
|
7672
8024
|
fill: fill2,
|
|
7673
8025
|
stroke: { kind: "solid", color: config?.mekkoSegmentStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
7674
|
-
strokeWidth:
|
|
8026
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(config?.mekkoSegmentStrokeWidth, chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1)),
|
|
7675
8027
|
shadow,
|
|
7676
8028
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
7677
8029
|
}
|
|
@@ -7687,17 +8039,17 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
7687
8039
|
const innerHeight = Math.max(1, height - 6);
|
|
7688
8040
|
const lineHeight = layout.labelSize * 1.2;
|
|
7689
8041
|
const valueHeight = layout.valueSize * 1.2;
|
|
7690
|
-
const labelLines =
|
|
7691
|
-
(line) =>
|
|
8042
|
+
const labelLines = chunkUHKFJBY5_cjs.wrapText(segment.seriesLabel, innerWidth, layout.labelSize).map(
|
|
8043
|
+
(line) => chunkUHKFJBY5_cjs.ellipsizeToWidth(line, innerWidth, layout.labelSize, true)
|
|
7692
8044
|
);
|
|
7693
8045
|
if (labelLines.length * lineHeight + valueHeight > innerHeight) {
|
|
7694
8046
|
return [];
|
|
7695
8047
|
}
|
|
7696
|
-
const textColor = chart.config?.mekkoTextColor ??
|
|
8048
|
+
const textColor = chart.config?.mekkoTextColor ?? chunkUHKFJBY5_cjs.contrastTextColor(chunkUHKFJBY5_cjs.representativeColor(segment.color, "#ffffff"));
|
|
7697
8049
|
const columnTotal = layout.columns[segment.columnIndex]?.total ?? 0;
|
|
7698
8050
|
const valueText = chart.config?.mekkoValueFormat === "percent" ? `${columnTotal > 0 ? Math.round(segment.value / columnTotal * 100) : 0}%` : String(segment.value);
|
|
7699
8051
|
const label = {
|
|
7700
|
-
...
|
|
8052
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
7701
8053
|
id: `chart-mekko-seg-label-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
7702
8054
|
order: nextOrder(),
|
|
7703
8055
|
bounds,
|
|
@@ -7711,7 +8063,7 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
7711
8063
|
color: textColor
|
|
7712
8064
|
};
|
|
7713
8065
|
const valueNode = {
|
|
7714
|
-
...
|
|
8066
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
7715
8067
|
id: `chart-mekko-seg-value-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
7716
8068
|
order: nextOrder(),
|
|
7717
8069
|
bounds,
|
|
@@ -7744,7 +8096,7 @@ function renderMekko(context) {
|
|
|
7744
8096
|
|
|
7745
8097
|
// src/renderScene/charts/renderers/pie/center.ts
|
|
7746
8098
|
function fill(template, chart) {
|
|
7747
|
-
const values = chart.series.map((series) => Math.max(0,
|
|
8099
|
+
const values = chart.series.map((series) => Math.max(0, chunkUHKFJBY5_cjs.finite(series.values[0], 0)));
|
|
7748
8100
|
const total = values.reduce((sum, value) => sum + value, 0);
|
|
7749
8101
|
const first = values[0] ?? 0;
|
|
7750
8102
|
return template.replace(/\{total\}/g, String(Math.round(total * 100) / 100)).replace(/\{percent\}/g, String(total > 0 ? Math.round(first / total * 100) : 0)).replace(/\{label\}/g, chart.series[0]?.label ?? "");
|
|
@@ -7756,7 +8108,7 @@ function renderPieCenter(context, geometry) {
|
|
|
7756
8108
|
return [];
|
|
7757
8109
|
}
|
|
7758
8110
|
const lines = fill(template, chart).split(/\\n|\n/);
|
|
7759
|
-
const fontSize =
|
|
8111
|
+
const fontSize = chunkUHKFJBY5_cjs.finite(chart.config?.pieCenterSize, Math.max(14, Math.min(40, geometry.outerRadius * 0.3)));
|
|
7760
8112
|
const lineHeight = fontSize * 1.2;
|
|
7761
8113
|
const width = Math.max(40, (geometry.innerRadius > 0 ? geometry.innerRadius : geometry.outerRadius * 0.6) * 2);
|
|
7762
8114
|
const text = {
|
|
@@ -7769,7 +8121,7 @@ function renderPieCenter(context, geometry) {
|
|
|
7769
8121
|
width,
|
|
7770
8122
|
height: lineHeight * lines.length,
|
|
7771
8123
|
lines,
|
|
7772
|
-
fontFamily: chart.fontFamily ??
|
|
8124
|
+
fontFamily: chart.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
7773
8125
|
fontSize,
|
|
7774
8126
|
fontWeight: "bold",
|
|
7775
8127
|
align: "center",
|
|
@@ -7789,14 +8141,14 @@ var radians = (degrees) => degrees * Math.PI / 180;
|
|
|
7789
8141
|
function renderPieSlices(context, geometry) {
|
|
7790
8142
|
const config = context.chart.config;
|
|
7791
8143
|
const marks = createPieSliceMarks(context.chart.series, geometry.total, {
|
|
7792
|
-
start: TOP + radians(
|
|
7793
|
-
sweep: Math.min(FULL, Math.max(radians(1), radians(
|
|
7794
|
-
explode: Math.max(0,
|
|
8144
|
+
start: TOP + radians(chunkUHKFJBY5_cjs.finite(config?.pieStartAngle, 0)),
|
|
8145
|
+
sweep: Math.min(FULL, Math.max(radians(1), radians(chunkUHKFJBY5_cjs.finite(config?.pieSweep, 360)))),
|
|
8146
|
+
explode: Math.max(0, chunkUHKFJBY5_cjs.finite(config?.pieExplode, 0))
|
|
7795
8147
|
});
|
|
7796
8148
|
const gapPx = config?.pieSliceGap ?? 0;
|
|
7797
8149
|
return [
|
|
7798
8150
|
...marks.flatMap((mark) => createSliceNodes(context, shiftGeometry(geometry, mark), mark, gapPx)),
|
|
7799
|
-
...
|
|
8151
|
+
...chunkUHKFJBY5_cjs.renderPieLabels(
|
|
7800
8152
|
context,
|
|
7801
8153
|
geometry,
|
|
7802
8154
|
marks.map((mark) => ({
|
|
@@ -7828,20 +8180,20 @@ function createPieSliceMarks(seriesList, total, layout) {
|
|
|
7828
8180
|
const marks = [];
|
|
7829
8181
|
let angle = layout.start;
|
|
7830
8182
|
seriesList.forEach((series, seriesIndex) => {
|
|
7831
|
-
const value = Math.max(0,
|
|
8183
|
+
const value = Math.max(0, chunkUHKFJBY5_cjs.finite(series.values[0], 0));
|
|
7832
8184
|
const sweep = value / total * layout.sweep;
|
|
7833
8185
|
marks.push({
|
|
7834
8186
|
seriesId: series.id,
|
|
7835
8187
|
label: series.label,
|
|
7836
|
-
color: series.color ??
|
|
8188
|
+
color: series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length],
|
|
7837
8189
|
stroke: series.stroke,
|
|
7838
8190
|
strokeWidth: series.strokeWidth,
|
|
7839
8191
|
value,
|
|
7840
8192
|
share: value / total,
|
|
7841
8193
|
angles: { start: angle, end: angle + Math.min(sweep, layout.sweep >= FULL ? MAXIMUM_SWEEP : layout.sweep) },
|
|
7842
|
-
explode: Math.max(0,
|
|
7843
|
-
labelOffsetX:
|
|
7844
|
-
labelOffsetY:
|
|
8194
|
+
explode: Math.max(0, chunkUHKFJBY5_cjs.finite(series.offset, layout.explode)),
|
|
8195
|
+
labelOffsetX: chunkUHKFJBY5_cjs.finite(series.labelOffsetX, 0),
|
|
8196
|
+
labelOffsetY: chunkUHKFJBY5_cjs.finite(series.labelOffsetY, 0)
|
|
7845
8197
|
});
|
|
7846
8198
|
angle += sweep;
|
|
7847
8199
|
});
|
|
@@ -7864,14 +8216,14 @@ function pieOuterShadow(shadow, gapPx) {
|
|
|
7864
8216
|
function sliceCornerRadius(geometry, mark, gapPx) {
|
|
7865
8217
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
7866
8218
|
const rawSweep = mark.angles.end - mark.angles.start;
|
|
7867
|
-
const usesInnerArc =
|
|
7868
|
-
const gapSweep = 2 *
|
|
8219
|
+
const usesInnerArc = chunkUHKFJBY5_cjs.pieUsesInnerArc(geometry, mark.angles, gapPx);
|
|
8220
|
+
const gapSweep = 2 * chunkUHKFJBY5_cjs.gapInsetAngle(halfGap, geometry.outerRadius);
|
|
7869
8221
|
const availableSweep = Math.max(0, rawSweep - gapSweep);
|
|
7870
8222
|
return Math.min(
|
|
7871
8223
|
geometry.cornerRadius,
|
|
7872
|
-
usesInnerArc ?
|
|
8224
|
+
usesInnerArc ? chunkUHKFJBY5_cjs.maxPieCornerRadius(geometry.outerRadius, geometry.innerRadius, availableSweep) : chunkUHKFJBY5_cjs.maxApexCornerRadius(
|
|
7873
8225
|
geometry.outerRadius,
|
|
7874
|
-
|
|
8226
|
+
chunkUHKFJBY5_cjs.pieApexRadius(halfGap, rawSweep, geometry.outerRadius),
|
|
7875
8227
|
availableSweep
|
|
7876
8228
|
)
|
|
7877
8229
|
);
|
|
@@ -7884,14 +8236,14 @@ function sliceStroke(context, mark) {
|
|
|
7884
8236
|
}
|
|
7885
8237
|
return {
|
|
7886
8238
|
stroke: { kind: "solid", color: strokeColor },
|
|
7887
|
-
strokeWidth:
|
|
8239
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(mark.strokeWidth, chunkUHKFJBY5_cjs.finite(config?.pieStrokeWidth, 1))
|
|
7888
8240
|
};
|
|
7889
8241
|
}
|
|
7890
8242
|
function createSliceNodes(context, geometry, mark, gapPx) {
|
|
7891
8243
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
7892
|
-
const fill2 =
|
|
7893
|
-
const slicePath =
|
|
7894
|
-
const shadow =
|
|
8244
|
+
const fill2 = chunkUHKFJBY5_cjs.paint(mark.color, diagnostics, chart.id);
|
|
8245
|
+
const slicePath = chunkUHKFJBY5_cjs.createPieSlicePath(geometry, mark.angles, sliceCornerRadius(geometry, mark, gapPx), gapPx);
|
|
8246
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7895
8247
|
const strokeStyle = sliceStroke(context, mark);
|
|
7896
8248
|
const glow = chart.config?.pieGlow;
|
|
7897
8249
|
const shadowCaster = shadow ? {
|
|
@@ -7922,12 +8274,12 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
7922
8274
|
pieEnd: mark.angles.end,
|
|
7923
8275
|
pieValue: mark.value
|
|
7924
8276
|
},
|
|
7925
|
-
prop:
|
|
8277
|
+
prop: chunkUHKFJBY5_cjs.seriesValueProp(mark.seriesId, 0),
|
|
7926
8278
|
style: {
|
|
7927
8279
|
fill: fill2,
|
|
7928
8280
|
...strokeStyle,
|
|
7929
8281
|
innerShadow: shadow,
|
|
7930
|
-
shadow: glow ? { color:
|
|
8282
|
+
shadow: glow ? { color: chunkUHKFJBY5_cjs.representativeColor(mark.color, "#ffffff"), opacity: 0.85, blur: glow, dx: 0, dy: 0 } : void 0
|
|
7931
8283
|
}
|
|
7932
8284
|
};
|
|
7933
8285
|
return shadowCaster ? [shadowCaster, slice] : [slice];
|
|
@@ -7935,7 +8287,7 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
7935
8287
|
|
|
7936
8288
|
// src/renderScene/charts/renderers/pie.ts
|
|
7937
8289
|
function renderPie(context) {
|
|
7938
|
-
const geometry =
|
|
8290
|
+
const geometry = chunkUHKFJBY5_cjs.createPieGeometry(context);
|
|
7939
8291
|
return [...renderPieSlices(context, geometry), ...renderPieCenter(context, geometry)];
|
|
7940
8292
|
}
|
|
7941
8293
|
|
|
@@ -7952,18 +8304,18 @@ var OUTSIDE_FALLBACK_COLOR = "#334155";
|
|
|
7952
8304
|
function layoutOf(context) {
|
|
7953
8305
|
const { chart, plot } = context;
|
|
7954
8306
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
7955
|
-
const axisMin =
|
|
8307
|
+
const axisMin = chunkUHKFJBY5_cjs.finite(chart.axisY.min, 0);
|
|
7956
8308
|
return {
|
|
7957
8309
|
centerX: plot.x + plot.width / 2,
|
|
7958
8310
|
centerY: plot.y + plot.height / 2,
|
|
7959
8311
|
maxRadius,
|
|
7960
|
-
innerRadius: Math.max(0, Math.min(
|
|
7961
|
-
cornerRadius: Math.max(0,
|
|
7962
|
-
gapPx: Math.max(0,
|
|
8312
|
+
innerRadius: Math.max(0, Math.min(chunkUHKFJBY5_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1)),
|
|
8313
|
+
cornerRadius: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.pieCornerRadius, 0)),
|
|
8314
|
+
gapPx: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.pieSliceGap, 0)),
|
|
7963
8315
|
axisMin,
|
|
7964
|
-
range:
|
|
8316
|
+
range: chunkUHKFJBY5_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
7965
8317
|
sweep: chart.series.length > 0 ? Math.PI * 2 / chart.series.length : 0,
|
|
7966
|
-
start: TOP2 +
|
|
8318
|
+
start: TOP2 + chunkUHKFJBY5_cjs.finite(chart.config?.pieStartAngle, 0) * Math.PI / 180
|
|
7967
8319
|
};
|
|
7968
8320
|
}
|
|
7969
8321
|
function clampedCorner(layout, outerRadius, angles) {
|
|
@@ -7971,19 +8323,19 @@ function clampedCorner(layout, outerRadius, angles) {
|
|
|
7971
8323
|
const geometry = { centerX, centerY, outerRadius, innerRadius };
|
|
7972
8324
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
7973
8325
|
const rawSweep = angles.end - angles.start;
|
|
7974
|
-
const availableSweep = Math.max(0, rawSweep - 2 *
|
|
7975
|
-
if (
|
|
7976
|
-
return Math.min(cornerRadius,
|
|
8326
|
+
const availableSweep = Math.max(0, rawSweep - 2 * chunkUHKFJBY5_cjs.gapInsetAngle(halfGap, outerRadius));
|
|
8327
|
+
if (chunkUHKFJBY5_cjs.pieUsesInnerArc(geometry, angles, gapPx)) {
|
|
8328
|
+
return Math.min(cornerRadius, chunkUHKFJBY5_cjs.maxPieCornerRadius(outerRadius, innerRadius, availableSweep));
|
|
7977
8329
|
}
|
|
7978
|
-
const apexRadius =
|
|
7979
|
-
return Math.min(cornerRadius,
|
|
8330
|
+
const apexRadius = chunkUHKFJBY5_cjs.pieApexRadius(halfGap, rawSweep, outerRadius);
|
|
8331
|
+
return Math.min(cornerRadius, chunkUHKFJBY5_cjs.maxApexCornerRadius(outerRadius, apexRadius, availableSweep));
|
|
7980
8332
|
}
|
|
7981
8333
|
function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor) {
|
|
7982
8334
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
7983
8335
|
const { centerX, centerY, innerRadius, maxRadius, gapPx } = layout;
|
|
7984
|
-
const color =
|
|
7985
|
-
const shadow =
|
|
7986
|
-
const trackPath =
|
|
8336
|
+
const color = chunkUHKFJBY5_cjs.paint(rawColor, diagnostics, chart.id);
|
|
8337
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8338
|
+
const trackPath = chunkUHKFJBY5_cjs.createPieSlicePath(
|
|
7987
8339
|
{ centerX, centerY, outerRadius: maxRadius, innerRadius },
|
|
7988
8340
|
angles,
|
|
7989
8341
|
clampedCorner(layout, maxRadius, angles),
|
|
@@ -7996,12 +8348,12 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
7996
8348
|
bounds,
|
|
7997
8349
|
d: trackPath,
|
|
7998
8350
|
style: {
|
|
7999
|
-
fill:
|
|
8351
|
+
fill: chunkUHKFJBY5_cjs.paint(chart.gridColor ?? TRACK_COLOR_FALLBACK, diagnostics, chart.id),
|
|
8000
8352
|
opacity: chart.config?.polarTrackOpacity,
|
|
8001
8353
|
...trackStroke(context)
|
|
8002
8354
|
}
|
|
8003
8355
|
};
|
|
8004
|
-
const wedgePath =
|
|
8356
|
+
const wedgePath = chunkUHKFJBY5_cjs.createPieSlicePath(
|
|
8005
8357
|
{ centerX, centerY, outerRadius, innerRadius },
|
|
8006
8358
|
angles,
|
|
8007
8359
|
clampedCorner(layout, outerRadius, angles),
|
|
@@ -8030,7 +8382,7 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
8030
8382
|
pieEnd: angles.end,
|
|
8031
8383
|
pieValue: value
|
|
8032
8384
|
},
|
|
8033
|
-
prop:
|
|
8385
|
+
prop: chunkUHKFJBY5_cjs.seriesValueProp(series.id, 0),
|
|
8034
8386
|
style: { fill: color, innerShadow: shadow, ...wedgeStroke(context) }
|
|
8035
8387
|
};
|
|
8036
8388
|
return shadowCaster ? [track, shadowCaster, wedge] : [track, wedge];
|
|
@@ -8043,7 +8395,7 @@ function trackStroke(context) {
|
|
|
8043
8395
|
const dash = (config.polarTrackDash ?? "").split(/[ ,]+/).map(Number).filter((part) => Number.isFinite(part) && part > 0);
|
|
8044
8396
|
return {
|
|
8045
8397
|
stroke: { kind: "solid", color: config.polarTrackStroke },
|
|
8046
|
-
strokeWidth:
|
|
8398
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(config.polarTrackStrokeWidth, 1),
|
|
8047
8399
|
dash: dash.length > 0 ? dash : void 0
|
|
8048
8400
|
};
|
|
8049
8401
|
}
|
|
@@ -8054,7 +8406,7 @@ function wedgeStroke(context) {
|
|
|
8054
8406
|
}
|
|
8055
8407
|
return {
|
|
8056
8408
|
stroke: { kind: "solid", color: config.pieStroke },
|
|
8057
|
-
strokeWidth:
|
|
8409
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(config.pieStrokeWidth, 1)
|
|
8058
8410
|
};
|
|
8059
8411
|
}
|
|
8060
8412
|
function ringNodes(context, layout) {
|
|
@@ -8062,7 +8414,7 @@ function ringNodes(context, layout) {
|
|
|
8062
8414
|
if (!chart.config?.polarRings || layout.range <= 0) {
|
|
8063
8415
|
return [];
|
|
8064
8416
|
}
|
|
8065
|
-
return
|
|
8417
|
+
return chunkUHKFJBY5_cjs.chartTicks(chart.axisY).filter((tick) => tick > layout.axisMin && tick < layout.axisMin + layout.range).map((tick) => {
|
|
8066
8418
|
const radius = layout.innerRadius + (layout.maxRadius - layout.innerRadius) * (tick - layout.axisMin) / layout.range;
|
|
8067
8419
|
return {
|
|
8068
8420
|
type: "ellipse",
|
|
@@ -8076,7 +8428,7 @@ function ringNodes(context, layout) {
|
|
|
8076
8428
|
style: {
|
|
8077
8429
|
fill: { kind: "none" },
|
|
8078
8430
|
stroke: { kind: "solid", color: chart.textColor ?? "#334155" },
|
|
8079
|
-
strokeWidth:
|
|
8431
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1),
|
|
8080
8432
|
opacity: 0.25
|
|
8081
8433
|
}
|
|
8082
8434
|
};
|
|
@@ -8088,10 +8440,10 @@ function renderPolarArea(context) {
|
|
|
8088
8440
|
const showLabels = context.showLabels && sweep >= MIN_LABEL_SWEEP;
|
|
8089
8441
|
const wedges = context.chart.series.flatMap((series, index) => {
|
|
8090
8442
|
const angles = { start: start + index * sweep, end: start + (index + 1) * sweep };
|
|
8091
|
-
const value = Math.max(0,
|
|
8443
|
+
const value = Math.max(0, chunkUHKFJBY5_cjs.finite(series.values[0], 0));
|
|
8092
8444
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
8093
8445
|
const outerRadius = Math.max(innerRadius + 1, innerRadius + (maxRadius - innerRadius) * fraction);
|
|
8094
|
-
const rawColor = series.color ??
|
|
8446
|
+
const rawColor = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[index % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
8095
8447
|
const nodes = wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor);
|
|
8096
8448
|
if (!showLabels) {
|
|
8097
8449
|
return nodes;
|
|
@@ -8102,10 +8454,10 @@ function renderPolarArea(context) {
|
|
|
8102
8454
|
return [...wedges, ...ringNodes(context, layout)];
|
|
8103
8455
|
}
|
|
8104
8456
|
function labelSizes(chart) {
|
|
8105
|
-
const base = Math.max(9,
|
|
8457
|
+
const base = Math.max(9, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12));
|
|
8106
8458
|
return {
|
|
8107
|
-
nameSize: Math.max(6,
|
|
8108
|
-
valueSize: Math.max(6,
|
|
8459
|
+
nameSize: Math.max(6, chunkUHKFJBY5_cjs.finite(chart.config?.polarNameSize, base)),
|
|
8460
|
+
valueSize: Math.max(6, chunkUHKFJBY5_cjs.finite(chart.config?.polarValueSize, base))
|
|
8109
8461
|
};
|
|
8110
8462
|
}
|
|
8111
8463
|
function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
@@ -8113,8 +8465,8 @@ function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
|
8113
8465
|
const { nameSize, valueSize } = labelSizes(context.chart);
|
|
8114
8466
|
const lineHeight = (nameSize + valueSize) * 1.2 / 2;
|
|
8115
8467
|
const ringThickness = geometry.outerRadius - geometry.innerRadius;
|
|
8116
|
-
const labelOffsetX =
|
|
8117
|
-
const labelOffsetY =
|
|
8468
|
+
const labelOffsetX = chunkUHKFJBY5_cjs.finite(series.labelOffsetX, 0);
|
|
8469
|
+
const labelOffsetY = chunkUHKFJBY5_cjs.finite(series.labelOffsetY, 0);
|
|
8118
8470
|
const hasManualOffset = labelOffsetX !== 0 || labelOffsetY !== 0;
|
|
8119
8471
|
const tooThin = ringThickness < lineHeight * 2 + 6;
|
|
8120
8472
|
const chordWidth = 2 * geometry.outerRadius * Math.sin(Math.abs(angles.end - angles.start) / 2);
|
|
@@ -8124,17 +8476,17 @@ function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
|
8124
8476
|
return void 0;
|
|
8125
8477
|
}
|
|
8126
8478
|
const outside = hasManualOffset || !fitsInline;
|
|
8127
|
-
const tickStart =
|
|
8128
|
-
const point = outside ? hasManualOffset ? addOffset(
|
|
8129
|
-
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor :
|
|
8130
|
-
|
|
8131
|
-
|
|
8479
|
+
const tickStart = chunkUHKFJBY5_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + LEADER_INSET);
|
|
8480
|
+
const point = outside ? hasManualOffset ? addOffset(chunkUHKFJBY5_cjs.pieArcPoint(geometry, mid, geometry.outerRadius), labelOffsetX, labelOffsetY) : chunkUHKFJBY5_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + OUTSIDE_GAP) : chunkUHKFJBY5_cjs.pieArcPoint(geometry, mid, geometry.innerRadius + ringThickness * LABEL_RADIUS_FRACTION);
|
|
8481
|
+
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor : chunkUHKFJBY5_cjs.sameHueTint(chunkUHKFJBY5_cjs.representativeColor(fillColor, OUTSIDE_FALLBACK_COLOR), OUTSIDE_TINT_LIGHTNESS) ?? OUTSIDE_FALLBACK_COLOR : chunkUHKFJBY5_cjs.sameHueContrastColor(
|
|
8482
|
+
chunkUHKFJBY5_cjs.representativeColor(fillColor, "#0f172a"),
|
|
8483
|
+
chunkUHKFJBY5_cjs.contrastTextColor(chunkUHKFJBY5_cjs.representativeColor(fillColor, "#0f172a"))
|
|
8132
8484
|
);
|
|
8133
8485
|
return { point, color, outside, mid, tickStart };
|
|
8134
8486
|
}
|
|
8135
8487
|
function labelTick(context, series, placement, lineHeight) {
|
|
8136
8488
|
const { point, color, outside, tickStart } = placement;
|
|
8137
|
-
const tickEnd = outside ?
|
|
8489
|
+
const tickEnd = outside ? chunkUHKFJBY5_cjs.clipSegmentToRect(tickStart, point, LABEL_WIDTH2 / 2, lineHeight) : tickStart;
|
|
8138
8490
|
return {
|
|
8139
8491
|
type: "path",
|
|
8140
8492
|
id: `chart-polar-area-label-tick-${context.chart.id}-${series.id}`,
|
|
@@ -8161,7 +8513,7 @@ function labelTexts(context, geometry, series, value, placement) {
|
|
|
8161
8513
|
bounds,
|
|
8162
8514
|
x: point.x - LABEL_WIDTH2 / 2,
|
|
8163
8515
|
width: LABEL_WIDTH2,
|
|
8164
|
-
fontFamily: chart.fontFamily ??
|
|
8516
|
+
fontFamily: chart.fontFamily ?? chunkUHKFJBY5_cjs.DEFAULT_FONT,
|
|
8165
8517
|
align: "center",
|
|
8166
8518
|
verticalAlign: "middle",
|
|
8167
8519
|
lineHeight: 1.2,
|
|
@@ -8184,7 +8536,7 @@ function labelTexts(context, geometry, series, value, placement) {
|
|
|
8184
8536
|
lines: [series.label],
|
|
8185
8537
|
fontWeight: valueFirst ? "normal" : "bold",
|
|
8186
8538
|
detail,
|
|
8187
|
-
prop:
|
|
8539
|
+
prop: chunkUHKFJBY5_cjs.seriesLabelProp(series.id)
|
|
8188
8540
|
};
|
|
8189
8541
|
const valueText = {
|
|
8190
8542
|
type: "text",
|
|
@@ -8194,10 +8546,10 @@ function labelTexts(context, geometry, series, value, placement) {
|
|
|
8194
8546
|
y: valueY,
|
|
8195
8547
|
height: valueSize * 1.2,
|
|
8196
8548
|
fontSize: valueSize,
|
|
8197
|
-
lines: [
|
|
8549
|
+
lines: [chunkUHKFJBY5_cjs.formatFieldValue(value)],
|
|
8198
8550
|
fontWeight: valueFirst ? "bold" : "normal",
|
|
8199
8551
|
detail,
|
|
8200
|
-
prop:
|
|
8552
|
+
prop: chunkUHKFJBY5_cjs.seriesValueProp(series.id, 0),
|
|
8201
8553
|
propKind: "value"
|
|
8202
8554
|
};
|
|
8203
8555
|
return [nameText, valueText];
|
|
@@ -8224,10 +8576,10 @@ function radarFrameFor(context) {
|
|
|
8224
8576
|
return {
|
|
8225
8577
|
centerX: plot.x + plot.width / 2,
|
|
8226
8578
|
centerY: plot.y + plot.height / 2,
|
|
8227
|
-
radius:
|
|
8579
|
+
radius: chunkUHKFJBY5_cjs.radarRadius(plot.width, plot.height, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12), context.showLabels),
|
|
8228
8580
|
min: chart.axisY.min,
|
|
8229
8581
|
max: chart.axisY.max,
|
|
8230
|
-
count:
|
|
8582
|
+
count: chunkUHKFJBY5_cjs.radarCategoryCount(configuredCount, dataCount),
|
|
8231
8583
|
curved: chart.chartType === "radial",
|
|
8232
8584
|
tension: chart.config?.radarTension
|
|
8233
8585
|
};
|
|
@@ -8237,7 +8589,7 @@ function createRadarGeometry(context) {
|
|
|
8237
8589
|
const configuredCategories = chart.config?.categories?.filter(Boolean) ?? [];
|
|
8238
8590
|
const frame = radarFrameFor(context);
|
|
8239
8591
|
const categories = createCategories(configuredCategories, frame.count);
|
|
8240
|
-
const pointAt = (pointRadius, pointIndex) =>
|
|
8592
|
+
const pointAt = (pointRadius, pointIndex) => chunkUHKFJBY5_cjs.radarPointAt(frame, pointIndex, pointRadius);
|
|
8241
8593
|
return {
|
|
8242
8594
|
circular: frame.curved,
|
|
8243
8595
|
areaOpacity: Math.max(0, Math.min(1, chart.config?.areaOpacity ?? 0.16)),
|
|
@@ -8249,9 +8601,9 @@ function createRadarGeometry(context) {
|
|
|
8249
8601
|
centerX: frame.centerX,
|
|
8250
8602
|
centerY: frame.centerY,
|
|
8251
8603
|
radius: frame.radius,
|
|
8252
|
-
radiusForValue: (value) =>
|
|
8604
|
+
radiusForValue: (value) => chunkUHKFJBY5_cjs.radarRadiusForValue(frame, value),
|
|
8253
8605
|
pointAt,
|
|
8254
|
-
polygonPath: (pointRadius) =>
|
|
8606
|
+
polygonPath: (pointRadius) => chunkUHKFJBY5_cjs.radarSeriesPath(
|
|
8255
8607
|
categories.map((_, index) => pointAt(pointRadius, index)),
|
|
8256
8608
|
false
|
|
8257
8609
|
)
|
|
@@ -8272,7 +8624,7 @@ function renderRadarGrid(context, geometry) {
|
|
|
8272
8624
|
return [...renderRings(context, geometry), ...geometry.showSpokes ? renderSpokes(context, geometry) : []];
|
|
8273
8625
|
}
|
|
8274
8626
|
function renderRings(context, geometry) {
|
|
8275
|
-
return
|
|
8627
|
+
return chunkUHKFJBY5_cjs.chartTicks(context.chart.axisY).filter((tick) => tick > context.chart.axisY.min).map((tick) => createRingNode(context, geometry, tick));
|
|
8276
8628
|
}
|
|
8277
8629
|
function createRingNode(context, geometry, tick) {
|
|
8278
8630
|
const { chart, bounds, nextOrder } = context;
|
|
@@ -8280,7 +8632,7 @@ function createRingNode(context, geometry, tick) {
|
|
|
8280
8632
|
const style = {
|
|
8281
8633
|
fill: { kind: "none" },
|
|
8282
8634
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8283
|
-
strokeWidth:
|
|
8635
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1)
|
|
8284
8636
|
};
|
|
8285
8637
|
if (geometry.circular) {
|
|
8286
8638
|
return {
|
|
@@ -8317,7 +8669,7 @@ function renderSpokes(context, geometry) {
|
|
|
8317
8669
|
style: {
|
|
8318
8670
|
fill: { kind: "none" },
|
|
8319
8671
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8320
|
-
strokeWidth:
|
|
8672
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1)
|
|
8321
8673
|
}
|
|
8322
8674
|
};
|
|
8323
8675
|
});
|
|
@@ -8337,7 +8689,7 @@ function createCategoryLabel(context, geometry, category, categoryIndex) {
|
|
|
8337
8689
|
const labelPoint = geometry.pointAt(geometry.radius + 10, categoryIndex);
|
|
8338
8690
|
const horizontalOffset = labelPoint.x - geometry.centerX;
|
|
8339
8691
|
const width = Math.max(64, Math.min(120, plot.width / 3));
|
|
8340
|
-
return
|
|
8692
|
+
return chunkUHKFJBY5_cjs.chartText({
|
|
8341
8693
|
id: `chart-radar-label-${chart.id}-${categoryIndex}`,
|
|
8342
8694
|
order: nextOrder(),
|
|
8343
8695
|
bounds,
|
|
@@ -8375,9 +8727,9 @@ function renderRadarSeries(context, geometry) {
|
|
|
8375
8727
|
return nodes;
|
|
8376
8728
|
}
|
|
8377
8729
|
function renderSeries(context, geometry, series, seriesIndex) {
|
|
8378
|
-
const color = series.color ??
|
|
8730
|
+
const color = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
8379
8731
|
const points = seriesPoints(series, context, geometry);
|
|
8380
|
-
const path =
|
|
8732
|
+
const path = chunkUHKFJBY5_cjs.radarSeriesPath(points, geometry.circular, geometry.tension);
|
|
8381
8733
|
return [
|
|
8382
8734
|
createSeriesFill(context, geometry, series, path, color),
|
|
8383
8735
|
...geometry.strokeWidth > 0 ? [createSeriesStroke(context, geometry, series, path, color)] : [],
|
|
@@ -8400,7 +8752,7 @@ function createSeriesFill(context, geometry, series, path, color) {
|
|
|
8400
8752
|
d: path,
|
|
8401
8753
|
detail: { of: "chartSeries", series: series.id },
|
|
8402
8754
|
style: {
|
|
8403
|
-
fill:
|
|
8755
|
+
fill: chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id),
|
|
8404
8756
|
stroke: { kind: "none" },
|
|
8405
8757
|
opacity: Math.max(0, Math.min(1, series.opacity ?? geometry.areaOpacity))
|
|
8406
8758
|
}
|
|
@@ -8417,10 +8769,10 @@ function createSeriesStroke(context, geometry, series, path, color) {
|
|
|
8417
8769
|
detail: { of: "chartSeries", series: series.id },
|
|
8418
8770
|
style: {
|
|
8419
8771
|
fill: { kind: "none" },
|
|
8420
|
-
stroke:
|
|
8772
|
+
stroke: chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id),
|
|
8421
8773
|
strokeWidth: geometry.strokeWidth,
|
|
8422
8774
|
lineJoin: "round",
|
|
8423
|
-
shadow:
|
|
8775
|
+
shadow: chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle)
|
|
8424
8776
|
}
|
|
8425
8777
|
};
|
|
8426
8778
|
}
|
|
@@ -8436,8 +8788,8 @@ function createSeriesPoints(context, geometry, series, points, color) {
|
|
|
8436
8788
|
rx: geometry.pointSize,
|
|
8437
8789
|
ry: geometry.pointSize,
|
|
8438
8790
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex, mark: "radar-vertex" },
|
|
8439
|
-
prop:
|
|
8440
|
-
style: { fill:
|
|
8791
|
+
prop: chunkUHKFJBY5_cjs.seriesValueProp(series.id, pointIndex),
|
|
8792
|
+
style: { fill: chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id) }
|
|
8441
8793
|
}));
|
|
8442
8794
|
}
|
|
8443
8795
|
|
|
@@ -8491,25 +8843,25 @@ function ringProgressPath(cx, cy, r, sweep, from) {
|
|
|
8491
8843
|
}
|
|
8492
8844
|
function layoutOf2(context) {
|
|
8493
8845
|
const { chart, plot } = context;
|
|
8494
|
-
const axisMin =
|
|
8846
|
+
const axisMin = chunkUHKFJBY5_cjs.finite(chart.axisY.min, 0);
|
|
8495
8847
|
return {
|
|
8496
8848
|
centerX: plot.x + plot.width / 2,
|
|
8497
8849
|
centerY: plot.y + plot.height / 2,
|
|
8498
8850
|
outerRadius: Math.max(1, Math.min(plot.width, plot.height) / 2 - 4),
|
|
8499
|
-
ringThickness: Math.max(1,
|
|
8500
|
-
ringGap: Math.max(0,
|
|
8851
|
+
ringThickness: Math.max(1, chunkUHKFJBY5_cjs.finite(chart.config?.ringThickness, DEFAULT_RING_THICKNESS)),
|
|
8852
|
+
ringGap: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.ringGap, DEFAULT_RING_GAP)),
|
|
8501
8853
|
axisMin,
|
|
8502
|
-
range:
|
|
8503
|
-
start: TOP3 +
|
|
8504
|
-
total: Math.min(360, Math.max(1,
|
|
8505
|
-
trackOpacity: Math.min(1, Math.max(0,
|
|
8854
|
+
range: chunkUHKFJBY5_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
8855
|
+
start: TOP3 + chunkUHKFJBY5_cjs.finite(chart.config?.ringStartAngle, 0) * Math.PI / 180,
|
|
8856
|
+
total: Math.min(360, Math.max(1, chunkUHKFJBY5_cjs.finite(chart.config?.ringSweep, 360))) * Math.PI / 180,
|
|
8857
|
+
trackOpacity: Math.min(1, Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.ringTrackOpacity, TRACK_OPACITY))),
|
|
8506
8858
|
cap: chart.config?.ringCap ?? "round"
|
|
8507
8859
|
};
|
|
8508
8860
|
}
|
|
8509
8861
|
function ringEndShadows(context, layout, series, radius, sweep, color) {
|
|
8510
8862
|
const { chart, bounds, nextOrder } = context;
|
|
8511
8863
|
const { centerX, centerY, ringThickness, start } = layout;
|
|
8512
|
-
const shadow =
|
|
8864
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8513
8865
|
const isFullCircle = sweep >= Math.PI * 2 - FULL_SWEEP_EPSILON;
|
|
8514
8866
|
if (!shadow || isFullCircle) {
|
|
8515
8867
|
return [];
|
|
@@ -8547,8 +8899,8 @@ function ringNodes2(context, layout, series, index) {
|
|
|
8547
8899
|
if (radius <= ringThickness / 2) {
|
|
8548
8900
|
return [];
|
|
8549
8901
|
}
|
|
8550
|
-
const color =
|
|
8551
|
-
const value = Math.max(0,
|
|
8902
|
+
const color = chunkUHKFJBY5_cjs.paint(series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[index % chunkUHKFJBY5_cjs.CHART_COLORS.length], diagnostics, chart.id);
|
|
8903
|
+
const value = Math.max(0, chunkUHKFJBY5_cjs.finite(series.values[0], 0));
|
|
8552
8904
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
8553
8905
|
const trackStyle = {
|
|
8554
8906
|
fill: { kind: "none" },
|
|
@@ -8586,7 +8938,7 @@ function ringNodes2(context, layout, series, index) {
|
|
|
8586
8938
|
bounds,
|
|
8587
8939
|
d: ringProgressPath(centerX, centerY, radius, sweep, start),
|
|
8588
8940
|
detail: { of: "chartValue", series: series.id, valueIndex: 0, mark: "radial-bar-ring" },
|
|
8589
|
-
prop:
|
|
8941
|
+
prop: chunkUHKFJBY5_cjs.seriesValueProp(series.id, 0),
|
|
8590
8942
|
style: { fill: { kind: "none" }, stroke: color, strokeWidth: ringThickness, lineCap: cap }
|
|
8591
8943
|
};
|
|
8592
8944
|
return [track, ...casters, progress];
|
|
@@ -8598,7 +8950,7 @@ function renderRadialBar(context) {
|
|
|
8598
8950
|
|
|
8599
8951
|
// src/renderScene/charts/renderers/sankey/links.ts
|
|
8600
8952
|
function renderSankeyLinks(context, data) {
|
|
8601
|
-
const shadow =
|
|
8953
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
8602
8954
|
const gradient = Boolean(context.chart.config?.linkGradient);
|
|
8603
8955
|
const { plot } = context;
|
|
8604
8956
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
@@ -8619,8 +8971,8 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
8619
8971
|
bottom: data.baseY + link.targetY1
|
|
8620
8972
|
};
|
|
8621
8973
|
const config = context.chart.config;
|
|
8622
|
-
const fromColor = link.color || data.nodeColors.get(link.source) ||
|
|
8623
|
-
const toColor = data.nodeColors.get(link.target) ||
|
|
8974
|
+
const fromColor = link.color || data.nodeColors.get(link.source) || chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL;
|
|
8975
|
+
const toColor = data.nodeColors.get(link.target) || chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL;
|
|
8624
8976
|
const fill2 = gradient ? {
|
|
8625
8977
|
kind: "linear-gradient",
|
|
8626
8978
|
angle: 0,
|
|
@@ -8635,9 +8987,9 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
8635
8987
|
toId: link.target,
|
|
8636
8988
|
source,
|
|
8637
8989
|
target,
|
|
8638
|
-
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0,
|
|
8990
|
+
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0, chunkUHKFJBY5_cjs.finite(config?.sankeyLinkCurve, 0.5))),
|
|
8639
8991
|
fill: fill2,
|
|
8640
|
-
opacity: Math.min(1, Math.max(0,
|
|
8992
|
+
opacity: Math.min(1, Math.max(0, chunkUHKFJBY5_cjs.finite(config?.sankeyLinkOpacity, link.color ? 0.85 : 0.45)))
|
|
8641
8993
|
};
|
|
8642
8994
|
}
|
|
8643
8995
|
function createSankeyRibbonNode(context, ribbon, shadow, clipPath, gradient) {
|
|
@@ -8678,7 +9030,7 @@ function sankeyRibbonPath(ribbon) {
|
|
|
8678
9030
|
var OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG = 0.3;
|
|
8679
9031
|
var OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG = 0.78;
|
|
8680
9032
|
function renderSankeyNodes(context, data) {
|
|
8681
|
-
const cornerRadius = Math.max(0,
|
|
9033
|
+
const cornerRadius = Math.max(0, chunkUHKFJBY5_cjs.finite(context.chart.config?.barCornerRadius, 0));
|
|
8682
9034
|
const nodes = [];
|
|
8683
9035
|
data.nodes.forEach((node) => {
|
|
8684
9036
|
nodes.push(createNodeRect(context, data, node, cornerRadius));
|
|
@@ -8694,8 +9046,8 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
8694
9046
|
const x = data.baseX + node.x;
|
|
8695
9047
|
const y = data.baseY + node.y;
|
|
8696
9048
|
const style = {
|
|
8697
|
-
fill: { kind: "solid", color: node.color ||
|
|
8698
|
-
shadow:
|
|
9049
|
+
fill: { kind: "solid", color: node.color || chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL },
|
|
9050
|
+
shadow: chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle)
|
|
8699
9051
|
};
|
|
8700
9052
|
const isFirstColumn = node.column === 0;
|
|
8701
9053
|
const isLastColumn = node.column === data.columnCount - 1;
|
|
@@ -8721,7 +9073,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
8721
9073
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
8722
9074
|
order: nextOrder(),
|
|
8723
9075
|
bounds,
|
|
8724
|
-
d:
|
|
9076
|
+
d: chunkUHKFJBY5_cjs.leftRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
8725
9077
|
style,
|
|
8726
9078
|
detail
|
|
8727
9079
|
};
|
|
@@ -8732,7 +9084,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
8732
9084
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
8733
9085
|
order: nextOrder(),
|
|
8734
9086
|
bounds,
|
|
8735
|
-
d:
|
|
9087
|
+
d: chunkUHKFJBY5_cjs.rightRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
8736
9088
|
style,
|
|
8737
9089
|
detail
|
|
8738
9090
|
};
|
|
@@ -8758,9 +9110,9 @@ function createNodeLabel(context, data, node) {
|
|
|
8758
9110
|
return void 0;
|
|
8759
9111
|
}
|
|
8760
9112
|
const fallback = chart.textColor ?? "#0f172a";
|
|
8761
|
-
const defaultColor = position === "inside" ?
|
|
9113
|
+
const defaultColor = position === "inside" ? chunkUHKFJBY5_cjs.contrastTextColor(node.color) : chunkUHKFJBY5_cjs.sameHueTint(
|
|
8762
9114
|
node.color,
|
|
8763
|
-
|
|
9115
|
+
chunkUHKFJBY5_cjs.isLightColor(fallback) ? OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG : OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG
|
|
8764
9116
|
) ?? fallback;
|
|
8765
9117
|
const color = chart.config?.labelColor ?? defaultColor;
|
|
8766
9118
|
return { ...label, color, detail: { of: "chartSeries", series: node.id, mark: "sankey-node-label" } };
|
|
@@ -8772,7 +9124,7 @@ function createOutsideLabel(context, data, node) {
|
|
|
8772
9124
|
const y = data.baseY + node.y;
|
|
8773
9125
|
const labelX2 = isLastColumn ? x - data.labelGutter + 8 : x + node.width + 6;
|
|
8774
9126
|
return {
|
|
8775
|
-
...
|
|
9127
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
8776
9128
|
id: `chart-sankey-label-${chart.id}-${node.id}`,
|
|
8777
9129
|
order: nextOrder(),
|
|
8778
9130
|
bounds,
|
|
@@ -8797,11 +9149,11 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
8797
9149
|
if (orientation === "vertical") {
|
|
8798
9150
|
const thickness = fontSize * 1.4;
|
|
8799
9151
|
const width = Math.max(1, node.height - 8);
|
|
8800
|
-
if (
|
|
9152
|
+
if (chunkUHKFJBY5_cjs.estimateTextWidth(node.label, fontSize, false) > width) {
|
|
8801
9153
|
return void 0;
|
|
8802
9154
|
}
|
|
8803
9155
|
return {
|
|
8804
|
-
...
|
|
9156
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
8805
9157
|
id,
|
|
8806
9158
|
order: nextOrder(),
|
|
8807
9159
|
bounds,
|
|
@@ -8818,7 +9170,7 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
8818
9170
|
};
|
|
8819
9171
|
}
|
|
8820
9172
|
return {
|
|
8821
|
-
...
|
|
9173
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
8822
9174
|
id,
|
|
8823
9175
|
order: nextOrder(),
|
|
8824
9176
|
bounds,
|
|
@@ -8839,18 +9191,18 @@ function createSankeyRenderData(context) {
|
|
|
8839
9191
|
const labelGutter = showLabels ? 92 : 0;
|
|
8840
9192
|
const availableWidth = Math.max(1, plot.width - labelGutter * 2);
|
|
8841
9193
|
const layout = layoutSankey(createNodeInputs(context), createLinkInputs(context), availableWidth, plot.height, {
|
|
8842
|
-
nodeWidth: Math.max(1,
|
|
8843
|
-
nodeGap: Math.max(0,
|
|
9194
|
+
nodeWidth: Math.max(1, chunkUHKFJBY5_cjs.finite(chart.config?.sankeyNodeWidth, 18)),
|
|
9195
|
+
nodeGap: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.sankeyNodeGap, 8))
|
|
8844
9196
|
});
|
|
8845
9197
|
return {
|
|
8846
9198
|
...layout,
|
|
8847
9199
|
baseX: plot.x + labelGutter,
|
|
8848
9200
|
baseY: plot.y,
|
|
8849
9201
|
labelGutter,
|
|
8850
|
-
fontSize: Math.max(9,
|
|
8851
|
-
labelSize: Math.max(6,
|
|
9202
|
+
fontSize: Math.max(9, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12)),
|
|
9203
|
+
labelSize: Math.max(6, chunkUHKFJBY5_cjs.finite(chart.config?.sankeyLabelSize, Math.max(9, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
8852
9204
|
columnCount: Math.max(1, ...layout.nodes.map((node) => node.column + 1)),
|
|
8853
|
-
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color ||
|
|
9205
|
+
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color || chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL]))
|
|
8854
9206
|
};
|
|
8855
9207
|
}
|
|
8856
9208
|
function createNodeInputs(context) {
|
|
@@ -8872,7 +9224,7 @@ function createLinkInputs(context) {
|
|
|
8872
9224
|
source: series.source,
|
|
8873
9225
|
target: series.target,
|
|
8874
9226
|
value: series.values[0] ?? 0,
|
|
8875
|
-
color: series.color ?
|
|
9227
|
+
color: series.color ? chunkUHKFJBY5_cjs.representativeColor(series.color, chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL) : void 0
|
|
8876
9228
|
});
|
|
8877
9229
|
});
|
|
8878
9230
|
return inputs;
|
|
@@ -8891,9 +9243,9 @@ function renderSankey(context) {
|
|
|
8891
9243
|
var DEFAULT_POINT_SIZE = 4;
|
|
8892
9244
|
function renderScatter(context) {
|
|
8893
9245
|
const nodes = [];
|
|
8894
|
-
const shadow =
|
|
9246
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
8895
9247
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
8896
|
-
const color = series.color ??
|
|
9248
|
+
const color = series.color ?? chunkUHKFJBY5_cjs.CHART_COLORS[seriesIndex % chunkUHKFJBY5_cjs.CHART_COLORS.length];
|
|
8897
9249
|
const points = pixelPoints(context, seriesValuePairs(context.chart, series));
|
|
8898
9250
|
points.forEach((point, pointIndex) => {
|
|
8899
9251
|
nodes.push(createScatterPoint(context, series, point, pointIndex, color, shadow));
|
|
@@ -8917,8 +9269,8 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
8917
9269
|
ry: radius,
|
|
8918
9270
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex },
|
|
8919
9271
|
style: {
|
|
8920
|
-
fill:
|
|
8921
|
-
stroke: strokeWidth > 0 ?
|
|
9272
|
+
fill: chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id),
|
|
9273
|
+
stroke: strokeWidth > 0 ? chunkUHKFJBY5_cjs.paint(config?.pointStrokeColor ?? color, diagnostics, chart.id) : void 0,
|
|
8922
9274
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
8923
9275
|
opacity: config?.pointOpacity,
|
|
8924
9276
|
shadow
|
|
@@ -8929,14 +9281,14 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
8929
9281
|
// src/renderScene/charts/renderers/treemap/layout.ts
|
|
8930
9282
|
function createTreemapLayout(context) {
|
|
8931
9283
|
const { chart, plot, showLegend } = context;
|
|
8932
|
-
const fontSize = Math.max(9,
|
|
9284
|
+
const fontSize = Math.max(9, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12));
|
|
8933
9285
|
const legendPosition = chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : "bottom";
|
|
8934
9286
|
const legendHeight = showLegend && legendPosition === "bottom" ? 48 : 0;
|
|
8935
|
-
const cellGap = Math.max(0,
|
|
9287
|
+
const cellGap = Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.cellGap, 0));
|
|
8936
9288
|
return {
|
|
8937
9289
|
leaves: chart.series,
|
|
8938
|
-
bands:
|
|
8939
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
9290
|
+
bands: chunkUHKFJBY5_cjs.axisBands(chart.axisY),
|
|
9291
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkUHKFJBY5_cjs.DEFAULT_HEATMAP_ZONES,
|
|
8940
9292
|
fontSize,
|
|
8941
9293
|
smallFontSize: Math.max(8, fontSize - 1),
|
|
8942
9294
|
legendPosition,
|
|
@@ -8944,18 +9296,18 @@ function createTreemapLayout(context) {
|
|
|
8944
9296
|
gridWidth: Math.max(1, plot.width),
|
|
8945
9297
|
gridHeight: Math.max(1, plot.height - legendHeight),
|
|
8946
9298
|
cellGap,
|
|
8947
|
-
cellRadius: Math.max(0,
|
|
8948
|
-
headerHeight: Math.max(0,
|
|
8949
|
-
labelSize: Math.max(6,
|
|
8950
|
-
valueSize: Math.max(6,
|
|
8951
|
-
labelPadding: Math.max(0,
|
|
9299
|
+
cellRadius: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.barCornerRadius, cellGap)),
|
|
9300
|
+
headerHeight: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.headerHeight, 20)),
|
|
9301
|
+
labelSize: Math.max(6, chunkUHKFJBY5_cjs.finite(chart.config?.tileLabelSize, Math.max(8, fontSize - 1))),
|
|
9302
|
+
valueSize: Math.max(6, chunkUHKFJBY5_cjs.finite(chart.config?.tileValueSize, Math.max(8, fontSize - 1))),
|
|
9303
|
+
labelPadding: Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.tileLabelPadding, 4))
|
|
8952
9304
|
};
|
|
8953
9305
|
}
|
|
8954
9306
|
function treemapLeafValue(leaf) {
|
|
8955
9307
|
return leaf.values[0] ?? 0;
|
|
8956
9308
|
}
|
|
8957
9309
|
function treemapLeafColor(leaf, layout) {
|
|
8958
|
-
return leaf.color ??
|
|
9310
|
+
return leaf.color ?? chunkUHKFJBY5_cjs.zoneColorAtValue(treemapLeafValue(leaf), layout.bands, layout.zones);
|
|
8959
9311
|
}
|
|
8960
9312
|
|
|
8961
9313
|
// src/renderScene/charts/renderers/treemap/legend.ts
|
|
@@ -8980,7 +9332,7 @@ function bandStops(layout) {
|
|
|
8980
9332
|
const zones = layout.zones.slice(0, bandCount);
|
|
8981
9333
|
return zones.map((zone, index) => ({
|
|
8982
9334
|
offset: bandRatio2(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
8983
|
-
color: zone.color ??
|
|
9335
|
+
color: zone.color ?? chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL
|
|
8984
9336
|
}));
|
|
8985
9337
|
}
|
|
8986
9338
|
function renderBottomLegend(context, layout) {
|
|
@@ -8989,7 +9341,7 @@ function renderBottomLegend(context, layout) {
|
|
|
8989
9341
|
const barWidth = layout.gridWidth;
|
|
8990
9342
|
const labelHeight = layout.fontSize + 2;
|
|
8991
9343
|
const barY = plot.y + layout.gridHeight + CHART_GAP;
|
|
8992
|
-
const barBounds =
|
|
9344
|
+
const barBounds = chunkUHKFJBY5_cjs.boxBounds({ x: barX, y: barY, width: barWidth, height: BAR_THICKNESS2 });
|
|
8993
9345
|
const stops = bandStops(layout);
|
|
8994
9346
|
const bar = {
|
|
8995
9347
|
type: "rect",
|
|
@@ -9003,7 +9355,7 @@ function renderBottomLegend(context, layout) {
|
|
|
9003
9355
|
rx: 3,
|
|
9004
9356
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
9005
9357
|
style: {
|
|
9006
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color:
|
|
9358
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color: chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL },
|
|
9007
9359
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
9008
9360
|
strokeWidth: 1
|
|
9009
9361
|
}
|
|
@@ -9026,12 +9378,12 @@ function renderBottomLegend(context, layout) {
|
|
|
9026
9378
|
const isLast = index === layout.bands.length - 1;
|
|
9027
9379
|
const align = isFirst ? "left" : isLast ? "right" : "center";
|
|
9028
9380
|
const frameX = isFirst ? x : isLast ? x - LABEL_SIZE : x - LABEL_SIZE / 2;
|
|
9029
|
-
const label =
|
|
9381
|
+
const label = chunkUHKFJBY5_cjs.chartText({
|
|
9030
9382
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
9031
9383
|
order: nextOrder(),
|
|
9032
9384
|
bounds,
|
|
9033
9385
|
frame: { x: frameX, y: barY + BAR_THICKNESS2 + TICK_LENGTH3 + ROW_GAP2, width: LABEL_SIZE, height: labelHeight },
|
|
9034
|
-
text:
|
|
9386
|
+
text: chunkUHKFJBY5_cjs.formatFieldValue(value),
|
|
9035
9387
|
chart,
|
|
9036
9388
|
align
|
|
9037
9389
|
});
|
|
@@ -9045,7 +9397,7 @@ function renderSideLegend(context, layout) {
|
|
|
9045
9397
|
const barTop = plot.y;
|
|
9046
9398
|
const barHeight = layout.gridHeight;
|
|
9047
9399
|
const barX = side === "left" ? plot.x - CHART_GAP - BAR_THICKNESS2 : plot.x + layout.gridWidth + CHART_GAP;
|
|
9048
|
-
const barBounds =
|
|
9400
|
+
const barBounds = chunkUHKFJBY5_cjs.boxBounds({ x: barX, y: barTop, width: BAR_THICKNESS2, height: barHeight });
|
|
9049
9401
|
const stops = bandStops(layout);
|
|
9050
9402
|
const bar = {
|
|
9051
9403
|
type: "rect",
|
|
@@ -9059,7 +9411,7 @@ function renderSideLegend(context, layout) {
|
|
|
9059
9411
|
rx: 3,
|
|
9060
9412
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
9061
9413
|
style: {
|
|
9062
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color:
|
|
9414
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color: chunkUHKFJBY5_cjs.DEFAULT_ZONE_FILL },
|
|
9063
9415
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
9064
9416
|
strokeWidth: 1
|
|
9065
9417
|
}
|
|
@@ -9081,12 +9433,12 @@ function renderSideLegend(context, layout) {
|
|
|
9081
9433
|
strokeWidth: 1
|
|
9082
9434
|
}
|
|
9083
9435
|
};
|
|
9084
|
-
const label =
|
|
9436
|
+
const label = chunkUHKFJBY5_cjs.chartText({
|
|
9085
9437
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
9086
9438
|
order: nextOrder(),
|
|
9087
9439
|
bounds,
|
|
9088
9440
|
frame: { x: labelX2, y: y - layout.fontSize / 2, width: LABEL_SIZE, height: layout.fontSize + 2 },
|
|
9089
|
-
text:
|
|
9441
|
+
text: chunkUHKFJBY5_cjs.formatFieldValue(value),
|
|
9090
9442
|
chart,
|
|
9091
9443
|
align: side === "left" ? "right" : "left"
|
|
9092
9444
|
});
|
|
@@ -9174,7 +9526,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
9174
9526
|
};
|
|
9175
9527
|
const smallFontSize = Math.max(8, Math.max(9, chart.fontSize ?? 12) - 1);
|
|
9176
9528
|
const label = {
|
|
9177
|
-
...
|
|
9529
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
9178
9530
|
id: `chart-treemap-header-label-${chart.id}-${index}`,
|
|
9179
9531
|
order: nextOrder(),
|
|
9180
9532
|
bounds,
|
|
@@ -9189,7 +9541,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
9189
9541
|
align: "center"
|
|
9190
9542
|
}),
|
|
9191
9543
|
fontSize: smallFontSize,
|
|
9192
|
-
color:
|
|
9544
|
+
color: chunkUHKFJBY5_cjs.contrastTextColor(fill2)
|
|
9193
9545
|
};
|
|
9194
9546
|
return [background, label];
|
|
9195
9547
|
}
|
|
@@ -9205,7 +9557,7 @@ function renderTile(context, layout, tile, nextTile) {
|
|
|
9205
9557
|
function createTileNode(context, layout, tile, color, nextColor) {
|
|
9206
9558
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
9207
9559
|
const gap = layout.cellGap;
|
|
9208
|
-
const shadow =
|
|
9560
|
+
const shadow = chunkUHKFJBY5_cjs.resolveChartShadow(chart.shadowStyle);
|
|
9209
9561
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
9210
9562
|
const tileX = plot.x + tile.x + gap / 2;
|
|
9211
9563
|
const tileY = plot.y + tile.y + gap / 2;
|
|
@@ -9222,10 +9574,10 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
9222
9574
|
kind: "linear-gradient",
|
|
9223
9575
|
angle: 0,
|
|
9224
9576
|
stops: [
|
|
9225
|
-
{ offset: 0, color:
|
|
9226
|
-
{ offset: 100, color:
|
|
9577
|
+
{ offset: 0, color: chunkUHKFJBY5_cjs.representativeColor(color, fallback) },
|
|
9578
|
+
{ offset: 100, color: chunkUHKFJBY5_cjs.representativeColor(nextColor, fallback) }
|
|
9227
9579
|
]
|
|
9228
|
-
} :
|
|
9580
|
+
} : chunkUHKFJBY5_cjs.paint(color, diagnostics, chart.id);
|
|
9229
9581
|
return {
|
|
9230
9582
|
type: "rect",
|
|
9231
9583
|
id: `chart-treemap-tile-${chart.id}-${tile.item.leaf.id}`,
|
|
@@ -9239,7 +9591,7 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
9239
9591
|
style: {
|
|
9240
9592
|
fill: fill2,
|
|
9241
9593
|
stroke: { kind: "solid", color: chart.config?.tileStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
9242
|
-
strokeWidth:
|
|
9594
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.config?.tileStrokeWidth, chunkUHKFJBY5_cjs.finite(chart.gridWidth, 1)),
|
|
9243
9595
|
shadow,
|
|
9244
9596
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
9245
9597
|
}
|
|
@@ -9254,12 +9606,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
9254
9606
|
const height = Math.max(1, tile.height - gap - pad * 1.5);
|
|
9255
9607
|
const x = plot.x + tile.x + gap / 2 + pad;
|
|
9256
9608
|
const y = plot.y + tile.y + gap / 2 + pad * 0.75;
|
|
9257
|
-
const textColor = chart.config?.tileTextColor ??
|
|
9609
|
+
const textColor = chart.config?.tileTextColor ?? chunkUHKFJBY5_cjs.contrastTextColor(chunkUHKFJBY5_cjs.representativeColor(color, "#ffffff"));
|
|
9258
9610
|
const lineHeight = layout.labelSize * 1.2;
|
|
9259
9611
|
const maxLines = Math.max(1, Math.floor(height / lineHeight));
|
|
9260
|
-
const labelLines =
|
|
9612
|
+
const labelLines = chunkUHKFJBY5_cjs.wrapText(leaf.label, width, layout.labelSize).slice(0, maxLines).map((line) => chunkUHKFJBY5_cjs.ellipsizeToWidth(line, width, layout.labelSize, true));
|
|
9261
9613
|
const label = {
|
|
9262
|
-
...
|
|
9614
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
9263
9615
|
id: `chart-treemap-label-${chart.id}-${leaf.id}`,
|
|
9264
9616
|
order: nextOrder(),
|
|
9265
9617
|
bounds,
|
|
@@ -9273,12 +9625,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
9273
9625
|
color: textColor
|
|
9274
9626
|
};
|
|
9275
9627
|
const valueText = String(value);
|
|
9276
|
-
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 &&
|
|
9628
|
+
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 && chunkUHKFJBY5_cjs.estimateTextWidth(valueText, layout.valueSize, false) <= width;
|
|
9277
9629
|
if (chart.config?.showTileValues === false || !valueFits) {
|
|
9278
9630
|
return [label];
|
|
9279
9631
|
}
|
|
9280
9632
|
const valueNode = {
|
|
9281
|
-
...
|
|
9633
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
9282
9634
|
id: `chart-treemap-value-${chart.id}-${leaf.id}`,
|
|
9283
9635
|
order: nextOrder(),
|
|
9284
9636
|
bounds,
|
|
@@ -9355,7 +9707,7 @@ function buildCartesianChart(foundation) {
|
|
|
9355
9707
|
|
|
9356
9708
|
// src/renderScene/charts/chartFrame.ts
|
|
9357
9709
|
function scaleDetail(chart, plot) {
|
|
9358
|
-
const horizontal =
|
|
9710
|
+
const horizontal = chunkUHKFJBY5_cjs.isHorizontalBar(chart);
|
|
9359
9711
|
const range = horizontal ? `${plot.x},${plot.width}` : `${plot.y},${plot.height}`;
|
|
9360
9712
|
return {
|
|
9361
9713
|
of: "chartScale",
|
|
@@ -9363,7 +9715,7 @@ function scaleDetail(chart, plot) {
|
|
|
9363
9715
|
};
|
|
9364
9716
|
}
|
|
9365
9717
|
function pieDetail(chart, plot) {
|
|
9366
|
-
const { outerRadius, innerRadius, cornerRadius } =
|
|
9718
|
+
const { outerRadius, innerRadius, cornerRadius } = chunkUHKFJBY5_cjs.resolvePieRadii(
|
|
9367
9719
|
plot.width,
|
|
9368
9720
|
plot.height,
|
|
9369
9721
|
chart.config?.innerRadius,
|
|
@@ -9376,8 +9728,8 @@ function pieDetail(chart, plot) {
|
|
|
9376
9728
|
}
|
|
9377
9729
|
function polarAreaDetail(chart, plot) {
|
|
9378
9730
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
9379
|
-
const innerRadius = Math.max(0, Math.min(
|
|
9380
|
-
const cornerRadius = Math.max(0,
|
|
9731
|
+
const innerRadius = Math.max(0, Math.min(chunkUHKFJBY5_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1));
|
|
9732
|
+
const cornerRadius = Math.max(0, chunkUHKFJBY5_cjs.finite(chart.config?.pieCornerRadius, 0));
|
|
9381
9733
|
return {
|
|
9382
9734
|
of: "pieGeometry",
|
|
9383
9735
|
pieGeometry: `${plot.x + plot.width / 2},${plot.y + plot.height / 2},${maxRadius},${innerRadius},${cornerRadius}`
|
|
@@ -9386,8 +9738,8 @@ function polarAreaDetail(chart, plot) {
|
|
|
9386
9738
|
function radarDetail(chart, plot) {
|
|
9387
9739
|
const configuredCount = (chart.config?.categories?.filter(Boolean) ?? []).length;
|
|
9388
9740
|
const dataCount = Math.max(0, ...chart.series.map((series) => series.values.length));
|
|
9389
|
-
const count =
|
|
9390
|
-
const radius =
|
|
9741
|
+
const count = chunkUHKFJBY5_cjs.radarCategoryCount(configuredCount, dataCount);
|
|
9742
|
+
const radius = chunkUHKFJBY5_cjs.radarRadius(plot.width, plot.height, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12), chart.showAxisLabels !== false);
|
|
9391
9743
|
const centerX = plot.x + plot.width / 2;
|
|
9392
9744
|
const centerY = plot.y + plot.height / 2;
|
|
9393
9745
|
const curved = chart.chartType === "radial" ? 1 : 0;
|
|
@@ -9421,9 +9773,9 @@ function buildChartFrame(chart, bounds, plot, order) {
|
|
|
9421
9773
|
height: chart.height,
|
|
9422
9774
|
rx: chart.cornerRadius ?? 12,
|
|
9423
9775
|
style: {
|
|
9424
|
-
fill:
|
|
9776
|
+
fill: chunkUHKFJBY5_cjs.paint(chart.fillColor ?? "#ffffff", [], chart.id),
|
|
9425
9777
|
stroke: { kind: "solid", color: chart.strokeColor ?? "#475569" },
|
|
9426
|
-
strokeWidth:
|
|
9778
|
+
strokeWidth: chunkUHKFJBY5_cjs.finite(chart.strokeWidth, 1)
|
|
9427
9779
|
}
|
|
9428
9780
|
};
|
|
9429
9781
|
const detail = frameDetail(chart, plot);
|
|
@@ -9483,7 +9835,7 @@ function buildChartTitle(chart, bounds, plot, renderOrder) {
|
|
|
9483
9835
|
}
|
|
9484
9836
|
return [
|
|
9485
9837
|
{
|
|
9486
|
-
...
|
|
9838
|
+
...chunkUHKFJBY5_cjs.chartText({
|
|
9487
9839
|
id: `chart-title-${chart.id}`,
|
|
9488
9840
|
order: renderOrder.next(),
|
|
9489
9841
|
bounds,
|
|
@@ -9494,8 +9846,8 @@ function buildChartTitle(chart, bounds, plot, renderOrder) {
|
|
|
9494
9846
|
}),
|
|
9495
9847
|
...chart.titleColor ? { color: chart.titleColor } : {},
|
|
9496
9848
|
fontWeight: chart.titleWeight ?? "bold",
|
|
9497
|
-
fontSize:
|
|
9498
|
-
prop:
|
|
9849
|
+
fontSize: chunkUHKFJBY5_cjs.finite(chart.titleSize, Math.max(10, chunkUHKFJBY5_cjs.finite(chart.fontSize, 12)) + 2),
|
|
9850
|
+
prop: chunkUHKFJBY5_cjs.CHART_TITLE_PROP
|
|
9499
9851
|
}
|
|
9500
9852
|
];
|
|
9501
9853
|
}
|
|
@@ -9548,7 +9900,7 @@ function buildChart(chart, index, diagnostics) {
|
|
|
9548
9900
|
// src/renderScene/charts/artifacts.ts
|
|
9549
9901
|
function buildCharts(charts, diagnostics) {
|
|
9550
9902
|
return charts.flatMap(
|
|
9551
|
-
(chart, index) =>
|
|
9903
|
+
(chart, index) => chunkUHKFJBY5_cjs.tag(buildChart(chart, index, diagnostics), "chart", chart.id, chart.chartType, chart.title ?? "Chart")
|
|
9552
9904
|
);
|
|
9553
9905
|
}
|
|
9554
9906
|
|
|
@@ -9649,7 +10001,7 @@ function visibleBounds(node) {
|
|
|
9649
10001
|
}
|
|
9650
10002
|
function sceneBounds(nodes) {
|
|
9651
10003
|
if (!nodes.length) {
|
|
9652
|
-
return
|
|
10004
|
+
return chunkUHKFJBY5_cjs.EMPTY_BOUNDS;
|
|
9653
10005
|
}
|
|
9654
10006
|
const all = nodes.map(visibleBounds);
|
|
9655
10007
|
return {
|
|
@@ -9664,8 +10016,8 @@ function stackingOf(input) {
|
|
|
9664
10016
|
const add = (role, objects, legacyBase) => {
|
|
9665
10017
|
objects.forEach((object, index) => {
|
|
9666
10018
|
stacking.set(`${role}:${object.id}`, {
|
|
9667
|
-
rank:
|
|
9668
|
-
sequence:
|
|
10019
|
+
rank: chunkUHKFJBY5_cjs.stackRank(object),
|
|
10020
|
+
sequence: chunkUHKFJBY5_cjs.stackSequence(object, legacyBase + index)
|
|
9669
10021
|
});
|
|
9670
10022
|
});
|
|
9671
10023
|
};
|
|
@@ -9715,7 +10067,7 @@ function buildRenderScene(input, options = {}) {
|
|
|
9715
10067
|
|
|
9716
10068
|
// src/svg/format.ts
|
|
9717
10069
|
var xml = (value) => String(value).replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
9718
|
-
var
|
|
10070
|
+
var num2 = (value) => Number(value.toFixed(3)).toString();
|
|
9719
10071
|
var safeId = (value) => `sf-${value.replace(/[^A-Za-z0-9_.:-]/g, "-")}`;
|
|
9720
10072
|
|
|
9721
10073
|
// src/svg/clipDefinitions.ts
|
|
@@ -9737,7 +10089,7 @@ var SvgClipDefinitions = class {
|
|
|
9737
10089
|
const outer = clip.within ? this.define(clip.within) : void 0;
|
|
9738
10090
|
id = safeId(`${this.prefix}clip-${this.ids.size}`);
|
|
9739
10091
|
this.ids.set(key, id);
|
|
9740
|
-
const shape = clip.type === "path" ? `<path clip-rule="evenodd" d="${xml(clip.d)}"/>` : `<rect x="${
|
|
10092
|
+
const shape = clip.type === "path" ? `<path clip-rule="evenodd" d="${xml(clip.d)}"/>` : `<rect x="${num2(clip.x)}" y="${num2(clip.y)}" width="${num2(clip.width)}" height="${num2(clip.height)}" rx="${num2(clip.rx)}"/>`;
|
|
9741
10093
|
this.addDefinition(`<clipPath id="${id}"${outer ? ` clip-path="url(#${outer})"` : ""}>${shape}</clipPath>`);
|
|
9742
10094
|
}
|
|
9743
10095
|
return id;
|
|
@@ -9779,18 +10131,18 @@ var SvgFilterDefinitions = class {
|
|
|
9779
10131
|
id = safeId(`${this.prefix}shadow-${nodeId}-${this.ids.size}`);
|
|
9780
10132
|
this.ids.set(key, id);
|
|
9781
10133
|
this.addDefinition(
|
|
9782
|
-
`<filter id="${id}" x="${
|
|
10134
|
+
`<filter id="${id}" x="${num2(-margin * 100)}%" y="${num2(-margin * 100)}%" width="${num2((1 + margin * 2) * 100)}%" height="${num2((1 + margin * 2) * 100)}%">${primitives(value)}</filter>`
|
|
9783
10135
|
);
|
|
9784
10136
|
}
|
|
9785
10137
|
return id;
|
|
9786
10138
|
}
|
|
9787
10139
|
};
|
|
9788
10140
|
function outerShadowPrimitives(shadow) {
|
|
9789
|
-
return `<feDropShadow dx="${
|
|
10141
|
+
return `<feDropShadow dx="${num2(shadow.dx)}" dy="${num2(shadow.dy)}" stdDeviation="${num2(shadow.blur / 2)}" flood-color="${xml(shadow.color)}" flood-opacity="${num2(shadow.opacity)}"/>`;
|
|
9790
10142
|
}
|
|
9791
10143
|
function blurPrimitives(effect) {
|
|
9792
|
-
const blur = effect.blur > 0 ? `<feGaussianBlur stdDeviation="${
|
|
9793
|
-
const saturate = effect.saturate === 1 ? "" : `<feColorMatrix type="saturate" values="${
|
|
10144
|
+
const blur = effect.blur > 0 ? `<feGaussianBlur stdDeviation="${num2(effect.blur / 2)}"/>` : "";
|
|
10145
|
+
const saturate = effect.saturate === 1 ? "" : `<feColorMatrix type="saturate" values="${num2(effect.saturate)}"/>`;
|
|
9794
10146
|
return blur + saturate;
|
|
9795
10147
|
}
|
|
9796
10148
|
function innerShadowPrimitives(shadow) {
|
|
@@ -9798,9 +10150,9 @@ function innerShadowPrimitives(shadow) {
|
|
|
9798
10150
|
'<feComponentTransfer in="SourceAlpha" result="sf-inverted-alpha">',
|
|
9799
10151
|
'<feFuncA type="table" tableValues="1 0"/>',
|
|
9800
10152
|
"</feComponentTransfer>",
|
|
9801
|
-
`<feGaussianBlur in="sf-inverted-alpha" stdDeviation="${
|
|
9802
|
-
`<feOffset in="sf-blurred" dx="${
|
|
9803
|
-
`<feFlood flood-color="${xml(shadow.color)}" flood-opacity="${
|
|
10153
|
+
`<feGaussianBlur in="sf-inverted-alpha" stdDeviation="${num2(shadow.blur / 2)}" result="sf-blurred"/>`,
|
|
10154
|
+
`<feOffset in="sf-blurred" dx="${num2(shadow.dx)}" dy="${num2(shadow.dy)}" result="sf-offset"/>`,
|
|
10155
|
+
`<feFlood flood-color="${xml(shadow.color)}" flood-opacity="${num2(shadow.opacity)}" result="sf-color"/>`,
|
|
9804
10156
|
'<feComposite in="sf-color" in2="sf-offset" operator="in" result="sf-halo"/>',
|
|
9805
10157
|
'<feComposite in="sf-halo" in2="SourceGraphic" operator="in" result="sf-inset"/>',
|
|
9806
10158
|
'<feComposite in="sf-inset" in2="SourceGraphic" operator="over"/>'
|
|
@@ -9810,19 +10162,19 @@ function innerShadowPrimitives(shadow) {
|
|
|
9810
10162
|
// src/svg/markerBodies.ts
|
|
9811
10163
|
function markerBody(type, size, color, strokeWidth) {
|
|
9812
10164
|
const bodies = {
|
|
9813
|
-
arrow: `<path d="M ${
|
|
9814
|
-
filled_arrow: `<path d="M ${
|
|
9815
|
-
circle: `<circle cx="0" cy="0" r="${
|
|
9816
|
-
filled_circle: `<circle cx="0" cy="0" r="${
|
|
9817
|
-
diamond: `<path d="M ${
|
|
9818
|
-
filled_diamond: `<path d="M ${
|
|
9819
|
-
bar: `<path d="M 0 ${
|
|
9820
|
-
triangle: `<path d="M ${
|
|
9821
|
-
one: `<path d="M 0 ${
|
|
9822
|
-
zero_one: `<circle cx="${
|
|
9823
|
-
many: `<path d="M ${
|
|
9824
|
-
one_many: `<path d="M ${
|
|
9825
|
-
zero_many: `<circle cx="${
|
|
10165
|
+
arrow: `<path d="M ${num2(-size)} ${num2(-size * 0.6)} L 0 0 L ${num2(-size)} ${num2(size * 0.6)}" fill="none" stroke="${color}" stroke-width="${num2(strokeWidth)}" stroke-linecap="round" stroke-linejoin="round"/>`,
|
|
10166
|
+
filled_arrow: `<path d="M ${num2(-size)} ${num2(-size * 0.6)} L 0 0 L ${num2(-size)} ${num2(size * 0.6)} Z" fill="${color}" stroke="${color}" stroke-width="${num2(strokeWidth * 0.5)}" stroke-linejoin="round"/>`,
|
|
10167
|
+
circle: `<circle cx="0" cy="0" r="${num2(size * 0.5)}" fill="white" stroke="${color}" stroke-width="${num2(strokeWidth)}"/>`,
|
|
10168
|
+
filled_circle: `<circle cx="0" cy="0" r="${num2(size * 0.5)}" fill="${color}"/>`,
|
|
10169
|
+
diamond: `<path d="M ${num2(-size * 0.6)} 0 L 0 ${num2(-size * 0.6)} L ${num2(size * 0.6)} 0 L 0 ${num2(size * 0.6)} Z" fill="white" stroke="${color}" stroke-width="${num2(strokeWidth)}"/>`,
|
|
10170
|
+
filled_diamond: `<path d="M ${num2(-size * 0.6)} 0 L 0 ${num2(-size * 0.6)} L ${num2(size * 0.6)} 0 L 0 ${num2(size * 0.6)} Z" fill="${color}" stroke="${color}" stroke-width="${num2(strokeWidth * 0.5)}"/>`,
|
|
10171
|
+
bar: `<path d="M 0 ${num2(-size * 0.6)} V ${num2(size * 0.6)}" stroke="${color}" stroke-width="${num2(strokeWidth)}" stroke-linecap="round"/>`,
|
|
10172
|
+
triangle: `<path d="M ${num2(-size)} ${num2(-size * 0.72)} L 0 0 L ${num2(-size)} ${num2(size * 0.72)} Z" fill="white" stroke="${color}" stroke-width="${num2(strokeWidth)}" stroke-linejoin="round"/>`,
|
|
10173
|
+
one: `<path d="M 0 ${num2(-size * 0.62)} V ${num2(size * 0.62)} M ${num2(-size * 0.72)} ${num2(-size * 0.62)} V ${num2(size * 0.62)}" stroke="${color}" stroke-width="${num2(strokeWidth)}"/>`,
|
|
10174
|
+
zero_one: `<circle cx="${num2(-size * 0.8)}" cy="0" r="${num2(size * 0.38)}" fill="white" stroke="${color}" stroke-width="${num2(strokeWidth)}"/><path d="M 0 ${num2(-size * 0.62)} V ${num2(size * 0.62)}" stroke="${color}" stroke-width="${num2(strokeWidth)}"/>`,
|
|
10175
|
+
many: `<path d="M ${num2(-size)} ${num2(-size * 0.72)} L 0 0 M ${num2(-size)} 0 L 0 0 M ${num2(-size)} ${num2(size * 0.72)} L 0 0" stroke="${color}" stroke-width="${num2(strokeWidth)}" stroke-linecap="round"/>`,
|
|
10176
|
+
one_many: `<path d="M ${num2(-size)} ${num2(-size * 0.72)} L 0 0 M ${num2(-size)} 0 L 0 0 M ${num2(-size)} ${num2(size * 0.72)} L 0 0 M ${num2(-size * 1.45)} ${num2(-size * 0.62)} V ${num2(size * 0.62)}" stroke="${color}" stroke-width="${num2(strokeWidth)}" stroke-linecap="round"/>`,
|
|
10177
|
+
zero_many: `<circle cx="${num2(-size * 1.45)}" cy="0" r="${num2(size * 0.38)}" fill="white" stroke="${color}" stroke-width="${num2(strokeWidth)}"/><path d="M ${num2(-size)} ${num2(-size * 0.72)} L 0 0 M ${num2(-size)} 0 L 0 0 M ${num2(-size)} ${num2(size * 0.72)} L 0 0" stroke="${color}" stroke-width="${num2(strokeWidth)}" stroke-linecap="round"/>`
|
|
9826
10178
|
};
|
|
9827
10179
|
return bodies[type];
|
|
9828
10180
|
}
|
|
@@ -9833,7 +10185,7 @@ function markerExtent(type, size, strokeWidth) {
|
|
|
9833
10185
|
return Math.max(size * (isCompoundErMarker ? 2 : 1.4), strokeWidth * 2);
|
|
9834
10186
|
}
|
|
9835
10187
|
function markerAttributes(id, extent) {
|
|
9836
|
-
return `id="${id}" markerWidth="${
|
|
10188
|
+
return `id="${id}" markerWidth="${num2(extent * 2)}" markerHeight="${num2(extent * 2)}" viewBox="${num2(-extent)} ${num2(-extent)} ${num2(extent * 2)} ${num2(extent * 2)}" refX="0" refY="0" orient="auto-start-reverse" markerUnits="userSpaceOnUse" overflow="visible"`;
|
|
9837
10189
|
}
|
|
9838
10190
|
var SvgMarkerDefinitions = class {
|
|
9839
10191
|
constructor(addDefinition, prefix) {
|
|
@@ -9868,7 +10220,7 @@ function meshGradientDefinition(id, paint2) {
|
|
|
9868
10220
|
const radialDefinitions = paint2.points.map((point, index) => {
|
|
9869
10221
|
const centerX = Math.max(0, Math.min(100, point.x));
|
|
9870
10222
|
const centerY = Math.max(0, Math.min(100, point.y));
|
|
9871
|
-
return `<radialGradient id="${radialIds[index]}" gradientUnits="objectBoundingBox" cx="${
|
|
10223
|
+
return `<radialGradient id="${radialIds[index]}" gradientUnits="objectBoundingBox" cx="${num2(centerX)}%" cy="${num2(centerY)}%" r="75%"><stop offset="0%" stop-color="${xml(point.color)}" stop-opacity="1"/><stop offset="100%" stop-color="${xml(point.color)}" stop-opacity="0"/></radialGradient>`;
|
|
9872
10224
|
}).join("");
|
|
9873
10225
|
const layers = paint2.points.map((_point, index) => `<rect width="1" height="1" fill="url(#${radialIds[index]})"/>`).join("");
|
|
9874
10226
|
return `${radialDefinitions}<pattern id="${id}" patternUnits="objectBoundingBox" patternContentUnits="objectBoundingBox" width="1" height="1"><rect width="1" height="1" fill="${xml(paint2.points[0]?.color ?? "transparent")}"/>${layers}</pattern>`;
|
|
@@ -9880,8 +10232,8 @@ function linearGradientDefinition(id, paint2, bounds) {
|
|
|
9880
10232
|
const radius = Math.max(bounds.maxX - bounds.minX, bounds.maxY - bounds.minY) / 2;
|
|
9881
10233
|
const deltaX = Math.cos(angle) * radius;
|
|
9882
10234
|
const deltaY = Math.sin(angle) * radius;
|
|
9883
|
-
const stops = paint2.stops.map((stop) => `<stop offset="${
|
|
9884
|
-
return `<linearGradient id="${id}" gradientUnits="userSpaceOnUse" x1="${
|
|
10235
|
+
const stops = paint2.stops.map((stop) => `<stop offset="${num2(Math.max(0, Math.min(100, stop.offset)))}%" stop-color="${xml(stop.color)}"/>`).join("");
|
|
10236
|
+
return `<linearGradient id="${id}" gradientUnits="userSpaceOnUse" x1="${num2(centerX - deltaX)}" y1="${num2(centerY - deltaY)}" x2="${num2(centerX + deltaX)}" y2="${num2(centerY + deltaY)}">${stops}</linearGradient>`;
|
|
9885
10237
|
}
|
|
9886
10238
|
var SvgPaintDefinitions = class {
|
|
9887
10239
|
constructor(addDefinition, prefix) {
|
|
@@ -9998,10 +10350,10 @@ function styleAttrs(node, defs) {
|
|
|
9998
10350
|
}
|
|
9999
10351
|
function addStrokeAttrs(attrs, style) {
|
|
10000
10352
|
if (style.strokeWidth !== void 0) {
|
|
10001
|
-
attrs.push(`stroke-width="${
|
|
10353
|
+
attrs.push(`stroke-width="${num2(style.strokeWidth)}"`);
|
|
10002
10354
|
}
|
|
10003
10355
|
if (style.dash?.length) {
|
|
10004
|
-
attrs.push(`stroke-dasharray="${style.dash.map(
|
|
10356
|
+
attrs.push(`stroke-dasharray="${style.dash.map(num2).join(" ")}"`);
|
|
10005
10357
|
}
|
|
10006
10358
|
if (style.lineCap) {
|
|
10007
10359
|
attrs.push(`stroke-linecap="${style.lineCap}"`);
|
|
@@ -10010,14 +10362,14 @@ function addStrokeAttrs(attrs, style) {
|
|
|
10010
10362
|
attrs.push(`stroke-linejoin="${style.lineJoin}"`);
|
|
10011
10363
|
}
|
|
10012
10364
|
if (style.opacity !== void 0) {
|
|
10013
|
-
attrs.push(`opacity="${
|
|
10365
|
+
attrs.push(`opacity="${num2(style.opacity)}"`);
|
|
10014
10366
|
}
|
|
10015
10367
|
if (style.pointerEvents) {
|
|
10016
10368
|
attrs.push(`pointer-events="${style.pointerEvents}"`);
|
|
10017
10369
|
}
|
|
10018
10370
|
const css = [];
|
|
10019
10371
|
if (style.transition && style.transition > 0) {
|
|
10020
|
-
const time = `${
|
|
10372
|
+
const time = `${num2(style.transition)}ms ease`;
|
|
10021
10373
|
css.push(
|
|
10022
10374
|
`transition: x ${time}, y ${time}, width ${time}, height ${time}, cx ${time}, cy ${time}, rx ${time}, ry ${time}, fill ${time}, stroke ${time}, stroke-width ${time}, stroke-dasharray ${time}, opacity ${time}`
|
|
10023
10375
|
);
|
|
@@ -10037,6 +10389,10 @@ function elementSize(node) {
|
|
|
10037
10389
|
if (shape.type === "rect" && shape.width !== void 0 && shape.height !== void 0) {
|
|
10038
10390
|
return Math.min(shape.width, shape.height);
|
|
10039
10391
|
}
|
|
10392
|
+
if (shape.type === "path" && shape.bounds) {
|
|
10393
|
+
const side = Math.min(shape.bounds.maxX - shape.bounds.minX, shape.bounds.maxY - shape.bounds.minY);
|
|
10394
|
+
return side > 0 ? side : void 0;
|
|
10395
|
+
}
|
|
10040
10396
|
return void 0;
|
|
10041
10397
|
}
|
|
10042
10398
|
function addVisualEffectAttrs(attrs, node, defs) {
|
|
@@ -10063,12 +10419,12 @@ function addPathMarkerAttrs(attrs, node, defs) {
|
|
|
10063
10419
|
}
|
|
10064
10420
|
}
|
|
10065
10421
|
function transform(rotation, center) {
|
|
10066
|
-
return rotation && center ? ` transform="rotate(${
|
|
10422
|
+
return rotation && center ? ` transform="rotate(${num2(rotation)} ${num2(center.x)} ${num2(center.y)})"` : "";
|
|
10067
10423
|
}
|
|
10068
10424
|
function imageAttrs(node, defs) {
|
|
10069
10425
|
const attrs = [];
|
|
10070
10426
|
if (node.style.opacity !== void 0) {
|
|
10071
|
-
attrs.push(`opacity="${
|
|
10427
|
+
attrs.push(`opacity="${num2(node.style.opacity)}"`);
|
|
10072
10428
|
}
|
|
10073
10429
|
if (node.style.pointerEvents) {
|
|
10074
10430
|
attrs.push(`pointer-events="${node.style.pointerEvents}"`);
|
|
@@ -10130,12 +10486,12 @@ function chartValueAttrs(detail) {
|
|
|
10130
10486
|
`data-sf-series="${xml(detail.series)}"`,
|
|
10131
10487
|
`data-sf-value-index="${detail.valueIndex}"`,
|
|
10132
10488
|
detail.mark ? `data-sf-mark="${detail.mark}"` : void 0,
|
|
10133
|
-
detail.radius !== void 0 ? `data-sf-bar-radius="${
|
|
10489
|
+
detail.radius !== void 0 ? `data-sf-bar-radius="${num2(detail.radius)}"` : void 0,
|
|
10134
10490
|
detail.colorProp ? `data-sf-color-prop="${xml(detail.colorProp)}"` : void 0,
|
|
10135
10491
|
detail.hasColorOverride ? 'data-sf-color-override="true"' : void 0,
|
|
10136
|
-
detail.pieStart !== void 0 ? `data-sf-pie-start="${
|
|
10137
|
-
detail.pieEnd !== void 0 ? `data-sf-pie-end="${
|
|
10138
|
-
detail.pieValue !== void 0 ? `data-sf-pie-value="${
|
|
10492
|
+
detail.pieStart !== void 0 ? `data-sf-pie-start="${num2(detail.pieStart)}"` : void 0,
|
|
10493
|
+
detail.pieEnd !== void 0 ? `data-sf-pie-end="${num2(detail.pieEnd)}"` : void 0,
|
|
10494
|
+
detail.pieValue !== void 0 ? `data-sf-pie-value="${num2(detail.pieValue)}"` : void 0
|
|
10139
10495
|
];
|
|
10140
10496
|
}
|
|
10141
10497
|
function pieGeometryAttrs(detail) {
|
|
@@ -10150,39 +10506,39 @@ function chartScaleAttrs(detail) {
|
|
|
10150
10506
|
function chartSeriesAttrs(detail) {
|
|
10151
10507
|
return [
|
|
10152
10508
|
`data-sf-series="${xml(detail.series)}"`,
|
|
10153
|
-
detail.lineTension !== void 0 ? `data-sf-line-tension="${
|
|
10509
|
+
detail.lineTension !== void 0 ? `data-sf-line-tension="${num2(detail.lineTension)}"` : void 0,
|
|
10154
10510
|
detail.mark ? `data-sf-mark="${xml(detail.mark)}"` : void 0,
|
|
10155
10511
|
detail.pulled ? 'data-sf-label-pulled="true"' : void 0,
|
|
10156
|
-
detail.midAngle !== void 0 ? `data-sf-pie-mid-angle="${
|
|
10157
|
-
detail.wedgeRadius !== void 0 ? `data-sf-pie-wedge-radius="${
|
|
10512
|
+
detail.midAngle !== void 0 ? `data-sf-pie-mid-angle="${num2(detail.midAngle)}"` : void 0,
|
|
10513
|
+
detail.wedgeRadius !== void 0 ? `data-sf-pie-wedge-radius="${num2(detail.wedgeRadius)}"` : void 0
|
|
10158
10514
|
];
|
|
10159
10515
|
}
|
|
10160
10516
|
function frameBoundaryAttrs(detail) {
|
|
10161
|
-
return [`${
|
|
10517
|
+
return [`${chunkUHKFJBY5_cjs.CORNER_RADIUS_ATTR}="${num2(detail.cornerRadius)}"`, `${chunkUHKFJBY5_cjs.SQUARE_CORNER_ATTR}="${detail.squareCorner}"`];
|
|
10162
10518
|
}
|
|
10163
10519
|
function declaredBoundsAttr(bounds) {
|
|
10164
|
-
return `${
|
|
10520
|
+
return `${chunkUHKFJBY5_cjs.SYMBOL_BOUNDS_ATTR}="${num2(bounds.x)},${num2(bounds.y)},${num2(bounds.width)},${num2(bounds.height)}"`;
|
|
10165
10521
|
}
|
|
10166
10522
|
function symbolGeometryAttrs(detail) {
|
|
10167
10523
|
return [
|
|
10168
|
-
`${
|
|
10169
|
-
`${
|
|
10524
|
+
`${chunkUHKFJBY5_cjs.SYMBOL_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
10525
|
+
`${chunkUHKFJBY5_cjs.SYMBOL_TENSION_ATTR}="${num2(detail.tension)}"`,
|
|
10170
10526
|
declaredBoundsAttr(detail.declaredBounds)
|
|
10171
10527
|
];
|
|
10172
10528
|
}
|
|
10173
10529
|
function pathGeometryAttrs(detail) {
|
|
10174
10530
|
return [
|
|
10175
|
-
`${
|
|
10176
|
-
`${
|
|
10177
|
-
`${
|
|
10531
|
+
`${chunkUHKFJBY5_cjs.PATH_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
10532
|
+
`${chunkUHKFJBY5_cjs.PATH_TENSION_ATTR}="${num2(detail.tension)}"`,
|
|
10533
|
+
`${chunkUHKFJBY5_cjs.PATH_CLOSED_ATTR}="${detail.closed}"`
|
|
10178
10534
|
];
|
|
10179
10535
|
}
|
|
10180
10536
|
function isometricGeometryAttrs(detail) {
|
|
10181
10537
|
return [
|
|
10182
|
-
`${
|
|
10183
|
-
`${
|
|
10538
|
+
`${chunkUHKFJBY5_cjs.ISOMETRIC_SIZE_ATTR}="${num2(detail.width)},${num2(detail.height)},${num2(detail.depth)}"`,
|
|
10539
|
+
`${chunkUHKFJBY5_cjs.CORNER_RADIUS_ATTR}="${num2(detail.cornerRadius)}"`,
|
|
10184
10540
|
declaredBoundsAttr(detail.bounds),
|
|
10185
|
-
`${
|
|
10541
|
+
`${chunkUHKFJBY5_cjs.ISOMETRIC_LABEL_OFFSET_ATTR}="${num2(detail.labelOffsetX)},${num2(detail.labelOffsetY)}"`
|
|
10186
10542
|
];
|
|
10187
10543
|
}
|
|
10188
10544
|
function linkDetailAttrs(detail) {
|
|
@@ -10208,8 +10564,8 @@ function contractAttrs(node) {
|
|
|
10208
10564
|
node.propSolidOnly ? 'data-sf-prop-solid-only="true"' : void 0,
|
|
10209
10565
|
node.mark ? `data-sf-mark="${xml(node.mark)}"` : void 0,
|
|
10210
10566
|
node.zoneGradient ? 'data-sf-zone-gradient="true"' : void 0,
|
|
10211
|
-
node.zoneGradient ? `data-sf-zone-axis-min="${
|
|
10212
|
-
node.zoneGradient ? `data-sf-zone-axis-max="${
|
|
10567
|
+
node.zoneGradient ? `data-sf-zone-axis-min="${num2(node.zoneGradient.min)}"` : void 0,
|
|
10568
|
+
node.zoneGradient ? `data-sf-zone-axis-max="${num2(node.zoneGradient.max)}"` : void 0,
|
|
10213
10569
|
label ? `tabindex="0" aria-label="${xml(label.replace(/\s+/g, " ").trim())}"` : void 0
|
|
10214
10570
|
].filter((attribute) => attribute !== void 0);
|
|
10215
10571
|
return attributes.length ? ` ${attributes.join(" ")}` : "";
|
|
@@ -10218,7 +10574,7 @@ function contractAttrs(node) {
|
|
|
10218
10574
|
// src/svg/text.ts
|
|
10219
10575
|
function richLineTspans(words, x, dy, fontSize) {
|
|
10220
10576
|
if (!words.length) {
|
|
10221
|
-
return `<tspan x="${
|
|
10577
|
+
return `<tspan x="${num2(x)}"${dy} font-size="${fontSize}"></tspan>`;
|
|
10222
10578
|
}
|
|
10223
10579
|
const groups = [];
|
|
10224
10580
|
for (const word of words) {
|
|
@@ -10233,15 +10589,15 @@ function richLineTspans(words, x, dy, fontSize) {
|
|
|
10233
10589
|
}
|
|
10234
10590
|
}
|
|
10235
10591
|
return groups.map(
|
|
10236
|
-
(group, i) => `<tspan${i === 0 ? ` x="${
|
|
10592
|
+
(group, i) => `<tspan${i === 0 ? ` x="${num2(x)}"${dy}` : ""} font-size="${fontSize}" font-weight="${group.bold ? "bold" : "normal"}">${xml(group.text)}</tspan>`
|
|
10237
10593
|
).join("");
|
|
10238
10594
|
}
|
|
10239
10595
|
function textSvg(node, defs) {
|
|
10240
10596
|
const position = textPosition(node);
|
|
10241
|
-
const fontSize = `${
|
|
10597
|
+
const fontSize = `${num2(node.fontSize)}px`;
|
|
10242
10598
|
const content = textContent(node, position, fontSize);
|
|
10243
10599
|
const preserve = node.richLines ? ' xml:space="preserve"' : "";
|
|
10244
|
-
return `<text id="${defs.elementId(node.id)}"${contractAttrs(node)} x="${
|
|
10600
|
+
return `<text id="${defs.elementId(node.id)}"${contractAttrs(node)} x="${num2(position.x)}" y="${num2(position.firstY)}" font-family="${xml(node.fontFamily)}" font-size="${fontSize}" font-weight="${node.fontWeight}"${node.letterSpacing ? ` letter-spacing="${num2(node.letterSpacing)}"` : ""} fill="${xml(node.color)}" text-anchor="${position.anchor}" data-sf-valign="${node.verticalAlign}" data-sf-line-height="${num2(node.lineHeight)}"${preserve}${transform(node.rotation, node.rotationCenter)}>${content}</text>`;
|
|
10245
10601
|
}
|
|
10246
10602
|
function textPosition(node) {
|
|
10247
10603
|
const linePx = node.fontSize * node.lineHeight;
|
|
@@ -10267,10 +10623,10 @@ function textContent(node, position, fontSize) {
|
|
|
10267
10623
|
return node.lines.map((line, index) => lineTspan(line, index, position, fontSize)).join("");
|
|
10268
10624
|
}
|
|
10269
10625
|
function lineTspan(line, index, position, fontSize) {
|
|
10270
|
-
return `<tspan x="${
|
|
10626
|
+
return `<tspan x="${num2(position.x)}" font-size="${fontSize}"${lineOffset(index, position.linePx)}>${xml(line)}</tspan>`;
|
|
10271
10627
|
}
|
|
10272
10628
|
function lineOffset(index, linePx) {
|
|
10273
|
-
return index ? ` dy="${
|
|
10629
|
+
return index ? ` dy="${num2(linePx)}px"` : "";
|
|
10274
10630
|
}
|
|
10275
10631
|
|
|
10276
10632
|
// src/svg/nodes.ts
|
|
@@ -10279,7 +10635,7 @@ function shaderSurfaceSvg(node, defs) {
|
|
|
10279
10635
|
const parameters = xml(JSON.stringify(node.shader.parameters));
|
|
10280
10636
|
const surfacePadding = node.shader.surfacePadding ?? 0;
|
|
10281
10637
|
const fillColor = node.fillColor ? ` data-sf-shader-fill="${xml(node.fillColor)}"` : "";
|
|
10282
|
-
return `<foreignObject id="${defs.elementId(node.id)}"${contractAttrs(node)} data-sf-shader="${xml(node.shader.program)}" data-sf-shader-name="${xml(node.shader.name)}" data-sf-shader-params="${parameters}" data-sf-shader-mask="${node.mask}" data-sf-shader-padding="${
|
|
10638
|
+
return `<foreignObject id="${defs.elementId(node.id)}"${contractAttrs(node)} data-sf-shader="${xml(node.shader.program)}" data-sf-shader-name="${xml(node.shader.name)}" data-sf-shader-params="${parameters}" data-sf-shader-mask="${node.mask}" data-sf-shader-padding="${num2(surfacePadding)}"${fillColor} x="${num2(node.x)}" y="${num2(node.y)}" width="${num2(node.width)}" height="${num2(node.height)}"${rotation} pointer-events="${node.shader.program === "ruler" || node.identity?.role === "widget" ? "all" : "none"}"><canvas xmlns="http://www.w3.org/1999/xhtml" data-sf-shader-canvas="true" style="display:block;width:100%;height:100%;pointer-events:none"></canvas></foreignObject>`;
|
|
10283
10639
|
}
|
|
10284
10640
|
function rollingDigitSvg(character, node) {
|
|
10285
10641
|
const style = node.componentStyle;
|
|
@@ -10294,7 +10650,7 @@ function rollingNumberSvg(node, defs) {
|
|
|
10294
10650
|
const label = node.label ? `<span xmlns="http://www.w3.org/1999/xhtml" style="margin-bottom:.14em;color:${xml(node.componentStyle.labelColor)};font-size:.16em;font-weight:600;letter-spacing:.24em;line-height:1">${xml(node.label)}</span>` : "";
|
|
10295
10651
|
const digits = [...node.value].map((character) => rollingDigitSvg(character, node)).join("");
|
|
10296
10652
|
const componentStyle = xml(JSON.stringify(node.componentStyle));
|
|
10297
|
-
return `<foreignObject id="${defs.elementId(node.id)}"${contractAttrs(node)} data-sf-widget="rollingNumber" data-sf-widget-value="${xml(node.value)}" data-sf-widget-digits="${node.digits ?? ""}" data-sf-widget-duration="${
|
|
10653
|
+
return `<foreignObject id="${defs.elementId(node.id)}"${contractAttrs(node)} data-sf-widget="rollingNumber" data-sf-widget-value="${xml(node.value)}" data-sf-widget-digits="${node.digits ?? ""}" data-sf-widget-duration="${num2(node.duration)}" data-sf-widget-style="${componentStyle}" x="${num2(node.x)}" y="${num2(node.y)}" width="${num2(node.width)}" height="${num2(node.height)}"${rotation}><div xmlns="http://www.w3.org/1999/xhtml" style="width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:${xml(node.componentStyle.fontFamily)};font-size:${num2(fontSize)}px">${label}<div data-sf-rolling-digits="true" aria-label="${xml(node.value)}" style="display:flex;gap:${node.componentStyle.variant === "plain" ? ".02em" : ".1em"};font-size:1em">${digits}</div></div></foreignObject>`;
|
|
10298
10654
|
}
|
|
10299
10655
|
function nodeSvg(node, defs) {
|
|
10300
10656
|
if (node.type === "text") {
|
|
@@ -10307,14 +10663,14 @@ function nodeSvg(node, defs) {
|
|
|
10307
10663
|
return rollingNumberSvg(node, defs);
|
|
10308
10664
|
}
|
|
10309
10665
|
if (node.type === "image") {
|
|
10310
|
-
return `<image id="${defs.elementId(node.id)}"${contractAttrs(node)} ${imageAttrs(node, defs)} href="${xml(node.href)}" x="${
|
|
10666
|
+
return `<image id="${defs.elementId(node.id)}"${contractAttrs(node)} ${imageAttrs(node, defs)} href="${xml(node.href)}" x="${num2(node.x)}" y="${num2(node.y)}" width="${num2(node.width)}" height="${num2(node.height)}" preserveAspectRatio="${node.aspect === "none" ? "none" : `xMidYMid ${node.aspect ?? "slice"}`}"${transform(node.rotation, node.rotationCenter)}/>`;
|
|
10311
10667
|
}
|
|
10312
10668
|
const attrs = `id="${defs.elementId(node.id)}"${contractAttrs(node)} ${styleAttrs(node, defs)}`;
|
|
10313
10669
|
if (node.type === "rect") {
|
|
10314
|
-
return `<rect ${attrs} x="${
|
|
10670
|
+
return `<rect ${attrs} x="${num2(node.x)}" y="${num2(node.y)}" width="${num2(node.width)}" height="${num2(node.height)}"${node.rx ? ` rx="${num2(node.rx)}"` : ""}${transform(node.rotation, { x: node.x + node.width / 2, y: node.y + node.height / 2 })}/>`;
|
|
10315
10671
|
}
|
|
10316
10672
|
if (node.type === "ellipse") {
|
|
10317
|
-
return `<ellipse ${attrs} cx="${
|
|
10673
|
+
return `<ellipse ${attrs} cx="${num2(node.cx)}" cy="${num2(node.cy)}" rx="${num2(node.rx)}" ry="${num2(node.ry)}"${transform(node.rotation, { x: node.cx, y: node.cy })}/>`;
|
|
10318
10674
|
}
|
|
10319
10675
|
return `<path ${attrs} d="${xml(node.d)}"${transform(node.rotation, node.rotationCenter)}/>`;
|
|
10320
10676
|
}
|
|
@@ -10324,12 +10680,12 @@ function renderSvgDocument(scene, options = {}) {
|
|
|
10324
10680
|
const padding = options.padding ?? 16;
|
|
10325
10681
|
const width = Math.max(1, scene.bounds.maxX - scene.bounds.minX + padding * 2);
|
|
10326
10682
|
const height = Math.max(1, scene.bounds.maxY - scene.bounds.minY + padding * 2);
|
|
10327
|
-
const viewBox = `${
|
|
10683
|
+
const viewBox = `${num2(scene.bounds.minX - padding)} ${num2(scene.bounds.minY - padding)} ${num2(width)} ${num2(height)}`;
|
|
10328
10684
|
const defs = new SvgDefinitionRegistry(options.idPrefix ? `${options.idPrefix}-` : "");
|
|
10329
10685
|
const nodes = options.linkHitAreas ? withLinkHitAreas(scene.nodes) : scene.nodes;
|
|
10330
10686
|
const body = nodes.map((node) => nodeSvg(node, defs)).join("\n ");
|
|
10331
10687
|
const declaration = options.includeXmlDeclaration === false ? "" : '<?xml version="1.0" encoding="UTF-8"?>\n';
|
|
10332
|
-
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${
|
|
10688
|
+
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${num2(width)}px" height="${num2(height)}px" viewBox="${viewBox}" role="img" data-sf-contract="${chunkUHKFJBY5_cjs.DOM_CONTRACT_VERSION}">
|
|
10333
10689
|
<defs>${defs.entries.join("")}</defs>
|
|
10334
10690
|
${body}
|
|
10335
10691
|
</svg>`;
|
|
@@ -10349,9 +10705,9 @@ function renderCanvas(input, options = {}) {
|
|
|
10349
10705
|
}
|
|
10350
10706
|
var SCENE_CACHE_LIMIT = 50;
|
|
10351
10707
|
var sceneCache = /* @__PURE__ */ new Map();
|
|
10352
|
-
var cachedForRegistry =
|
|
10708
|
+
var cachedForRegistry = chunkUHKFJBY5_cjs.componentRegistryVersion();
|
|
10353
10709
|
function cachedRenderScene(source) {
|
|
10354
|
-
const registry =
|
|
10710
|
+
const registry = chunkUHKFJBY5_cjs.componentRegistryVersion();
|
|
10355
10711
|
if (registry !== cachedForRegistry) {
|
|
10356
10712
|
sceneCache.clear();
|
|
10357
10713
|
cachedForRegistry = registry;
|
|
@@ -10383,7 +10739,7 @@ function render(source, options = {}) {
|
|
|
10383
10739
|
var SCENE_ORDER_BASE = 1e4;
|
|
10384
10740
|
function defineComponent(definition) {
|
|
10385
10741
|
const { scene, ...descriptor } = definition;
|
|
10386
|
-
const unregisterDescriptor =
|
|
10742
|
+
const unregisterDescriptor = chunkUHKFJBY5_cjs.registerComponentDescriptor(descriptor);
|
|
10387
10743
|
const unregisterBuilder = registerComponentBuilder(
|
|
10388
10744
|
descriptor.type,
|
|
10389
10745
|
(component, index) => scene(component, { order: SCENE_ORDER_BASE + index })
|
|
@@ -10402,5 +10758,5 @@ exports.render = render;
|
|
|
10402
10758
|
exports.renderCanvas = renderCanvas;
|
|
10403
10759
|
exports.sflToRenderInput = sflToRenderInput;
|
|
10404
10760
|
exports.sliderReach = sliderReach;
|
|
10405
|
-
//# sourceMappingURL=chunk-
|
|
10406
|
-
//# sourceMappingURL=chunk-
|
|
10761
|
+
//# sourceMappingURL=chunk-5G3BEXQU.cjs.map
|
|
10762
|
+
//# sourceMappingURL=chunk-5G3BEXQU.cjs.map
|