stickyflow 0.6.0 → 0.7.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 +27 -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-WQRT5PVT.cjs → chunk-A73UJ5AQ.cjs} +1165 -672
- package/dist/chunk-A73UJ5AQ.cjs.map +1 -0
- package/dist/{chunk-KTNCDNDB.cjs → chunk-BUOWM3LC.cjs} +745 -62
- package/dist/chunk-BUOWM3LC.cjs.map +1 -0
- package/dist/{chunk-4LENHH6C.cjs → chunk-EKAWJFJQ.cjs} +15 -15
- package/dist/{chunk-4LENHH6C.cjs.map → chunk-EKAWJFJQ.cjs.map} +1 -1
- package/dist/{chunk-MFNUJA26.js → chunk-JCRPLPKV.js} +156 -23
- package/dist/chunk-JCRPLPKV.js.map +1 -0
- package/dist/{chunk-4G2R7PEL.js → chunk-JQK4IGXJ.js} +173 -9
- package/dist/chunk-JQK4IGXJ.js.map +1 -0
- package/dist/{chunk-XJ4W6TW4.cjs → chunk-KXYSO6GC.cjs} +174 -8
- package/dist/chunk-KXYSO6GC.cjs.map +1 -0
- package/dist/{chunk-WRDVNMFS.js → chunk-MUKIGLR5.js} +717 -34
- package/dist/chunk-MUKIGLR5.js.map +1 -0
- package/dist/{chunk-JIJMZMGY.cjs → chunk-OWNVXKXN.cjs} +170 -37
- package/dist/chunk-OWNVXKXN.cjs.map +1 -0
- package/dist/{chunk-FVHVOJS2.js → chunk-SDMQRSRW.js} +549 -57
- package/dist/chunk-SDMQRSRW.js.map +1 -0
- package/dist/{chunk-ULQZ6CZW.js → chunk-ZNHYW47T.js} +3 -3
- package/dist/{chunk-ULQZ6CZW.js.map → chunk-ZNHYW47T.js.map} +1 -1
- package/dist/index.cjs +42 -34
- package/dist/index.d.cts +34 -6
- package/dist/index.d.ts +34 -6
- package/dist/index.js +5 -5
- package/dist/interaction/index.cjs +230 -230
- package/dist/interaction/index.d.cts +2 -2
- package/dist/interaction/index.d.ts +2 -2
- package/dist/interaction/index.js +2 -2
- package/dist/{render-Db0eSz_s.d.cts → render-BU2uYzjG.d.cts} +4 -1
- package/dist/{render-Db0eSz_s.d.ts → render-BU2uYzjG.d.ts} +4 -1
- package/dist/{runtime-BhivvBeL.d.cts → runtime-B7KiTmn8.d.cts} +2 -2
- package/dist/{runtime-n2yG-_j-.d.ts → runtime-BPzyD-Nd.d.ts} +2 -2
- package/dist/{runtimeTypes-DnI7mRF5.d.ts → runtimeTypes-BIP70z72.d.cts} +2 -1
- package/dist/{runtimeTypes-CrkMHvVi.d.cts → runtimeTypes-DalvhScn.d.ts} +2 -1
- package/dist/stickyflow-diagram.global.js +387 -36
- package/dist/stickyflow-diagram.global.js.map +1 -1
- package/dist/{types-D4cH4f1a.d.ts → types-DMWs27Hn.d.ts} +1 -1
- package/dist/{types-BHfUKT4s.d.cts → types-D_2NZ6lL.d.cts} +1 -1
- package/dist/viewer/index.cjs +9 -9
- package/dist/viewer/index.d.cts +5 -4
- package/dist/viewer/index.d.ts +5 -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-4G2R7PEL.js.map +0 -1
- package/dist/chunk-FVHVOJS2.js.map +0 -1
- package/dist/chunk-JIJMZMGY.cjs.map +0 -1
- package/dist/chunk-KTNCDNDB.cjs.map +0 -1
- package/dist/chunk-MFNUJA26.js.map +0 -1
- package/dist/chunk-WQRT5PVT.cjs.map +0 -1
- package/dist/chunk-WRDVNMFS.js.map +0 -1
- package/dist/chunk-XJ4W6TW4.cjs.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkKXYSO6GC_cjs = require('./chunk-KXYSO6GC.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-]*`;
|
|
@@ -633,7 +633,7 @@ function readComponentValue(descriptor, raw) {
|
|
|
633
633
|
return raw;
|
|
634
634
|
}
|
|
635
635
|
function genericComponentObject(canvasObject) {
|
|
636
|
-
const descriptor =
|
|
636
|
+
const descriptor = chunkKXYSO6GC_cjs.getComponentDescriptor(canvasObject.component.type);
|
|
637
637
|
return {
|
|
638
638
|
id: canvasObject.id,
|
|
639
639
|
type: canvasObject.component.type,
|
|
@@ -822,7 +822,7 @@ var BUILT_IN_OBJECTS = {
|
|
|
822
822
|
};
|
|
823
823
|
function componentObject(canvasObject) {
|
|
824
824
|
const type = canvasObject.component.type;
|
|
825
|
-
return
|
|
825
|
+
return chunkKXYSO6GC_cjs.isBuiltInComponentType(type) ? BUILT_IN_OBJECTS[type](canvasObject) : genericComponentObject(canvasObject);
|
|
826
826
|
}
|
|
827
827
|
|
|
828
828
|
// src/renderInput/fromSfl/canvasObjects/connection.ts
|
|
@@ -1063,9 +1063,9 @@ function collectCanvasObjects(state) {
|
|
|
1063
1063
|
shapes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "shape").map((shape) => shapeObject(shape, shaders)),
|
|
1064
1064
|
frames: canvasObjects.filter((canvasObject) => canvasObject.objectType === "frame").map(frameObject),
|
|
1065
1065
|
swimlanes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "swimlane").map(swimlaneObject),
|
|
1066
|
-
isometricObjects: canvasObjects.filter(
|
|
1066
|
+
isometricObjects: canvasObjects.filter(chunkKXYSO6GC_cjs.isIsometricObject).map(isometricObject),
|
|
1067
1067
|
paths: canvasObjects.filter((canvasObject) => canvasObject.objectType === "path").map(pathObject),
|
|
1068
|
-
dimensions: canvasObjects.filter(
|
|
1068
|
+
dimensions: canvasObjects.filter(chunkKXYSO6GC_cjs.isDimensionObject).map(dimensionObject),
|
|
1069
1069
|
charts: canvasObjects.filter((canvasObject) => canvasObject.objectType === "chart").map(chartObject),
|
|
1070
1070
|
components: canvasObjects.filter(
|
|
1071
1071
|
(canvasObject) => canvasObject.objectType === "component" && canvasObject.component !== void 0
|
|
@@ -1092,9 +1092,9 @@ function sidePoint(canvasObject, endpoint) {
|
|
|
1092
1092
|
function namedPortPoint(canvasObject, endpoint) {
|
|
1093
1093
|
const port = canvasObject.symbol?.ports?.find((candidate) => candidate.name === endpoint.port);
|
|
1094
1094
|
if (!port) {
|
|
1095
|
-
return
|
|
1095
|
+
return chunkKXYSO6GC_cjs.elementCenter(canvasObject);
|
|
1096
1096
|
}
|
|
1097
|
-
return
|
|
1097
|
+
return chunkKXYSO6GC_cjs.pointAtNormalizedPort(
|
|
1098
1098
|
{
|
|
1099
1099
|
x: canvasObject.x,
|
|
1100
1100
|
y: canvasObject.y,
|
|
@@ -1140,7 +1140,7 @@ function explicitAnchorPoint(canvasObject, endpoint) {
|
|
|
1140
1140
|
return null;
|
|
1141
1141
|
}
|
|
1142
1142
|
function automaticEndpointPoint(canvasObject, opposite) {
|
|
1143
|
-
return opposite ?
|
|
1143
|
+
return opposite ? chunkKXYSO6GC_cjs.edgePointToward(canvasObject, opposite) : chunkKXYSO6GC_cjs.elementCenter(canvasObject);
|
|
1144
1144
|
}
|
|
1145
1145
|
function findPositionedCanvasObject(canvasObjects, id) {
|
|
1146
1146
|
return canvasObjects.find((candidate) => candidate.id === id);
|
|
@@ -1158,7 +1158,7 @@ function positionedCanvasObjects(canvasObjects) {
|
|
|
1158
1158
|
];
|
|
1159
1159
|
}
|
|
1160
1160
|
function connectionEndpointPoint(object, face) {
|
|
1161
|
-
return object ?
|
|
1161
|
+
return object ? chunkKXYSO6GC_cjs.isometricFaceCenter(object, face) : { x: 0, y: 0 };
|
|
1162
1162
|
}
|
|
1163
1163
|
function isometricStackPosition(isometricObjects, id) {
|
|
1164
1164
|
const index = isometricObjects.findIndex((object2) => object2.id === id);
|
|
@@ -1173,8 +1173,8 @@ function connectionStack(isometricObjects, connection) {
|
|
|
1173
1173
|
return { order: connection.order, sourceIndex: connection.sourceIndex };
|
|
1174
1174
|
}
|
|
1175
1175
|
const behind = [
|
|
1176
|
-
|
|
1177
|
-
|
|
1176
|
+
chunkKXYSO6GC_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.fromFace) ? void 0 : isometricStackPosition(isometricObjects, connection.fromId),
|
|
1177
|
+
chunkKXYSO6GC_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.toFace) ? void 0 : isometricStackPosition(isometricObjects, connection.toId)
|
|
1178
1178
|
].filter((position) => position !== void 0);
|
|
1179
1179
|
if (!behind.length) {
|
|
1180
1180
|
return { sourceIndex: connection.sourceIndex };
|
|
@@ -1216,7 +1216,7 @@ function createRenderInputLinks(canvasObjects) {
|
|
|
1216
1216
|
|
|
1217
1217
|
// src/renderInput/fromSfl/index.ts
|
|
1218
1218
|
function sflToRenderInput(sfl) {
|
|
1219
|
-
const state =
|
|
1219
|
+
const state = chunkKXYSO6GC_cjs.sflToCanvasState(sfl);
|
|
1220
1220
|
const canvasObjects = collectCanvasObjects(state);
|
|
1221
1221
|
return {
|
|
1222
1222
|
shapes: canvasObjects.shapes,
|
|
@@ -1235,13 +1235,13 @@ function sflToRenderInput(sfl) {
|
|
|
1235
1235
|
// src/renderScene/artifacts/component/placeholder.ts
|
|
1236
1236
|
var STROKE = "#94a3b8";
|
|
1237
1237
|
function buildPlaceholder(component, index) {
|
|
1238
|
-
const x =
|
|
1239
|
-
const y =
|
|
1240
|
-
const width = Math.max(0,
|
|
1241
|
-
const height = Math.max(0,
|
|
1242
|
-
const rotation =
|
|
1238
|
+
const x = chunkKXYSO6GC_cjs.finite(component.x, 0);
|
|
1239
|
+
const y = chunkKXYSO6GC_cjs.finite(component.y, 0);
|
|
1240
|
+
const width = Math.max(0, chunkKXYSO6GC_cjs.finite(component.width, 120));
|
|
1241
|
+
const height = Math.max(0, chunkKXYSO6GC_cjs.finite(component.height, 60));
|
|
1242
|
+
const rotation = chunkKXYSO6GC_cjs.finite(component.rotation, 0);
|
|
1243
1243
|
const order = 1e4 + index;
|
|
1244
|
-
const bounds =
|
|
1244
|
+
const bounds = chunkKXYSO6GC_cjs.rotatedBounds({ x, y, width, height }, rotation, 2);
|
|
1245
1245
|
return [
|
|
1246
1246
|
{
|
|
1247
1247
|
id: `widget-${component.id}`,
|
|
@@ -1266,7 +1266,7 @@ function buildPlaceholder(component, index) {
|
|
|
1266
1266
|
width,
|
|
1267
1267
|
height,
|
|
1268
1268
|
lines: [component.type],
|
|
1269
|
-
fontFamily:
|
|
1269
|
+
fontFamily: chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
1270
1270
|
fontSize: 12,
|
|
1271
1271
|
fontWeight: "normal",
|
|
1272
1272
|
color: STROKE,
|
|
@@ -1280,44 +1280,44 @@ function buildPlaceholder(component, index) {
|
|
|
1280
1280
|
|
|
1281
1281
|
// src/renderScene/artifacts/component/builtIn.ts
|
|
1282
1282
|
function buildRollingNumber(component, index) {
|
|
1283
|
-
const x =
|
|
1284
|
-
const y =
|
|
1285
|
-
const width = Math.max(0,
|
|
1286
|
-
const height = Math.max(0,
|
|
1287
|
-
const rotation =
|
|
1283
|
+
const x = chunkKXYSO6GC_cjs.finite(component.x, 0);
|
|
1284
|
+
const y = chunkKXYSO6GC_cjs.finite(component.y, 0);
|
|
1285
|
+
const width = Math.max(0, chunkKXYSO6GC_cjs.finite(component.width, 160));
|
|
1286
|
+
const height = Math.max(0, chunkKXYSO6GC_cjs.finite(component.height, 90));
|
|
1287
|
+
const rotation = chunkKXYSO6GC_cjs.finite(component.rotation, 0);
|
|
1288
1288
|
return [
|
|
1289
1289
|
{
|
|
1290
1290
|
id: `widget-${component.id}`,
|
|
1291
1291
|
type: "rolling-number",
|
|
1292
1292
|
order: 1e4 + index,
|
|
1293
|
-
bounds:
|
|
1293
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1294
1294
|
x,
|
|
1295
1295
|
y,
|
|
1296
1296
|
width,
|
|
1297
1297
|
height,
|
|
1298
1298
|
rotation,
|
|
1299
|
-
value:
|
|
1299
|
+
value: chunkKXYSO6GC_cjs.formatRollingNumber(component.value, component.digits),
|
|
1300
1300
|
digits: component.digits,
|
|
1301
|
-
duration: Math.max(0,
|
|
1301
|
+
duration: Math.max(0, chunkKXYSO6GC_cjs.finite(component.duration, 420)),
|
|
1302
1302
|
label: component.label,
|
|
1303
|
-
componentStyle:
|
|
1303
|
+
componentStyle: chunkKXYSO6GC_cjs.resolveRollingNumberStyle(component.style)
|
|
1304
1304
|
}
|
|
1305
1305
|
];
|
|
1306
1306
|
}
|
|
1307
1307
|
function buildTickScale(component, index) {
|
|
1308
|
-
const x =
|
|
1309
|
-
const y =
|
|
1310
|
-
const width = Math.max(0,
|
|
1311
|
-
const height = Math.max(0,
|
|
1312
|
-
const rotation =
|
|
1313
|
-
const max =
|
|
1314
|
-
const progress = Math.min(1, Math.max(0,
|
|
1308
|
+
const x = chunkKXYSO6GC_cjs.finite(component.x, 0);
|
|
1309
|
+
const y = chunkKXYSO6GC_cjs.finite(component.y, 0);
|
|
1310
|
+
const width = Math.max(0, chunkKXYSO6GC_cjs.finite(component.width, 200));
|
|
1311
|
+
const height = Math.max(0, chunkKXYSO6GC_cjs.finite(component.height, 200));
|
|
1312
|
+
const rotation = chunkKXYSO6GC_cjs.finite(component.rotation, 0);
|
|
1313
|
+
const max = chunkKXYSO6GC_cjs.finite(component.max, 100) || 100;
|
|
1314
|
+
const progress = Math.min(1, Math.max(0, chunkKXYSO6GC_cjs.finite(Number(component.value), 0) / max));
|
|
1315
1315
|
const nodes = [
|
|
1316
1316
|
{
|
|
1317
1317
|
id: `widget-${component.id}`,
|
|
1318
1318
|
type: "shader-surface",
|
|
1319
1319
|
order: 1e4 + index,
|
|
1320
|
-
bounds:
|
|
1320
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1321
1321
|
x,
|
|
1322
1322
|
y,
|
|
1323
1323
|
width,
|
|
@@ -1334,18 +1334,18 @@ function buildTickScale(component, index) {
|
|
|
1334
1334
|
}
|
|
1335
1335
|
function buildTickLabels(component, box) {
|
|
1336
1336
|
const labels = component.labels ?? {};
|
|
1337
|
-
const
|
|
1338
|
-
const major = Math.max(1,
|
|
1339
|
-
const start =
|
|
1340
|
-
const sweep =
|
|
1341
|
-
const radius =
|
|
1342
|
-
const fontSize =
|
|
1337
|
+
const ticks2 = Math.max(1, chunkKXYSO6GC_cjs.finite(Number(component.parameters.ticks), 48));
|
|
1338
|
+
const major = Math.max(1, chunkKXYSO6GC_cjs.finite(Number(component.parameters.major), 5));
|
|
1339
|
+
const start = chunkKXYSO6GC_cjs.finite(Number(component.parameters.start), 225) * Math.PI / 180;
|
|
1340
|
+
const sweep = chunkKXYSO6GC_cjs.finite(Number(component.parameters.sweep), 270) * Math.PI / 180;
|
|
1341
|
+
const radius = chunkKXYSO6GC_cjs.finite(Number(component.parameters.radius), 0.9) + chunkKXYSO6GC_cjs.finite(labels.offset, 0.08);
|
|
1342
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(labels.size, 12);
|
|
1343
1343
|
const centerX = box.x + box.width / 2;
|
|
1344
1344
|
const centerY = box.y + box.height / 2;
|
|
1345
|
-
const count = Math.floor(
|
|
1345
|
+
const count = Math.floor(ticks2 / major);
|
|
1346
1346
|
const nodes = [];
|
|
1347
1347
|
for (let step = 0; step <= count; step += 1) {
|
|
1348
|
-
const fraction = step * major /
|
|
1348
|
+
const fraction = step * major / ticks2;
|
|
1349
1349
|
const angle = start - fraction * sweep;
|
|
1350
1350
|
const labelX2 = centerX + Math.cos(angle) * radius * (box.width / 2);
|
|
1351
1351
|
const labelY = centerY - Math.sin(angle) * radius * (box.height / 2);
|
|
@@ -1354,10 +1354,10 @@ function buildTickLabels(component, box) {
|
|
|
1354
1354
|
id: `widget-${component.id}-label-${step}`,
|
|
1355
1355
|
type: "text",
|
|
1356
1356
|
order: box.order + 0.1,
|
|
1357
|
-
bounds:
|
|
1357
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1358
1358
|
...labelBox,
|
|
1359
1359
|
lines: [String(Math.round(box.max * fraction * 10) / 10)],
|
|
1360
|
-
fontFamily: labels.fontFamily ||
|
|
1360
|
+
fontFamily: labels.fontFamily || chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
1361
1361
|
fontSize,
|
|
1362
1362
|
fontWeight: labels.weight ?? "normal",
|
|
1363
1363
|
color: labels.color || "#8f95c4",
|
|
@@ -1369,20 +1369,20 @@ function buildTickLabels(component, box) {
|
|
|
1369
1369
|
return nodes;
|
|
1370
1370
|
}
|
|
1371
1371
|
function buildRuler(component, index) {
|
|
1372
|
-
const x =
|
|
1373
|
-
const y =
|
|
1374
|
-
const width = Math.max(0,
|
|
1375
|
-
const height = Math.max(0,
|
|
1376
|
-
const rotation =
|
|
1377
|
-
const min =
|
|
1378
|
-
const max =
|
|
1379
|
-
const progress = max === min ? 0 : Math.min(1, Math.max(0, (
|
|
1372
|
+
const x = chunkKXYSO6GC_cjs.finite(component.x, 0);
|
|
1373
|
+
const y = chunkKXYSO6GC_cjs.finite(component.y, 0);
|
|
1374
|
+
const width = Math.max(0, chunkKXYSO6GC_cjs.finite(component.width, 120));
|
|
1375
|
+
const height = Math.max(0, chunkKXYSO6GC_cjs.finite(component.height, 360));
|
|
1376
|
+
const rotation = chunkKXYSO6GC_cjs.finite(component.rotation, 0);
|
|
1377
|
+
const min = chunkKXYSO6GC_cjs.finite(component.min, 0);
|
|
1378
|
+
const max = chunkKXYSO6GC_cjs.finite(component.max, 100);
|
|
1379
|
+
const progress = max === min ? 0 : Math.min(1, Math.max(0, (chunkKXYSO6GC_cjs.finite(Number(component.value), min) - min) / (max - min)));
|
|
1380
1380
|
const nodes = [
|
|
1381
1381
|
{
|
|
1382
1382
|
id: `widget-${component.id}`,
|
|
1383
1383
|
type: "shader-surface",
|
|
1384
1384
|
order: 1e4 + index,
|
|
1385
|
-
bounds:
|
|
1385
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1386
1386
|
x,
|
|
1387
1387
|
y,
|
|
1388
1388
|
width,
|
|
@@ -1400,28 +1400,28 @@ function buildRuler(component, index) {
|
|
|
1400
1400
|
function buildRulerLabels(component, box) {
|
|
1401
1401
|
const labels = component.labels ?? {};
|
|
1402
1402
|
const horizontal = component.parameters.axis === "horizontal";
|
|
1403
|
-
const
|
|
1404
|
-
const major = Math.max(1,
|
|
1405
|
-
const inset =
|
|
1406
|
-
const line =
|
|
1403
|
+
const ticks2 = Math.max(1, chunkKXYSO6GC_cjs.finite(Number(component.parameters.ticks), 50));
|
|
1404
|
+
const major = Math.max(1, chunkKXYSO6GC_cjs.finite(Number(component.parameters.major), 5));
|
|
1405
|
+
const inset = chunkKXYSO6GC_cjs.finite(Number(component.parameters.inset), 0.05) > 0 ? chunkKXYSO6GC_cjs.finite(Number(component.parameters.inset), 0.05) : 0.05;
|
|
1406
|
+
const line = chunkKXYSO6GC_cjs.finite(Number(component.parameters.line), 0.7) > 0 ? chunkKXYSO6GC_cjs.finite(Number(component.parameters.line), 0.7) : 0.7;
|
|
1407
1407
|
const across = horizontal ? box.height : box.width;
|
|
1408
|
-
const tickLength = (
|
|
1409
|
-
const edge = line * across - 0.12 * across - tickLength -
|
|
1410
|
-
const fontSize =
|
|
1411
|
-
const count = Math.floor(
|
|
1408
|
+
const tickLength = (chunkKXYSO6GC_cjs.finite(Number(component.parameters.length), 0.1) > 0 ? chunkKXYSO6GC_cjs.finite(Number(component.parameters.length), 0.1) : 0.1) * across * 1.9;
|
|
1409
|
+
const edge = line * across - 0.12 * across - tickLength - chunkKXYSO6GC_cjs.finite(labels.offset, 0.04) * across;
|
|
1410
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(labels.size, 12);
|
|
1411
|
+
const count = Math.floor(ticks2 / major);
|
|
1412
1412
|
const nodes = [];
|
|
1413
1413
|
for (let step = 0; step <= count; step += 1) {
|
|
1414
|
-
const fraction = step * major /
|
|
1414
|
+
const fraction = step * major / ticks2;
|
|
1415
1415
|
const along2 = inset + (1 - 2 * inset) * fraction;
|
|
1416
1416
|
const labelBox = horizontal ? { x: box.x + box.width * along2 - 24, y: box.y + edge - fontSize * 2, width: 48, height: fontSize * 2 } : { x: box.x + edge - 48, y: box.y + box.height * (1 - along2) - fontSize, width: 48, height: fontSize * 2 };
|
|
1417
1417
|
nodes.push({
|
|
1418
1418
|
id: `widget-${component.id}-label-${step}`,
|
|
1419
1419
|
type: "text",
|
|
1420
1420
|
order: box.order + 0.1,
|
|
1421
|
-
bounds:
|
|
1421
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1422
1422
|
...labelBox,
|
|
1423
1423
|
lines: [String(Math.round((box.min + (box.max - box.min) * fraction) * 10) / 10)],
|
|
1424
|
-
fontFamily: labels.fontFamily ||
|
|
1424
|
+
fontFamily: labels.fontFamily || chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
1425
1425
|
fontSize,
|
|
1426
1426
|
fontWeight: labels.weight ?? "normal",
|
|
1427
1427
|
color: labels.color || "#8f95c4",
|
|
@@ -1437,10 +1437,10 @@ function buildRulerLabels(component, box) {
|
|
|
1437
1437
|
var DISABLED_INK = "#94a3b8";
|
|
1438
1438
|
function controlBox(component, index, fallback) {
|
|
1439
1439
|
return {
|
|
1440
|
-
x:
|
|
1441
|
-
y:
|
|
1442
|
-
width: Math.max(1,
|
|
1443
|
-
height: Math.max(1,
|
|
1440
|
+
x: chunkKXYSO6GC_cjs.finite(component.x, 0),
|
|
1441
|
+
y: chunkKXYSO6GC_cjs.finite(component.y, 0),
|
|
1442
|
+
width: Math.max(1, chunkKXYSO6GC_cjs.finite(component.width, fallback.width)),
|
|
1443
|
+
height: Math.max(1, chunkKXYSO6GC_cjs.finite(component.height, fallback.height)),
|
|
1444
1444
|
order: 1e4 + index
|
|
1445
1445
|
};
|
|
1446
1446
|
}
|
|
@@ -1449,14 +1449,16 @@ var numberProperty2 = (component, key) => Number(component.properties[key] ?? 0)
|
|
|
1449
1449
|
var solid = (color) => ({ kind: "solid", color });
|
|
1450
1450
|
var ink = (component, color) => component.disabled ? DISABLED_INK : color;
|
|
1451
1451
|
function fade(component, style) {
|
|
1452
|
-
|
|
1452
|
+
const animate = Number(component.properties.animate ?? 0);
|
|
1453
|
+
const shown = component.disabled ? { ...style, opacity: 0.4 } : style;
|
|
1454
|
+
return animate > 0 ? { ...shown, transition: animate } : shown;
|
|
1453
1455
|
}
|
|
1454
1456
|
function hitArea(component, box) {
|
|
1455
1457
|
return {
|
|
1456
1458
|
id: `widget-${component.id}`,
|
|
1457
1459
|
type: "rect",
|
|
1458
1460
|
order: box.order,
|
|
1459
|
-
bounds:
|
|
1461
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(box, 0, 0),
|
|
1460
1462
|
x: box.x,
|
|
1461
1463
|
y: box.y,
|
|
1462
1464
|
width: box.width,
|
|
@@ -1469,13 +1471,13 @@ function labelText(component, part, area, label, order) {
|
|
|
1469
1471
|
id: `widget-${component.id}-${part}`,
|
|
1470
1472
|
type: "text",
|
|
1471
1473
|
order,
|
|
1472
|
-
bounds:
|
|
1474
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(area, 0, 0),
|
|
1473
1475
|
x: area.x,
|
|
1474
1476
|
y: area.y,
|
|
1475
1477
|
width: area.width,
|
|
1476
1478
|
height: area.height,
|
|
1477
1479
|
lines: [label.text],
|
|
1478
|
-
fontFamily:
|
|
1480
|
+
fontFamily: chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
1479
1481
|
fontSize: label.fontSize,
|
|
1480
1482
|
fontWeight: "600",
|
|
1481
1483
|
color: label.color,
|
|
@@ -1494,7 +1496,7 @@ function buildButton(component, index) {
|
|
|
1494
1496
|
id: `widget-${component.id}-face`,
|
|
1495
1497
|
type: "rect",
|
|
1496
1498
|
order: box.order + 0.1,
|
|
1497
|
-
bounds:
|
|
1499
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(box, 0, 0),
|
|
1498
1500
|
x: box.x,
|
|
1499
1501
|
y: box.y,
|
|
1500
1502
|
width: box.width,
|
|
@@ -1533,7 +1535,7 @@ function boxNode(component, box, square) {
|
|
|
1533
1535
|
id: `widget-${component.id}-box`,
|
|
1534
1536
|
type: "rect",
|
|
1535
1537
|
order: box.order + 0.1,
|
|
1536
|
-
bounds:
|
|
1538
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(square, 0, 2),
|
|
1537
1539
|
...square,
|
|
1538
1540
|
rx: square.width * CORNER_RATIO,
|
|
1539
1541
|
style: fade(component, {
|
|
@@ -1548,7 +1550,7 @@ function checkNode(component, box, square) {
|
|
|
1548
1550
|
id: `widget-${component.id}-check`,
|
|
1549
1551
|
type: "path",
|
|
1550
1552
|
order: box.order + 0.2,
|
|
1551
|
-
bounds:
|
|
1553
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(square, 0, 0),
|
|
1552
1554
|
d: checkPath(square),
|
|
1553
1555
|
style: fade(component, {
|
|
1554
1556
|
fill: { kind: "none" },
|
|
@@ -1582,6 +1584,463 @@ function buildCheckbox(component, index) {
|
|
|
1582
1584
|
];
|
|
1583
1585
|
}
|
|
1584
1586
|
|
|
1587
|
+
// src/renderScene/artifacts/component/knob.ts
|
|
1588
|
+
var DOT_RATIO = 0.62;
|
|
1589
|
+
function decimals(step) {
|
|
1590
|
+
return step > 0 ? String(step).split(".")[1]?.length ?? 0 : 0;
|
|
1591
|
+
}
|
|
1592
|
+
function readout(component, fraction) {
|
|
1593
|
+
const display = textProperty(component, "display");
|
|
1594
|
+
if (display === "percent") {
|
|
1595
|
+
return `${Math.round(fraction * 100)}%`;
|
|
1596
|
+
}
|
|
1597
|
+
return display === "value" ? Number(component.value).toFixed(decimals(numberProperty2(component, "step"))) : "";
|
|
1598
|
+
}
|
|
1599
|
+
function buildKnob(component, index) {
|
|
1600
|
+
const box = controlBox(component, index, { width: 96, height: 96 });
|
|
1601
|
+
const min = numberProperty2(component, "min");
|
|
1602
|
+
const max = numberProperty2(component, "max");
|
|
1603
|
+
const fraction = Math.min(1, Math.max(0, (Number(component.value) - min) / (max - min || 1)));
|
|
1604
|
+
const start = numberProperty2(component, "start");
|
|
1605
|
+
const sweep = Math.min(360, Math.max(1, numberProperty2(component, "sweep")));
|
|
1606
|
+
const thickness = Math.min(numberProperty2(component, "thickness"), Math.min(box.width, box.height) / 3);
|
|
1607
|
+
const cx = box.x + box.width / 2;
|
|
1608
|
+
const cy = box.y + box.height / 2;
|
|
1609
|
+
const radius = Math.max(1, Math.min(box.width, box.height) / 2 - thickness / 2);
|
|
1610
|
+
const circumference = 2 * Math.PI * radius;
|
|
1611
|
+
const round2 = textProperty(component, "rounded") !== "false";
|
|
1612
|
+
const angle = (start - fraction * sweep) * Math.PI / 180;
|
|
1613
|
+
const arc = (part, order, color, length, extra = {}) => ({
|
|
1614
|
+
id: `widget-${component.id}-${part}`,
|
|
1615
|
+
type: "ellipse",
|
|
1616
|
+
order: box.order + order,
|
|
1617
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
1618
|
+
cx,
|
|
1619
|
+
cy,
|
|
1620
|
+
rx: radius,
|
|
1621
|
+
ry: radius,
|
|
1622
|
+
rotation: -start,
|
|
1623
|
+
style: fade(component, {
|
|
1624
|
+
fill: { kind: "none" },
|
|
1625
|
+
stroke: solid(color),
|
|
1626
|
+
strokeWidth: thickness,
|
|
1627
|
+
dash: [Math.max(1e-3, length), circumference],
|
|
1628
|
+
lineCap: round2 ? "round" : "butt",
|
|
1629
|
+
...extra
|
|
1630
|
+
})
|
|
1631
|
+
});
|
|
1632
|
+
const faceRadius = Math.max(1, radius - thickness / 2 - Math.max(2, thickness * 0.4));
|
|
1633
|
+
const dotRadius = thickness / 2 * DOT_RATIO + 1;
|
|
1634
|
+
const nodes = [
|
|
1635
|
+
hitArea(component, box),
|
|
1636
|
+
arc("track", 0.1, textProperty(component, "track"), sweep / 360 * circumference),
|
|
1637
|
+
arc("fill", 0.2, textProperty(component, "accent"), fraction * sweep / 360 * circumference, {
|
|
1638
|
+
opacity: fraction > 0 ? 1 : 0
|
|
1639
|
+
}),
|
|
1640
|
+
{
|
|
1641
|
+
id: `widget-${component.id}-face`,
|
|
1642
|
+
type: "ellipse",
|
|
1643
|
+
order: box.order + 0.3,
|
|
1644
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(
|
|
1645
|
+
{ x: cx - faceRadius, y: cy - faceRadius, width: faceRadius * 2, height: faceRadius * 2 },
|
|
1646
|
+
0,
|
|
1647
|
+
0
|
|
1648
|
+
),
|
|
1649
|
+
cx,
|
|
1650
|
+
cy,
|
|
1651
|
+
rx: faceRadius,
|
|
1652
|
+
ry: faceRadius,
|
|
1653
|
+
style: fade(component, { fill: solid(textProperty(component, "face")), stroke: { kind: "none" } })
|
|
1654
|
+
},
|
|
1655
|
+
{
|
|
1656
|
+
id: `widget-${component.id}-dot`,
|
|
1657
|
+
type: "ellipse",
|
|
1658
|
+
order: box.order + 0.4,
|
|
1659
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(
|
|
1660
|
+
{
|
|
1661
|
+
x: cx + radius * Math.cos(angle) - dotRadius,
|
|
1662
|
+
y: cy - radius * Math.sin(angle) - dotRadius,
|
|
1663
|
+
width: dotRadius * 2,
|
|
1664
|
+
height: dotRadius * 2
|
|
1665
|
+
},
|
|
1666
|
+
0,
|
|
1667
|
+
0
|
|
1668
|
+
),
|
|
1669
|
+
cx: cx + radius * Math.cos(angle),
|
|
1670
|
+
cy: cy - radius * Math.sin(angle),
|
|
1671
|
+
rx: dotRadius,
|
|
1672
|
+
ry: dotRadius,
|
|
1673
|
+
style: fade(component, { fill: solid(textProperty(component, "dot")), stroke: { kind: "none" } })
|
|
1674
|
+
}
|
|
1675
|
+
];
|
|
1676
|
+
const text = readout(component, fraction);
|
|
1677
|
+
if (text) {
|
|
1678
|
+
const label = {
|
|
1679
|
+
text,
|
|
1680
|
+
color: ink(component, textProperty(component, "textColor")),
|
|
1681
|
+
fontSize: numberProperty2(component, "fontSize"),
|
|
1682
|
+
align: "center"
|
|
1683
|
+
};
|
|
1684
|
+
nodes.push(
|
|
1685
|
+
labelText(
|
|
1686
|
+
component,
|
|
1687
|
+
"value",
|
|
1688
|
+
{ x: cx - faceRadius, y: cy - faceRadius, width: faceRadius * 2, height: faceRadius * 2 },
|
|
1689
|
+
label,
|
|
1690
|
+
box.order + 0.5
|
|
1691
|
+
)
|
|
1692
|
+
);
|
|
1693
|
+
}
|
|
1694
|
+
return nodes;
|
|
1695
|
+
}
|
|
1696
|
+
|
|
1697
|
+
// src/renderScene/artifacts/component/progress.ts
|
|
1698
|
+
function readout2(component, fraction) {
|
|
1699
|
+
const display = textProperty(component, "display");
|
|
1700
|
+
if (display === "percent") {
|
|
1701
|
+
return `${Math.round(fraction * 100)}%`;
|
|
1702
|
+
}
|
|
1703
|
+
return display === "value" ? String(Number(component.value)) : "";
|
|
1704
|
+
}
|
|
1705
|
+
function buildProgress(component, index) {
|
|
1706
|
+
const box = controlBox(component, index, { width: 220, height: 12 });
|
|
1707
|
+
const min = numberProperty2(component, "min");
|
|
1708
|
+
const max = numberProperty2(component, "max");
|
|
1709
|
+
const fraction = Math.min(1, Math.max(0, (Number(component.value) - min) / (max - min || 1)));
|
|
1710
|
+
const round2 = textProperty(component, "rounded") !== "false";
|
|
1711
|
+
const nodes = [hitArea(component, box)];
|
|
1712
|
+
if (textProperty(component, "variant") === "ring") {
|
|
1713
|
+
const thickness = Math.min(numberProperty2(component, "thickness"), Math.min(box.width, box.height) / 2);
|
|
1714
|
+
const radius = Math.max(1, Math.min(box.width, box.height) / 2 - thickness / 2);
|
|
1715
|
+
const circumference = 2 * Math.PI * radius;
|
|
1716
|
+
const cx = box.x + box.width / 2;
|
|
1717
|
+
const cy = box.y + box.height / 2;
|
|
1718
|
+
const ring = (part, order, color, extra) => ({
|
|
1719
|
+
id: `widget-${component.id}-${part}`,
|
|
1720
|
+
type: "ellipse",
|
|
1721
|
+
order: box.order + order,
|
|
1722
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
1723
|
+
cx,
|
|
1724
|
+
cy,
|
|
1725
|
+
rx: radius,
|
|
1726
|
+
ry: radius,
|
|
1727
|
+
rotation: -90,
|
|
1728
|
+
style: fade(component, { fill: { kind: "none" }, stroke: solid(color), strokeWidth: thickness, ...extra })
|
|
1729
|
+
});
|
|
1730
|
+
nodes.push(ring("track", 0.1, textProperty(component, "track"), {}));
|
|
1731
|
+
nodes.push(
|
|
1732
|
+
ring("fill", 0.2, textProperty(component, "accent"), {
|
|
1733
|
+
dash: [Math.max(1e-3, fraction * circumference), circumference],
|
|
1734
|
+
lineCap: round2 ? "round" : "butt",
|
|
1735
|
+
opacity: fraction > 0 ? 1 : 0
|
|
1736
|
+
})
|
|
1737
|
+
);
|
|
1738
|
+
} else {
|
|
1739
|
+
const vertical = textProperty(component, "direction") === "vertical";
|
|
1740
|
+
const radius = round2 ? (vertical ? box.width : box.height) / 2 : 0;
|
|
1741
|
+
const bar = (part, order, length, color, opacity) => {
|
|
1742
|
+
const shape = vertical ? { x: box.x, y: box.y + box.height - length, width: box.width, height: length } : { x: box.x, y: box.y, width: length, height: box.height };
|
|
1743
|
+
return {
|
|
1744
|
+
id: `widget-${component.id}-${part}`,
|
|
1745
|
+
type: "rect",
|
|
1746
|
+
order: box.order + order,
|
|
1747
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(shape, 0, 0),
|
|
1748
|
+
...shape,
|
|
1749
|
+
rx: radius,
|
|
1750
|
+
style: fade(component, {
|
|
1751
|
+
fill: solid(color),
|
|
1752
|
+
stroke: { kind: "none" },
|
|
1753
|
+
...opacity === void 0 ? {} : { opacity }
|
|
1754
|
+
})
|
|
1755
|
+
};
|
|
1756
|
+
};
|
|
1757
|
+
const full = vertical ? box.height : box.width;
|
|
1758
|
+
nodes.push(bar("track", 0.1, full, textProperty(component, "track")));
|
|
1759
|
+
nodes.push(bar("fill", 0.2, Math.max(0, fraction * full), textProperty(component, "accent"), fraction > 0 ? 1 : 0));
|
|
1760
|
+
}
|
|
1761
|
+
const text = readout2(component, fraction);
|
|
1762
|
+
if (text) {
|
|
1763
|
+
const label = {
|
|
1764
|
+
text,
|
|
1765
|
+
color: ink(component, textProperty(component, "textColor")),
|
|
1766
|
+
fontSize: numberProperty2(component, "fontSize"),
|
|
1767
|
+
align: "center"
|
|
1768
|
+
};
|
|
1769
|
+
nodes.push(labelText(component, "value", box, label, box.order + 0.3));
|
|
1770
|
+
}
|
|
1771
|
+
return nodes;
|
|
1772
|
+
}
|
|
1773
|
+
|
|
1774
|
+
// src/renderScene/artifacts/component/segmented.ts
|
|
1775
|
+
function buildSegmented(component, index) {
|
|
1776
|
+
const box = controlBox(component, index, { width: 300, height: 40 });
|
|
1777
|
+
const options = textProperty(component, "options").split(",").map((option) => option.trim()).filter(Boolean);
|
|
1778
|
+
const count = Math.max(1, options.length);
|
|
1779
|
+
const active = Math.min(count - 1, Math.max(0, Math.round(Number(component.value)) || 0));
|
|
1780
|
+
const inset = Math.min(numberProperty2(component, "inset"), box.height / 2);
|
|
1781
|
+
const radius = Math.min(numberProperty2(component, "radius"), box.height / 2);
|
|
1782
|
+
const cellWidth = (box.width - inset * 2) / count;
|
|
1783
|
+
const cell = { y: box.y + inset, height: box.height - inset * 2 };
|
|
1784
|
+
const nodes = [
|
|
1785
|
+
hitArea(component, box),
|
|
1786
|
+
{
|
|
1787
|
+
id: `widget-${component.id}-track`,
|
|
1788
|
+
type: "rect",
|
|
1789
|
+
order: box.order + 0.1,
|
|
1790
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(box, 0, 0),
|
|
1791
|
+
x: box.x,
|
|
1792
|
+
y: box.y,
|
|
1793
|
+
width: box.width,
|
|
1794
|
+
height: box.height,
|
|
1795
|
+
rx: radius,
|
|
1796
|
+
style: fade(component, { fill: solid(textProperty(component, "track")), stroke: { kind: "none" } })
|
|
1797
|
+
},
|
|
1798
|
+
{
|
|
1799
|
+
id: `widget-${component.id}-active`,
|
|
1800
|
+
type: "rect",
|
|
1801
|
+
order: box.order + 0.2,
|
|
1802
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x: box.x + inset + active * cellWidth, width: cellWidth, ...cell }, 0, 0),
|
|
1803
|
+
x: box.x + inset + active * cellWidth,
|
|
1804
|
+
y: cell.y,
|
|
1805
|
+
width: cellWidth,
|
|
1806
|
+
height: cell.height,
|
|
1807
|
+
rx: Math.max(0, radius - inset),
|
|
1808
|
+
style: fade(component, {
|
|
1809
|
+
fill: solid(textProperty(component, "accent")),
|
|
1810
|
+
stroke: { kind: "none" },
|
|
1811
|
+
shadow: { color: "#000000", opacity: 0.18, blur: 3, dx: 0, dy: 1 }
|
|
1812
|
+
})
|
|
1813
|
+
}
|
|
1814
|
+
];
|
|
1815
|
+
options.forEach((option, position) => {
|
|
1816
|
+
const area = { x: box.x + inset + position * cellWidth, width: cellWidth, ...cell };
|
|
1817
|
+
const color = ink(component, textProperty(component, position === active ? "activeTextColor" : "textColor"));
|
|
1818
|
+
nodes.push(
|
|
1819
|
+
labelText(
|
|
1820
|
+
component,
|
|
1821
|
+
`option-${position}`,
|
|
1822
|
+
area,
|
|
1823
|
+
{ text: option, color, fontSize: numberProperty2(component, "fontSize"), align: "center" },
|
|
1824
|
+
box.order + 0.3
|
|
1825
|
+
)
|
|
1826
|
+
);
|
|
1827
|
+
});
|
|
1828
|
+
return nodes;
|
|
1829
|
+
}
|
|
1830
|
+
|
|
1831
|
+
// src/model/component/sliderReach.ts
|
|
1832
|
+
function sliderReach(variant2, height) {
|
|
1833
|
+
return variant2 === "field" ? Math.min(8, height / 2) : height / 2;
|
|
1834
|
+
}
|
|
1835
|
+
|
|
1836
|
+
// src/renderScene/artifacts/component/slider.ts
|
|
1837
|
+
var HANDLE_WIDTH = 4;
|
|
1838
|
+
var TEXT_PADDING = 12;
|
|
1839
|
+
var TICK_LENGTH = 5;
|
|
1840
|
+
var TICK_THICKNESS = 1.5;
|
|
1841
|
+
function decimals2(step) {
|
|
1842
|
+
return step > 0 ? String(step).split(".")[1]?.length ?? 0 : 0;
|
|
1843
|
+
}
|
|
1844
|
+
function readout3(component, thumbs) {
|
|
1845
|
+
const display = textProperty(component, "display");
|
|
1846
|
+
const places = decimals2(numberProperty2(component, "step"));
|
|
1847
|
+
const parts = display === "percent" ? thumbs.two ? [thumbs.from, thumbs.to].map((fraction) => `${Math.round(fraction * 100)}%`) : [`${Math.round(thumbs.to * 100)}%`] : display === "value" ? thumbs.values.map((value) => value.toFixed(places)) : [];
|
|
1848
|
+
return parts.join(" \u2013 ");
|
|
1849
|
+
}
|
|
1850
|
+
var rect = (component, box, part, order, shape, color, extra = {}) => ({
|
|
1851
|
+
id: `widget-${component.id}-${part}`,
|
|
1852
|
+
type: "rect",
|
|
1853
|
+
order: box.order + order,
|
|
1854
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(shape, 0, 0),
|
|
1855
|
+
...shape,
|
|
1856
|
+
style: fade(component, { fill: solid(color), stroke: { kind: "none" }, ...extra })
|
|
1857
|
+
});
|
|
1858
|
+
function ticks(component, box, vertical, reach, offset) {
|
|
1859
|
+
const count = Math.round(numberProperty2(component, "ticks"));
|
|
1860
|
+
const color = textProperty(component, "tickColor");
|
|
1861
|
+
return Array.from({ length: count >= 2 ? count : 0 }, (_, index) => {
|
|
1862
|
+
const t = index / (count - 1);
|
|
1863
|
+
const shape = vertical ? {
|
|
1864
|
+
x: box.x + offset,
|
|
1865
|
+
y: box.y + box.height - reach - t * (box.height - reach * 2) - TICK_THICKNESS / 2,
|
|
1866
|
+
width: TICK_LENGTH,
|
|
1867
|
+
height: TICK_THICKNESS,
|
|
1868
|
+
rx: TICK_THICKNESS / 2
|
|
1869
|
+
} : {
|
|
1870
|
+
x: box.x + reach + t * (box.width - reach * 2) - TICK_THICKNESS / 2,
|
|
1871
|
+
y: box.y + offset,
|
|
1872
|
+
width: TICK_THICKNESS,
|
|
1873
|
+
height: TICK_LENGTH,
|
|
1874
|
+
rx: TICK_THICKNESS / 2
|
|
1875
|
+
};
|
|
1876
|
+
return rect(component, box, `tick-${index}`, 0.15, shape, color);
|
|
1877
|
+
});
|
|
1878
|
+
}
|
|
1879
|
+
function buildLine(component, box, thumbs, vertical) {
|
|
1880
|
+
const reach = sliderReach("line", vertical ? box.width : box.height);
|
|
1881
|
+
const radius = reach * numberProperty2(component, "thumbSize") / 100;
|
|
1882
|
+
const thickness = Math.min(numberProperty2(component, "trackHeight"), vertical ? box.width : box.height);
|
|
1883
|
+
const mid = vertical ? box.x + box.width / 2 : box.y + box.height / 2;
|
|
1884
|
+
const along2 = (fraction) => vertical ? box.y + box.height - reach - fraction * (box.height - reach * 2) : box.x + reach + fraction * (box.width - reach * 2);
|
|
1885
|
+
const line = (start, end) => vertical ? {
|
|
1886
|
+
x: mid - thickness / 2,
|
|
1887
|
+
y: Math.min(start, end),
|
|
1888
|
+
width: thickness,
|
|
1889
|
+
height: Math.abs(end - start),
|
|
1890
|
+
rx: thickness / 2
|
|
1891
|
+
} : {
|
|
1892
|
+
x: Math.min(start, end),
|
|
1893
|
+
y: mid - thickness / 2,
|
|
1894
|
+
width: Math.abs(end - start),
|
|
1895
|
+
height: thickness,
|
|
1896
|
+
rx: thickness / 2
|
|
1897
|
+
};
|
|
1898
|
+
const whole = vertical ? line(box.y, box.y + box.height) : line(box.x, box.x + box.width);
|
|
1899
|
+
const filled = line(thumbs.two ? along2(thumbs.from) : vertical ? box.y + box.height : box.x, along2(thumbs.to));
|
|
1900
|
+
const thumb = (part, fraction, order) => {
|
|
1901
|
+
const cx = vertical ? mid : along2(fraction);
|
|
1902
|
+
const cy = vertical ? along2(fraction) : mid;
|
|
1903
|
+
return {
|
|
1904
|
+
id: `widget-${component.id}-${part}`,
|
|
1905
|
+
type: "ellipse",
|
|
1906
|
+
order: box.order + order,
|
|
1907
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, 0),
|
|
1908
|
+
cx,
|
|
1909
|
+
cy,
|
|
1910
|
+
rx: radius,
|
|
1911
|
+
ry: radius,
|
|
1912
|
+
style: fade(component, {
|
|
1913
|
+
fill: solid(textProperty(component, "thumb")),
|
|
1914
|
+
stroke: { kind: "none" },
|
|
1915
|
+
shadow: { color: "#000000", opacity: 0.25, blur: 3, dx: 0, dy: 1 }
|
|
1916
|
+
})
|
|
1917
|
+
};
|
|
1918
|
+
};
|
|
1919
|
+
return [
|
|
1920
|
+
rect(component, box, "track", 0.1, whole, textProperty(component, "track")),
|
|
1921
|
+
...ticks(
|
|
1922
|
+
component,
|
|
1923
|
+
box,
|
|
1924
|
+
vertical,
|
|
1925
|
+
reach,
|
|
1926
|
+
vertical ? box.width / 2 + thickness / 2 + 5 : box.height / 2 + thickness / 2 + 5
|
|
1927
|
+
),
|
|
1928
|
+
rect(component, box, "fill", 0.2, filled, textProperty(component, "accent")),
|
|
1929
|
+
...thumbs.two ? [thumb("thumb-start", thumbs.from, 0.3)] : [],
|
|
1930
|
+
thumb(thumbs.two ? "thumb-end" : "thumb", thumbs.to, 0.31)
|
|
1931
|
+
];
|
|
1932
|
+
}
|
|
1933
|
+
function buildField(component, box, thumbs, vertical) {
|
|
1934
|
+
const reach = sliderReach("field", vertical ? box.width : box.height);
|
|
1935
|
+
const radius = Math.min(numberProperty2(component, "radius"), Math.min(box.width, box.height) / 2);
|
|
1936
|
+
const whole = { x: box.x, y: box.y, width: box.width, height: box.height, rx: radius };
|
|
1937
|
+
const along2 = (fraction) => vertical ? box.y + box.height - reach - fraction * (box.height - reach * 2) : box.x + reach + fraction * (box.width - reach * 2);
|
|
1938
|
+
const start = thumbs.two ? along2(thumbs.from) : vertical ? box.y + box.height : box.x;
|
|
1939
|
+
const end = along2(thumbs.to);
|
|
1940
|
+
const first = Math.min(start, end) - (thumbs.two ? HANDLE_WIDTH / 2 : 0);
|
|
1941
|
+
const last = Math.max(start, end) + HANDLE_WIDTH / 2;
|
|
1942
|
+
const filled = vertical ? {
|
|
1943
|
+
...whole,
|
|
1944
|
+
y: thumbs.two ? first : end - HANDLE_WIDTH / 2,
|
|
1945
|
+
height: thumbs.two ? last - first : Math.max(0, box.y + box.height - end + HANDLE_WIDTH / 2),
|
|
1946
|
+
rx: thumbs.two ? 0 : radius
|
|
1947
|
+
} : {
|
|
1948
|
+
...whole,
|
|
1949
|
+
x: thumbs.two ? first : box.x,
|
|
1950
|
+
width: thumbs.two ? last - first : Math.max(0, end + HANDLE_WIDTH / 2 - box.x),
|
|
1951
|
+
rx: thumbs.two ? 0 : radius
|
|
1952
|
+
};
|
|
1953
|
+
const handleLength = (vertical ? box.width : box.height) * 0.5;
|
|
1954
|
+
const handle = (part, at) => {
|
|
1955
|
+
const shape = vertical ? {
|
|
1956
|
+
x: box.x + (box.width - handleLength) / 2,
|
|
1957
|
+
y: at - HANDLE_WIDTH / 2,
|
|
1958
|
+
width: handleLength,
|
|
1959
|
+
height: HANDLE_WIDTH,
|
|
1960
|
+
rx: HANDLE_WIDTH / 2
|
|
1961
|
+
} : {
|
|
1962
|
+
x: at - HANDLE_WIDTH / 2,
|
|
1963
|
+
y: box.y + (box.height - handleLength) / 2,
|
|
1964
|
+
width: HANDLE_WIDTH,
|
|
1965
|
+
height: handleLength,
|
|
1966
|
+
rx: HANDLE_WIDTH / 2
|
|
1967
|
+
};
|
|
1968
|
+
return rect(component, box, part, 0.3, shape, textProperty(component, "accent"));
|
|
1969
|
+
};
|
|
1970
|
+
const nodes = [
|
|
1971
|
+
rect(component, box, "track", 0.1, whole, textProperty(component, "surface")),
|
|
1972
|
+
rect(component, box, "fill", 0.2, filled, textProperty(component, "fill")),
|
|
1973
|
+
...thumbs.two ? [handle("handle-start", start)] : [],
|
|
1974
|
+
handle(thumbs.two ? "handle-end" : "handle", end)
|
|
1975
|
+
];
|
|
1976
|
+
const text = {
|
|
1977
|
+
color: ink(component, textProperty(component, "textColor")),
|
|
1978
|
+
fontSize: numberProperty2(component, "fontSize")
|
|
1979
|
+
};
|
|
1980
|
+
const value = readout3(component, thumbs);
|
|
1981
|
+
if (vertical) {
|
|
1982
|
+
if (value) {
|
|
1983
|
+
nodes.push(
|
|
1984
|
+
labelText(
|
|
1985
|
+
component,
|
|
1986
|
+
"value",
|
|
1987
|
+
{ x: box.x, y: box.y + 6, width: box.width, height: 20 },
|
|
1988
|
+
{ ...text, text: value, align: "center" },
|
|
1989
|
+
box.order + 0.4
|
|
1990
|
+
)
|
|
1991
|
+
);
|
|
1992
|
+
}
|
|
1993
|
+
return nodes;
|
|
1994
|
+
}
|
|
1995
|
+
const inner = { y: box.y, height: box.height, width: Math.max(0, box.width / 2 - TEXT_PADDING) };
|
|
1996
|
+
if (component.label) {
|
|
1997
|
+
nodes.push(
|
|
1998
|
+
labelText(
|
|
1999
|
+
component,
|
|
2000
|
+
"label",
|
|
2001
|
+
{ x: box.x + TEXT_PADDING, ...inner },
|
|
2002
|
+
{ ...text, text: component.label, align: "left" },
|
|
2003
|
+
box.order + 0.4
|
|
2004
|
+
)
|
|
2005
|
+
);
|
|
2006
|
+
}
|
|
2007
|
+
if (value) {
|
|
2008
|
+
nodes.push(
|
|
2009
|
+
labelText(
|
|
2010
|
+
component,
|
|
2011
|
+
"value",
|
|
2012
|
+
{ x: box.x + box.width / 2, ...inner },
|
|
2013
|
+
{ ...text, text: value, align: "right" },
|
|
2014
|
+
box.order + 0.4
|
|
2015
|
+
)
|
|
2016
|
+
);
|
|
2017
|
+
}
|
|
2018
|
+
nodes.push(...ticks(component, box, false, reach, box.height - TICK_LENGTH - 5));
|
|
2019
|
+
return nodes;
|
|
2020
|
+
}
|
|
2021
|
+
function buildSlider(component, index) {
|
|
2022
|
+
const field = textProperty(component, "variant") === "field";
|
|
2023
|
+
const vertical = textProperty(component, "direction") === "vertical";
|
|
2024
|
+
const fallback = vertical ? { width: field ? 56 : 28, height: 180 } : { width: 220, height: field ? 36 : 28 };
|
|
2025
|
+
const box = controlBox(component, index, fallback);
|
|
2026
|
+
const min = numberProperty2(component, "min");
|
|
2027
|
+
const max = numberProperty2(component, "max");
|
|
2028
|
+
const fractionOf = (value) => Math.min(1, Math.max(0, (value - min) / (max - min || 1)));
|
|
2029
|
+
const two = component.type === "range";
|
|
2030
|
+
const low = Number(component.value);
|
|
2031
|
+
const high = two ? Number(component.properties.valueEnd ?? max) : low;
|
|
2032
|
+
const thumbs = {
|
|
2033
|
+
from: fractionOf(two ? Math.min(low, high) : min),
|
|
2034
|
+
to: fractionOf(two ? Math.max(low, high) : low),
|
|
2035
|
+
values: two ? [Math.min(low, high), Math.max(low, high)] : [low],
|
|
2036
|
+
two
|
|
2037
|
+
};
|
|
2038
|
+
return [
|
|
2039
|
+
hitArea(component, box),
|
|
2040
|
+
...field ? buildField(component, box, thumbs, vertical) : buildLine(component, box, thumbs, vertical)
|
|
2041
|
+
];
|
|
2042
|
+
}
|
|
2043
|
+
|
|
1585
2044
|
// src/renderScene/artifacts/component/switch.ts
|
|
1586
2045
|
var PADDING_RATIO = 0.12;
|
|
1587
2046
|
function buildSwitch(component, index) {
|
|
@@ -1597,7 +2056,7 @@ function buildSwitch(component, index) {
|
|
|
1597
2056
|
id: `widget-${component.id}-track`,
|
|
1598
2057
|
type: "rect",
|
|
1599
2058
|
order: box.order + 0.1,
|
|
1600
|
-
bounds:
|
|
2059
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(box, 0, 0),
|
|
1601
2060
|
x: box.x,
|
|
1602
2061
|
y: box.y,
|
|
1603
2062
|
width: box.width,
|
|
@@ -1612,7 +2071,7 @@ function buildSwitch(component, index) {
|
|
|
1612
2071
|
id: `widget-${component.id}-thumb`,
|
|
1613
2072
|
type: "ellipse",
|
|
1614
2073
|
order: box.order + 0.2,
|
|
1615
|
-
bounds:
|
|
2074
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(thumb, 0, 0),
|
|
1616
2075
|
cx: centerX,
|
|
1617
2076
|
cy: box.y + box.height / 2,
|
|
1618
2077
|
rx: radius,
|
|
@@ -1636,7 +2095,7 @@ function buildToggleButton(component, index) {
|
|
|
1636
2095
|
id: `widget-${component.id}-face`,
|
|
1637
2096
|
type: "rect",
|
|
1638
2097
|
order: box.order + 0.1,
|
|
1639
|
-
bounds:
|
|
2098
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(box, 0, 2),
|
|
1640
2099
|
x: box.x,
|
|
1641
2100
|
y: box.y,
|
|
1642
2101
|
width: box.width,
|
|
@@ -1670,7 +2129,12 @@ var builders = /* @__PURE__ */ new Map([
|
|
|
1670
2129
|
["switch", asComponentBuilder(buildSwitch)],
|
|
1671
2130
|
["checkbox", asComponentBuilder(buildCheckbox)],
|
|
1672
2131
|
["toggleButton", asComponentBuilder(buildToggleButton)],
|
|
1673
|
-
["button", asComponentBuilder(buildButton)]
|
|
2132
|
+
["button", asComponentBuilder(buildButton)],
|
|
2133
|
+
["slider", asComponentBuilder(buildSlider)],
|
|
2134
|
+
["progress", asComponentBuilder(buildProgress)],
|
|
2135
|
+
["segmented", asComponentBuilder(buildSegmented)],
|
|
2136
|
+
["knob", asComponentBuilder(buildKnob)],
|
|
2137
|
+
["range", asComponentBuilder(buildSlider)]
|
|
1674
2138
|
]);
|
|
1675
2139
|
function registerComponentBuilder(type, builder) {
|
|
1676
2140
|
builders.set(type, builder);
|
|
@@ -1686,8 +2150,8 @@ function getComponentBuilder(type) {
|
|
|
1686
2150
|
|
|
1687
2151
|
// src/renderScene/artifacts/component/build.ts
|
|
1688
2152
|
function ariaOf(component) {
|
|
1689
|
-
const role =
|
|
1690
|
-
if (!role || !
|
|
2153
|
+
const role = chunkKXYSO6GC_cjs.getComponentDescriptor(component.type)?.role;
|
|
2154
|
+
if (!role || !chunkKXYSO6GC_cjs.isGenericComponent(component)) {
|
|
1691
2155
|
return void 0;
|
|
1692
2156
|
}
|
|
1693
2157
|
const flag = typeof component.value === "boolean" ? component.value : void 0;
|
|
@@ -1698,12 +2162,12 @@ function ariaOf(component) {
|
|
|
1698
2162
|
};
|
|
1699
2163
|
}
|
|
1700
2164
|
function labelOf(component) {
|
|
1701
|
-
return component.label ?? (
|
|
2165
|
+
return component.label ?? (chunkKXYSO6GC_cjs.isGenericComponent(component) ? component.id : String(component.value));
|
|
1702
2166
|
}
|
|
1703
2167
|
function buildComponents(components) {
|
|
1704
2168
|
return components.flatMap((component, index) => {
|
|
1705
2169
|
const build = getComponentBuilder(component.type) ?? buildPlaceholder;
|
|
1706
|
-
const nodes =
|
|
2170
|
+
const nodes = chunkKXYSO6GC_cjs.tag(
|
|
1707
2171
|
build(component, index),
|
|
1708
2172
|
"widget",
|
|
1709
2173
|
component.id,
|
|
@@ -1743,13 +2207,13 @@ function tabBox(input, thickness, length) {
|
|
|
1743
2207
|
y,
|
|
1744
2208
|
width: length,
|
|
1745
2209
|
height: thickness,
|
|
1746
|
-
path:
|
|
2210
|
+
path: chunkKXYSO6GC_cjs.bottomRoundedRectPath(x, y, length, thickness, TAB_RADIUS)
|
|
1747
2211
|
};
|
|
1748
2212
|
}
|
|
1749
2213
|
case "left": {
|
|
1750
2214
|
const x = input.x - thickness;
|
|
1751
2215
|
const y = input.y - inset;
|
|
1752
|
-
return { x, y, width: thickness, height: length, path:
|
|
2216
|
+
return { x, y, width: thickness, height: length, path: chunkKXYSO6GC_cjs.leftRoundedRectPath(x, y, thickness, length, TAB_RADIUS) };
|
|
1753
2217
|
}
|
|
1754
2218
|
case "right": {
|
|
1755
2219
|
const x = input.x + input.width;
|
|
@@ -1759,13 +2223,13 @@ function tabBox(input, thickness, length) {
|
|
|
1759
2223
|
y,
|
|
1760
2224
|
width: thickness,
|
|
1761
2225
|
height: length,
|
|
1762
|
-
path:
|
|
2226
|
+
path: chunkKXYSO6GC_cjs.rightRoundedRectPath(x, y, thickness, length, TAB_RADIUS)
|
|
1763
2227
|
};
|
|
1764
2228
|
}
|
|
1765
2229
|
default: {
|
|
1766
2230
|
const x = input.x - inset;
|
|
1767
2231
|
const y = input.y - thickness;
|
|
1768
|
-
return { x, y, width: length, height: thickness, path:
|
|
2232
|
+
return { x, y, width: length, height: thickness, path: chunkKXYSO6GC_cjs.topRoundedRectPath(x, y, length, thickness, TAB_RADIUS) };
|
|
1769
2233
|
}
|
|
1770
2234
|
}
|
|
1771
2235
|
}
|
|
@@ -1774,7 +2238,7 @@ function renderTitleTab(input) {
|
|
|
1774
2238
|
const padding = 16;
|
|
1775
2239
|
const length = Math.max(120, input.title.length * input.fontSize * 0.62 + padding * 2);
|
|
1776
2240
|
const box = tabBox(input, thickness, length);
|
|
1777
|
-
const bounds =
|
|
2241
|
+
const bounds = chunkKXYSO6GC_cjs.boxBounds(box, 6);
|
|
1778
2242
|
const vertical = input.labelPosition === "left" || input.labelPosition === "right";
|
|
1779
2243
|
return [
|
|
1780
2244
|
{
|
|
@@ -1802,7 +2266,7 @@ function horizontalTitleText(input, box, padding, bounds) {
|
|
|
1802
2266
|
width: Math.max(0, box.width - padding * 2),
|
|
1803
2267
|
height: box.height,
|
|
1804
2268
|
lines: [input.title],
|
|
1805
|
-
fontFamily: input.fontFamily ??
|
|
2269
|
+
fontFamily: input.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
1806
2270
|
fontSize: input.fontSize,
|
|
1807
2271
|
fontWeight: input.fontWeight,
|
|
1808
2272
|
color: input.textColor,
|
|
@@ -1826,7 +2290,7 @@ function verticalTitleText(input, box, padding, bounds) {
|
|
|
1826
2290
|
width: textLength,
|
|
1827
2291
|
height: textThickness,
|
|
1828
2292
|
lines: [input.title],
|
|
1829
|
-
fontFamily: input.fontFamily ??
|
|
2293
|
+
fontFamily: input.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
1830
2294
|
fontSize: input.fontSize,
|
|
1831
2295
|
fontWeight: input.fontWeight,
|
|
1832
2296
|
color: input.textColor,
|
|
@@ -1847,7 +2311,7 @@ var SQUARED_CORNER_BY_LABEL_POSITION = {
|
|
|
1847
2311
|
};
|
|
1848
2312
|
function frameBoundaryNode(frame, order, hasTab) {
|
|
1849
2313
|
const shadow = frame.shadow ?? true;
|
|
1850
|
-
const bounds =
|
|
2314
|
+
const bounds = chunkKXYSO6GC_cjs.boxBounds(
|
|
1851
2315
|
{ x: frame.x, y: frame.y, width: frame.width, height: frame.height },
|
|
1852
2316
|
frame.strokeWidth + (shadow ? 20 : 4)
|
|
1853
2317
|
);
|
|
@@ -1882,7 +2346,7 @@ function frameBoundaryNode(frame, order, hasTab) {
|
|
|
1882
2346
|
id: `frame-${frame.id}`,
|
|
1883
2347
|
order,
|
|
1884
2348
|
bounds,
|
|
1885
|
-
d:
|
|
2349
|
+
d: chunkKXYSO6GC_cjs.cornersRoundedRectPath(frame.x, frame.y, frame.width, frame.height, radii),
|
|
1886
2350
|
detail: { of: "frameBoundary", cornerRadius: frame.cornerRadius, squareCorner: squared },
|
|
1887
2351
|
style
|
|
1888
2352
|
};
|
|
@@ -1971,7 +2435,7 @@ function labelBase(context, lane, index) {
|
|
|
1971
2435
|
id: `swimlane-label-${context.swimlane.id}-${lane.id}`,
|
|
1972
2436
|
order: context.order + 0.5 + index / 100,
|
|
1973
2437
|
lines: [lane.label],
|
|
1974
|
-
fontFamily: context.swimlane.fontFamily ??
|
|
2438
|
+
fontFamily: context.swimlane.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
1975
2439
|
fontSize: context.swimlane.fontSize,
|
|
1976
2440
|
fontWeight: context.swimlane.fontWeight,
|
|
1977
2441
|
color: context.swimlane.textColor,
|
|
@@ -1987,7 +2451,7 @@ function horizontalLabel(context, lane, index) {
|
|
|
1987
2451
|
const y = centerY - thickness / 2;
|
|
1988
2452
|
return {
|
|
1989
2453
|
...labelBase(context, lane, index),
|
|
1990
|
-
bounds:
|
|
2454
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x, y, width, height: thickness }, -90, 12),
|
|
1991
2455
|
x,
|
|
1992
2456
|
y,
|
|
1993
2457
|
width,
|
|
@@ -2039,7 +2503,7 @@ function createSwimlaneRenderContext(swimlane, index) {
|
|
|
2039
2503
|
return {
|
|
2040
2504
|
swimlane,
|
|
2041
2505
|
order: 5e3 + index,
|
|
2042
|
-
bounds:
|
|
2506
|
+
bounds: chunkKXYSO6GC_cjs.boxBounds(
|
|
2043
2507
|
{ x: swimlane.x, y: swimlane.y, width: swimlane.width, height: swimlane.height },
|
|
2044
2508
|
swimlane.strokeWidth + 4
|
|
2045
2509
|
),
|
|
@@ -2078,9 +2542,9 @@ function buildSwimlane(swimlane, index) {
|
|
|
2078
2542
|
function buildContainers(input) {
|
|
2079
2543
|
return [
|
|
2080
2544
|
...input.frames.flatMap(
|
|
2081
|
-
(frame, index) =>
|
|
2545
|
+
(frame, index) => chunkKXYSO6GC_cjs.tag(buildFrame(frame, index), "frame", frame.id, void 0, frame.title ?? void 0)
|
|
2082
2546
|
),
|
|
2083
|
-
...input.swimlanes.flatMap((swimlane, index) =>
|
|
2547
|
+
...input.swimlanes.flatMap((swimlane, index) => chunkKXYSO6GC_cjs.tag(buildSwimlane(swimlane, index), "swimlane", swimlane.id))
|
|
2084
2548
|
];
|
|
2085
2549
|
}
|
|
2086
2550
|
|
|
@@ -2130,7 +2594,7 @@ var DEFAULT_COLOR = "#475569";
|
|
|
2130
2594
|
var CHAR_WIDTH = 0.6;
|
|
2131
2595
|
var pathData = (segments) => segments.map(([from, to]) => `M ${from.x} ${from.y} L ${to.x} ${to.y}`).join(" ");
|
|
2132
2596
|
function pathNode(dimension, name, order, segments) {
|
|
2133
|
-
const strokeWidth = Math.max(0,
|
|
2597
|
+
const strokeWidth = Math.max(0, chunkKXYSO6GC_cjs.finite(dimension.strokeWidth, 1));
|
|
2134
2598
|
const points = segments.flat();
|
|
2135
2599
|
return {
|
|
2136
2600
|
type: "path",
|
|
@@ -2152,7 +2616,7 @@ function pathNode(dimension, name, order, segments) {
|
|
|
2152
2616
|
};
|
|
2153
2617
|
}
|
|
2154
2618
|
function labelNode2(dimension, order, text, center, angle) {
|
|
2155
|
-
const fontSize =
|
|
2619
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(dimension.fontSize, 11);
|
|
2156
2620
|
const width = Math.max(24, text.length * fontSize * CHAR_WIDTH + 8);
|
|
2157
2621
|
const height = fontSize * 1.3;
|
|
2158
2622
|
return {
|
|
@@ -2170,7 +2634,7 @@ function labelNode2(dimension, order, text, center, angle) {
|
|
|
2170
2634
|
width,
|
|
2171
2635
|
height,
|
|
2172
2636
|
lines: [text],
|
|
2173
|
-
fontFamily:
|
|
2637
|
+
fontFamily: chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
2174
2638
|
fontSize,
|
|
2175
2639
|
fontWeight: "normal",
|
|
2176
2640
|
color: dimension.textColor ?? dimension.strokeColor ?? DEFAULT_COLOR,
|
|
@@ -2195,7 +2659,7 @@ function buildDimension(dimension, index) {
|
|
|
2195
2659
|
}
|
|
2196
2660
|
function buildDimensions(dimensions) {
|
|
2197
2661
|
return dimensions.flatMap(
|
|
2198
|
-
(dimension, index) =>
|
|
2662
|
+
(dimension, index) => chunkKXYSO6GC_cjs.tag(
|
|
2199
2663
|
buildDimension(dimension, index),
|
|
2200
2664
|
"dimension",
|
|
2201
2665
|
dimension.id,
|
|
@@ -2209,9 +2673,9 @@ function buildDimensions(dimensions) {
|
|
|
2209
2673
|
// src/renderScene/artifacts/isometric/context.ts
|
|
2210
2674
|
var FILL_PROP = { prop: "style.fill", propKind: "color", propSolidOnly: true };
|
|
2211
2675
|
function isometricContext(object, index) {
|
|
2212
|
-
const strokeWidth = Math.max(0,
|
|
2213
|
-
const rotation =
|
|
2214
|
-
const box =
|
|
2676
|
+
const strokeWidth = Math.max(0, chunkKXYSO6GC_cjs.finite(object.strokeWidth, 1));
|
|
2677
|
+
const rotation = chunkKXYSO6GC_cjs.finite(object.rotation, 0);
|
|
2678
|
+
const box = chunkKXYSO6GC_cjs.isometricBounds(object);
|
|
2215
2679
|
const rotationCenter = { x: box.x + box.width / 2, y: box.y + box.height / 2 };
|
|
2216
2680
|
return {
|
|
2217
2681
|
object,
|
|
@@ -2223,7 +2687,7 @@ function isometricContext(object, index) {
|
|
|
2223
2687
|
strokeWidth,
|
|
2224
2688
|
common: {
|
|
2225
2689
|
type: "path",
|
|
2226
|
-
bounds:
|
|
2690
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(box, rotation, strokeWidth + 2),
|
|
2227
2691
|
rotation,
|
|
2228
2692
|
rotationCenter,
|
|
2229
2693
|
style: {
|
|
@@ -2239,13 +2703,13 @@ function faceNode(context, name, offset, points, style) {
|
|
|
2239
2703
|
...context.common,
|
|
2240
2704
|
id: `isometric-${context.object.id}-${name}`,
|
|
2241
2705
|
order: context.order + offset,
|
|
2242
|
-
d:
|
|
2706
|
+
d: chunkKXYSO6GC_cjs.roundedPolygonPath([...points], 0),
|
|
2243
2707
|
style,
|
|
2244
2708
|
...FILL_PROP
|
|
2245
2709
|
};
|
|
2246
2710
|
}
|
|
2247
2711
|
function silhouette(object) {
|
|
2248
|
-
const faces =
|
|
2712
|
+
const faces = chunkKXYSO6GC_cjs.isometricFaces(object);
|
|
2249
2713
|
return [faces.top[0], faces.top[1], faces.right[2], faces.front[2], faces.front[3], faces.top[3]];
|
|
2250
2714
|
}
|
|
2251
2715
|
function hullNode(context, hullPath, cornerRadius) {
|
|
@@ -2262,15 +2726,15 @@ function hullNode(context, hullPath, cornerRadius) {
|
|
|
2262
2726
|
depth: Math.max(0, object.depth),
|
|
2263
2727
|
cornerRadius,
|
|
2264
2728
|
bounds: box,
|
|
2265
|
-
labelOffsetX:
|
|
2266
|
-
labelOffsetY:
|
|
2729
|
+
labelOffsetX: chunkKXYSO6GC_cjs.finite(object.labelOffsetX, 0),
|
|
2730
|
+
labelOffsetY: chunkKXYSO6GC_cjs.finite(object.labelOffsetY, 0)
|
|
2267
2731
|
},
|
|
2268
2732
|
style: { ...common.style, fill: { kind: "none" } }
|
|
2269
2733
|
};
|
|
2270
2734
|
}
|
|
2271
2735
|
function unseenHullNode(context) {
|
|
2272
2736
|
return {
|
|
2273
|
-
...hullNode(context,
|
|
2737
|
+
...hullNode(context, chunkKXYSO6GC_cjs.roundedPolygonPath(silhouette(context.object), 0), 0),
|
|
2274
2738
|
style: { ...context.common.style, fill: { kind: "none" }, stroke: { kind: "none" } }
|
|
2275
2739
|
};
|
|
2276
2740
|
}
|
|
@@ -2283,9 +2747,9 @@ var LABEL_PADDING_Y = 3;
|
|
|
2283
2747
|
var LABEL_CHAR_WIDTH = 6.5;
|
|
2284
2748
|
function labelPlacement(context) {
|
|
2285
2749
|
const { object } = context;
|
|
2286
|
-
const anchor =
|
|
2287
|
-
const bottomY = anchor.y - LABEL_GAP +
|
|
2288
|
-
return { anchor, centerX: anchor.x +
|
|
2750
|
+
const anchor = chunkKXYSO6GC_cjs.isometricTopFaceCenter(object);
|
|
2751
|
+
const bottomY = anchor.y - LABEL_GAP + chunkKXYSO6GC_cjs.finite(object.labelOffsetY, 0);
|
|
2752
|
+
return { anchor, centerX: anchor.x + chunkKXYSO6GC_cjs.finite(object.labelOffsetX, 0), topY: bottomY - LABEL_HEIGHT, bottomY };
|
|
2289
2753
|
}
|
|
2290
2754
|
function labelTextNode(context, placement, text) {
|
|
2291
2755
|
const { object, order, rotation, rotationCenter, box } = context;
|
|
@@ -2300,7 +2764,7 @@ function labelTextNode(context, placement, text) {
|
|
|
2300
2764
|
width: box.width,
|
|
2301
2765
|
height: LABEL_HEIGHT,
|
|
2302
2766
|
lines: [text],
|
|
2303
|
-
fontFamily:
|
|
2767
|
+
fontFamily: chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
2304
2768
|
fontSize: 12,
|
|
2305
2769
|
fontWeight: "normal",
|
|
2306
2770
|
color: "#111827",
|
|
@@ -2380,7 +2844,7 @@ function groundShadowNode(context, topOutline) {
|
|
|
2380
2844
|
}
|
|
2381
2845
|
const height = Math.max(0, object.height);
|
|
2382
2846
|
const heightFactor = 0.6 + Math.min(1, height / 150) * 0.7;
|
|
2383
|
-
const shadowDrop = height +
|
|
2847
|
+
const shadowDrop = height + chunkKXYSO6GC_cjs.finite(object.shadowStyle?.distance, 0);
|
|
2384
2848
|
const contactFootprint = topOutline.map((point) => ({ x: point.x, y: point.y + shadowDrop }));
|
|
2385
2849
|
const footprintCenter = {
|
|
2386
2850
|
x: contactFootprint.reduce((sum, point) => sum + point.x, 0) / contactFootprint.length,
|
|
@@ -2403,14 +2867,14 @@ function groundShadowNode(context, topOutline) {
|
|
|
2403
2867
|
maxX: Math.max(...footprintXs),
|
|
2404
2868
|
maxY: Math.max(...footprintYs)
|
|
2405
2869
|
},
|
|
2406
|
-
d:
|
|
2870
|
+
d: chunkKXYSO6GC_cjs.roundedPolygonPath(footprint, 0),
|
|
2407
2871
|
rotation,
|
|
2408
2872
|
rotationCenter,
|
|
2409
2873
|
style: {
|
|
2410
2874
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
2411
2875
|
stroke: { kind: "none" },
|
|
2412
2876
|
opacity: Math.min(1, (object.shadowStyle?.opacity ?? 0.18) * heightFactor),
|
|
2413
|
-
blur:
|
|
2877
|
+
blur: chunkKXYSO6GC_cjs.finite(object.shadowStyle?.blur, 8),
|
|
2414
2878
|
pointerEvents: "none"
|
|
2415
2879
|
}
|
|
2416
2880
|
};
|
|
@@ -2424,7 +2888,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2424
2888
|
const depth = Math.max(0, object.depth);
|
|
2425
2889
|
const center = {
|
|
2426
2890
|
x: box.x + box.width / 2,
|
|
2427
|
-
y: object.y + Math.max(0, object.height) + (width + depth) *
|
|
2891
|
+
y: object.y + Math.max(0, object.height) + (width + depth) * chunkKXYSO6GC_cjs.AXIS_SIN / 2
|
|
2428
2892
|
};
|
|
2429
2893
|
return {
|
|
2430
2894
|
type: "ellipse",
|
|
@@ -2444,7 +2908,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2444
2908
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
2445
2909
|
stroke: { kind: "none" },
|
|
2446
2910
|
opacity: object.shadowStyle?.opacity ?? 0.2,
|
|
2447
|
-
blur:
|
|
2911
|
+
blur: chunkKXYSO6GC_cjs.finite(object.shadowStyle?.blur, 8),
|
|
2448
2912
|
pointerEvents: "none"
|
|
2449
2913
|
}
|
|
2450
2914
|
};
|
|
@@ -2454,7 +2918,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2454
2918
|
function faceNodes(context, faces, hullClip) {
|
|
2455
2919
|
const { object, common } = context;
|
|
2456
2920
|
const noStroke = { ...common.style, stroke: { kind: "none" } };
|
|
2457
|
-
const fills =
|
|
2921
|
+
const fills = chunkKXYSO6GC_cjs.deriveFaceFills(object.fill ?? "#f8fafc");
|
|
2458
2922
|
const face = (name, offset, points, color) => faceNode(context, name, offset, points, { ...noStroke, fill: { kind: "solid", color }, clip: hullClip });
|
|
2459
2923
|
return [
|
|
2460
2924
|
face("top", 0, faces.top, fills.topFill),
|
|
@@ -2480,9 +2944,9 @@ function seamsNode(context, faces, hullClip) {
|
|
|
2480
2944
|
}
|
|
2481
2945
|
function buildBox(object, index) {
|
|
2482
2946
|
const context = isometricContext(object, index);
|
|
2483
|
-
const faces =
|
|
2484
|
-
const cornerRadius = Math.max(0,
|
|
2485
|
-
const hullPath =
|
|
2947
|
+
const faces = chunkKXYSO6GC_cjs.isometricFaces(object);
|
|
2948
|
+
const cornerRadius = Math.max(0, chunkKXYSO6GC_cjs.finite(object.cornerRadius, 8));
|
|
2949
|
+
const hullPath = chunkKXYSO6GC_cjs.roundedPolygonPath(silhouette(object), cornerRadius);
|
|
2486
2950
|
const hullClip = { type: "path", d: hullPath };
|
|
2487
2951
|
const groundShadow = groundShadowNode(context, faces.top);
|
|
2488
2952
|
const seams = seamsNode(context, faces, hullClip);
|
|
@@ -2494,7 +2958,7 @@ function buildBox(object, index) {
|
|
|
2494
2958
|
|
|
2495
2959
|
// src/renderScene/artifacts/isometric/extruded.ts
|
|
2496
2960
|
function wallNode(context, side, index, fill2) {
|
|
2497
|
-
const color =
|
|
2961
|
+
const color = chunkKXYSO6GC_cjs.shadeFill(fill2, side.light);
|
|
2498
2962
|
return faceNode(context, `side-${index}`, 0.05 + index * 1e-3, side.points, {
|
|
2499
2963
|
...context.common.style,
|
|
2500
2964
|
stroke: { kind: "solid", color },
|
|
@@ -2519,7 +2983,7 @@ function wallEdgesNode(context, side, index) {
|
|
|
2519
2983
|
}
|
|
2520
2984
|
function buildExtruded(object, index, footprint) {
|
|
2521
2985
|
const context = isometricContext(object, index);
|
|
2522
|
-
const { top, sides } =
|
|
2986
|
+
const { top, sides } = chunkKXYSO6GC_cjs.extrudeFootprint(object, footprint, Math.max(0, chunkKXYSO6GC_cjs.finite(object.cornerRadius, 0)));
|
|
2523
2987
|
const fill2 = object.fill ?? "#f8fafc";
|
|
2524
2988
|
const groundShadow = groundShadowNode(context, top);
|
|
2525
2989
|
const topFace = faceNode(context, "top", 0.2, top, { ...context.common.style, fill: { kind: "solid", color: fill2 } });
|
|
@@ -2556,9 +3020,9 @@ function buildSphere(object, index) {
|
|
|
2556
3020
|
kind: "linear-gradient",
|
|
2557
3021
|
angle: 135,
|
|
2558
3022
|
stops: [
|
|
2559
|
-
{ offset: 0, color:
|
|
3023
|
+
{ offset: 0, color: chunkKXYSO6GC_cjs.shadeFill(fill2, 1.22) },
|
|
2560
3024
|
{ offset: 0.5, color: fill2 },
|
|
2561
|
-
{ offset: 1, color:
|
|
3025
|
+
{ offset: 1, color: chunkKXYSO6GC_cjs.shadeFill(fill2, 0.82) }
|
|
2562
3026
|
]
|
|
2563
3027
|
}
|
|
2564
3028
|
},
|
|
@@ -2594,12 +3058,12 @@ function buildIsometricObject(object, index) {
|
|
|
2594
3058
|
if (object.form === "sphere") {
|
|
2595
3059
|
return buildSphere(object, index);
|
|
2596
3060
|
}
|
|
2597
|
-
const footprint =
|
|
3061
|
+
const footprint = chunkKXYSO6GC_cjs.cleanFootprint(object.footprint);
|
|
2598
3062
|
return footprint.length > 0 ? buildExtruded(object, index, footprint) : buildBox(object, index);
|
|
2599
3063
|
}
|
|
2600
3064
|
function buildIsometricObjects(objects) {
|
|
2601
3065
|
return objects.flatMap(
|
|
2602
|
-
(object, index) =>
|
|
3066
|
+
(object, index) => chunkKXYSO6GC_cjs.tag(
|
|
2603
3067
|
buildIsometricObject(object, index),
|
|
2604
3068
|
"isometric",
|
|
2605
3069
|
object.id,
|
|
@@ -2628,7 +3092,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
2628
3092
|
if (!label) {
|
|
2629
3093
|
return [];
|
|
2630
3094
|
}
|
|
2631
|
-
const fontSize =
|
|
3095
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(context.link.style?.fontSize, 10);
|
|
2632
3096
|
const position = endpointLabelPosition(context.points, end);
|
|
2633
3097
|
const width = 90;
|
|
2634
3098
|
return [
|
|
@@ -2642,7 +3106,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
2642
3106
|
width,
|
|
2643
3107
|
height: fontSize * 2,
|
|
2644
3108
|
lines: [label],
|
|
2645
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3109
|
+
fontFamily: context.link.style?.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
2646
3110
|
fontSize,
|
|
2647
3111
|
fontWeight: "normal",
|
|
2648
3112
|
color: context.color,
|
|
@@ -2672,7 +3136,7 @@ function renderMainLabel(context) {
|
|
|
2672
3136
|
width: context.label.width,
|
|
2673
3137
|
height: context.label.fontSize * 2,
|
|
2674
3138
|
lines: context.label.lines,
|
|
2675
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3139
|
+
fontFamily: context.link.style?.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
2676
3140
|
fontSize: context.label.fontSize,
|
|
2677
3141
|
fontWeight: "normal",
|
|
2678
3142
|
color: context.color,
|
|
@@ -2726,10 +3190,10 @@ function linkBounds(points, padding) {
|
|
|
2726
3190
|
}
|
|
2727
3191
|
function labelLayout(link, measureText) {
|
|
2728
3192
|
const visible = Boolean(link.showText && link.text);
|
|
2729
|
-
const fontSize =
|
|
3193
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(link.style?.fontSize, 10);
|
|
2730
3194
|
const width = Math.min(250, Math.max(fontSize * 2, (link.text?.length ?? 0) * fontSize * 0.65 + 10));
|
|
2731
|
-
const metrics = measureText?.(link.style?.fontFamily ??
|
|
2732
|
-
const lines = visible ?
|
|
3195
|
+
const metrics = measureText?.(link.style?.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT, fontSize);
|
|
3196
|
+
const lines = visible ? chunkKXYSO6GC_cjs.wrapText(link.text ?? "", width, fontSize, metrics) : [];
|
|
2733
3197
|
return { visible, fontSize, width, height: lines.length * fontSize * 1.4, lines };
|
|
2734
3198
|
}
|
|
2735
3199
|
function linkStyle(item, strokeWidth, color, dash) {
|
|
@@ -2746,26 +3210,26 @@ function linkStyle(item, strokeWidth, color, dash) {
|
|
|
2746
3210
|
dash,
|
|
2747
3211
|
lineCap: "round",
|
|
2748
3212
|
lineJoin: "round",
|
|
2749
|
-
opacity:
|
|
3213
|
+
opacity: chunkKXYSO6GC_cjs.finite(link.style?.opacity, 1),
|
|
2750
3214
|
shadow: resolveShadow(link.style?.shadow)
|
|
2751
3215
|
};
|
|
2752
3216
|
}
|
|
2753
3217
|
function createLinkRenderContext(item, index, measureText) {
|
|
2754
3218
|
const { link, from, to } = item;
|
|
2755
3219
|
const pathType = link.style?.pathType ?? "orthogonal";
|
|
2756
|
-
const { points, segments } =
|
|
2757
|
-
const strokeWidth =
|
|
3220
|
+
const { points, segments } = chunkKXYSO6GC_cjs.calculateLinkRoute(link, from, to, pathType);
|
|
3221
|
+
const strokeWidth = chunkKXYSO6GC_cjs.finite(link.style?.strokeWidth, 2);
|
|
2758
3222
|
const color = getLinkStrokeColor(link.style?.color) || "#64748b";
|
|
2759
3223
|
const label = labelLayout(link, measureText);
|
|
2760
3224
|
const contentDash = getDashArray(strokeWidth, link.style?.strokeStyle ?? "solid");
|
|
2761
|
-
const gap = label.visible && !contentDash ?
|
|
3225
|
+
const gap = label.visible && !contentDash ? chunkKXYSO6GC_cjs.labelGapDash(points, pathType, label.width, label.height) : null;
|
|
2762
3226
|
const dash = gap ? [gap.dashBefore, gap.gapLength, 1e6] : contentDash;
|
|
2763
3227
|
return {
|
|
2764
3228
|
link,
|
|
2765
3229
|
pathType,
|
|
2766
3230
|
points,
|
|
2767
3231
|
segments,
|
|
2768
|
-
midpoint:
|
|
3232
|
+
midpoint: chunkKXYSO6GC_cjs.getLineMidpoint(points, pathType, from, to),
|
|
2769
3233
|
strokeWidth,
|
|
2770
3234
|
bounds: linkBounds(points, strokeWidth + 14),
|
|
2771
3235
|
color,
|
|
@@ -2811,7 +3275,7 @@ function pathData2(points, pathType, segments, strokeWidth) {
|
|
|
2811
3275
|
return `M ${points[0]} ${points[1]} C ${points[2]} ${points[3]} ${points[4]} ${points[5]} ${points[6]} ${points[7]}`;
|
|
2812
3276
|
}
|
|
2813
3277
|
if (pathType === "orthogonal" && segments.length > 0) {
|
|
2814
|
-
return
|
|
3278
|
+
return chunkKXYSO6GC_cjs.roundedOrthogonalPathData(segments, Math.max(16, strokeWidth * 4));
|
|
2815
3279
|
}
|
|
2816
3280
|
return polylinePathData(points);
|
|
2817
3281
|
}
|
|
@@ -2915,7 +3379,7 @@ function buildLink(item, index, measureText) {
|
|
|
2915
3379
|
}
|
|
2916
3380
|
function buildLinks(links, measureText) {
|
|
2917
3381
|
return links.flatMap(
|
|
2918
|
-
(item, index) =>
|
|
3382
|
+
(item, index) => chunkKXYSO6GC_cjs.tag(
|
|
2919
3383
|
buildLink(item, index, measureText),
|
|
2920
3384
|
"link",
|
|
2921
3385
|
item.link.id,
|
|
@@ -2930,7 +3394,7 @@ function buildFreeformPath(path, index) {
|
|
|
2930
3394
|
if (path.isVisible === false || path.points.length < 2) {
|
|
2931
3395
|
return [];
|
|
2932
3396
|
}
|
|
2933
|
-
const strokeWidth =
|
|
3397
|
+
const strokeWidth = chunkKXYSO6GC_cjs.finite(path.strokeWidth, 2);
|
|
2934
3398
|
const extra = strokeWidth + 12;
|
|
2935
3399
|
const bounds = {
|
|
2936
3400
|
minX: Math.min(...path.points.map((point) => point.x)) - extra,
|
|
@@ -2938,7 +3402,7 @@ function buildFreeformPath(path, index) {
|
|
|
2938
3402
|
maxX: Math.max(...path.points.map((point) => point.x)) + extra,
|
|
2939
3403
|
maxY: Math.max(...path.points.map((point) => point.y)) + extra
|
|
2940
3404
|
};
|
|
2941
|
-
const tension =
|
|
3405
|
+
const tension = chunkKXYSO6GC_cjs.finite(path.tension, 0);
|
|
2942
3406
|
const closed = path.closed === true;
|
|
2943
3407
|
return [
|
|
2944
3408
|
{
|
|
@@ -2946,7 +3410,7 @@ function buildFreeformPath(path, index) {
|
|
|
2946
3410
|
id: `path-${path.id}`,
|
|
2947
3411
|
order: 3e4 + index,
|
|
2948
3412
|
bounds,
|
|
2949
|
-
d:
|
|
3413
|
+
d: chunkKXYSO6GC_cjs.freeformPathData({ points: path.points, tension, closed }),
|
|
2950
3414
|
markerStart: path.startMarker,
|
|
2951
3415
|
markerEnd: path.endMarker,
|
|
2952
3416
|
detail: {
|
|
@@ -2962,13 +3426,13 @@ function buildFreeformPath(path, index) {
|
|
|
2962
3426
|
dash: path.dash?.length ? path.dash : void 0,
|
|
2963
3427
|
lineCap: "round",
|
|
2964
3428
|
lineJoin: "round",
|
|
2965
|
-
opacity:
|
|
3429
|
+
opacity: chunkKXYSO6GC_cjs.finite(path.opacity, 1)
|
|
2966
3430
|
}
|
|
2967
3431
|
}
|
|
2968
3432
|
];
|
|
2969
3433
|
}
|
|
2970
3434
|
function buildFreeformPaths(paths) {
|
|
2971
|
-
return paths.flatMap((path, index) =>
|
|
3435
|
+
return paths.flatMap((path, index) => chunkKXYSO6GC_cjs.tag(buildFreeformPath(path, index), "path", path.id, "path", "Path"));
|
|
2972
3436
|
}
|
|
2973
3437
|
|
|
2974
3438
|
// src/renderScene/artifacts/shape/geometry/base.ts
|
|
@@ -2984,7 +3448,7 @@ function shapeNodeBase(context) {
|
|
|
2984
3448
|
|
|
2985
3449
|
// src/renderScene/artifacts/shape/geometry/simple.ts
|
|
2986
3450
|
function renderPath(context) {
|
|
2987
|
-
const path =
|
|
3451
|
+
const path = chunkKXYSO6GC_cjs.localShapePath(context.shape.shapeType, context.x, context.y, context.width, context.height);
|
|
2988
3452
|
if (!path) {
|
|
2989
3453
|
return [];
|
|
2990
3454
|
}
|
|
@@ -3000,7 +3464,7 @@ function renderBoundedPath(context) {
|
|
|
3000
3464
|
}));
|
|
3001
3465
|
}
|
|
3002
3466
|
function renderRectangle(context) {
|
|
3003
|
-
const rx = context.shape.shapeType === "pill" ?
|
|
3467
|
+
const rx = context.shape.shapeType === "pill" ? chunkKXYSO6GC_cjs.pillCornerRadius(context.width, context.height) : context.shape.shapeType === "rounded_rectangle" ? chunkKXYSO6GC_cjs.finite(context.shape.cornerRadius, 8) : 0;
|
|
3004
3468
|
return [
|
|
3005
3469
|
{
|
|
3006
3470
|
...shapeNodeBase(context),
|
|
@@ -3029,7 +3493,7 @@ function renderSymbol(context) {
|
|
|
3029
3493
|
if (!context.shape.symbol || context.shape.symbol.points.length < 2) {
|
|
3030
3494
|
return renderRectangle(context);
|
|
3031
3495
|
}
|
|
3032
|
-
const tension =
|
|
3496
|
+
const tension = chunkKXYSO6GC_cjs.finite(context.shape.symbol.tension, 0);
|
|
3033
3497
|
const points = context.shape.symbol.points.map(([x, y]) => ({
|
|
3034
3498
|
x: context.x + x * context.width,
|
|
3035
3499
|
y: context.y + y * context.height
|
|
@@ -3038,7 +3502,7 @@ function renderSymbol(context) {
|
|
|
3038
3502
|
{
|
|
3039
3503
|
...shapeNodeBase(context),
|
|
3040
3504
|
type: "path",
|
|
3041
|
-
d:
|
|
3505
|
+
d: chunkKXYSO6GC_cjs.freeformPathData({ points, tension, closed: true }),
|
|
3042
3506
|
rotationCenter: context.rotationCenter,
|
|
3043
3507
|
detail: {
|
|
3044
3508
|
of: "symbolGeometry",
|
|
@@ -3075,6 +3539,46 @@ function renderShapeGeometry(context) {
|
|
|
3075
3539
|
return renderer(context);
|
|
3076
3540
|
}
|
|
3077
3541
|
|
|
3542
|
+
// src/renderScene/artifacts/shape/shaderSurface.ts
|
|
3543
|
+
var RECT_PROGRAMS = /* @__PURE__ */ new Set(["reactivePanel", "ledMatrix", "lightBand", "silkFolds"]);
|
|
3544
|
+
function shaderMask(context) {
|
|
3545
|
+
if (context.shape.shapeType === "circle" || context.shape.shapeType === "oval") {
|
|
3546
|
+
return "ellipse";
|
|
3547
|
+
}
|
|
3548
|
+
const rectangular = context.shape.shapeType === "rectangle" || context.shape.shapeType === "rounded_rectangle";
|
|
3549
|
+
if (rectangular && context.shape.shader && RECT_PROGRAMS.has(context.shape.shader.program)) {
|
|
3550
|
+
return "rect";
|
|
3551
|
+
}
|
|
3552
|
+
return void 0;
|
|
3553
|
+
}
|
|
3554
|
+
function renderShapeShaderSurface(context) {
|
|
3555
|
+
if (!context.shape.shader) {
|
|
3556
|
+
return void 0;
|
|
3557
|
+
}
|
|
3558
|
+
const mask = shaderMask(context);
|
|
3559
|
+
if (!mask) {
|
|
3560
|
+
return void 0;
|
|
3561
|
+
}
|
|
3562
|
+
const padding = mask === "rect" ? Math.max(0, context.shape.shader.surfacePadding ?? 0) : 0;
|
|
3563
|
+
const surfaceBounds = {
|
|
3564
|
+
x: context.x - padding,
|
|
3565
|
+
y: context.y - padding,
|
|
3566
|
+
width: context.width + padding * 2,
|
|
3567
|
+
height: context.height + padding * 2
|
|
3568
|
+
};
|
|
3569
|
+
return {
|
|
3570
|
+
id: `${context.id}-shader`,
|
|
3571
|
+
type: "shader-surface",
|
|
3572
|
+
order: context.order,
|
|
3573
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds(surfaceBounds, context.rotation, 0),
|
|
3574
|
+
...surfaceBounds,
|
|
3575
|
+
rotation: context.rotation,
|
|
3576
|
+
shader: context.shape.shader,
|
|
3577
|
+
mask,
|
|
3578
|
+
fillColor: context.style.fill?.kind === "solid" ? context.style.fill.color : void 0
|
|
3579
|
+
};
|
|
3580
|
+
}
|
|
3581
|
+
|
|
3078
3582
|
// src/renderScene/artifacts/shape/style.ts
|
|
3079
3583
|
var REMOVED_SHAPE_HINTS = {
|
|
3080
3584
|
container_rectangle: " (use 'rectangle' with strokeStyle: dashed)"
|
|
@@ -3136,22 +3640,22 @@ function shapeDash(shape, strokeWidth) {
|
|
|
3136
3640
|
}
|
|
3137
3641
|
function shapeStyle(shape, diagnostics) {
|
|
3138
3642
|
const defaults = shapeDefaults(shape, diagnostics);
|
|
3139
|
-
const strokeWidth =
|
|
3643
|
+
const strokeWidth = chunkKXYSO6GC_cjs.finite(shape.strokeWidth, defaults.strokeWidth);
|
|
3140
3644
|
const shadow = shape.shadowStyle ?? (shape.hasShadow ? { enabled: true, color: "#000000", opacity: 0.25, blur: 10, angle: 45, distance: 5 } : void 0);
|
|
3141
|
-
const angle =
|
|
3645
|
+
const angle = chunkKXYSO6GC_cjs.finite(shadow?.angle, 45) * Math.PI / 180;
|
|
3142
3646
|
return {
|
|
3143
|
-
fill:
|
|
3144
|
-
stroke:
|
|
3647
|
+
fill: chunkKXYSO6GC_cjs.paint(shape.fillColor, diagnostics, shape.id),
|
|
3648
|
+
stroke: chunkKXYSO6GC_cjs.paint(shape.strokeColor, diagnostics, shape.id),
|
|
3145
3649
|
strokeWidth,
|
|
3146
3650
|
dash: shapeDash(shape, strokeWidth),
|
|
3147
3651
|
lineCap: shape.strokeStyle === "dotted" ? "round" : "butt",
|
|
3148
|
-
opacity:
|
|
3652
|
+
opacity: chunkKXYSO6GC_cjs.finite(shape.opacity, defaults.opacity),
|
|
3149
3653
|
shadow: shadow?.enabled ? {
|
|
3150
3654
|
color: shadow.color ?? "#000000",
|
|
3151
|
-
opacity:
|
|
3152
|
-
blur:
|
|
3153
|
-
dx: Math.cos(angle) *
|
|
3154
|
-
dy: Math.sin(angle) *
|
|
3655
|
+
opacity: chunkKXYSO6GC_cjs.finite(shadow.opacity, 0.25),
|
|
3656
|
+
blur: chunkKXYSO6GC_cjs.finite(shadow.blur, 10),
|
|
3657
|
+
dx: Math.cos(angle) * chunkKXYSO6GC_cjs.finite(shadow.distance, 5),
|
|
3658
|
+
dy: Math.sin(angle) * chunkKXYSO6GC_cjs.finite(shadow.distance, 5)
|
|
3155
3659
|
} : void 0
|
|
3156
3660
|
};
|
|
3157
3661
|
}
|
|
@@ -3227,11 +3731,11 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3227
3731
|
if (!shape.text) {
|
|
3228
3732
|
return null;
|
|
3229
3733
|
}
|
|
3230
|
-
const fontSize =
|
|
3734
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(shape.fontSize, shapeDefaults(shape, []).fontSize);
|
|
3231
3735
|
const padding = shape.isText ? 0 : Math.max(8, strokeWidth * 2);
|
|
3232
|
-
const area = shape.shapeType === "person" ?
|
|
3736
|
+
const area = shape.shapeType === "person" ? chunkKXYSO6GC_cjs.personLabelArea(x, y, width, height) : { x, y, width, height };
|
|
3233
3737
|
const textWidth = Math.max(0, area.width - padding * 2);
|
|
3234
|
-
const fontFamily2 = shape.fontFamily ||
|
|
3738
|
+
const fontFamily2 = shape.fontFamily || chunkKXYSO6GC_cjs.DEFAULT_FONT;
|
|
3235
3739
|
const metrics = measureText?.(fontFamily2, fontSize);
|
|
3236
3740
|
const textNode = {
|
|
3237
3741
|
type: "text",
|
|
@@ -3242,7 +3746,7 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3242
3746
|
y: area.y + padding,
|
|
3243
3747
|
width: textWidth,
|
|
3244
3748
|
height: Math.max(0, area.height - padding * 2),
|
|
3245
|
-
lines:
|
|
3749
|
+
lines: chunkKXYSO6GC_cjs.wrapText(shape.text, textWidth, fontSize, metrics),
|
|
3246
3750
|
fontFamily: fontFamily2,
|
|
3247
3751
|
fontSize,
|
|
3248
3752
|
fontWeight: shape.fontWeight ?? "normal",
|
|
@@ -3250,12 +3754,12 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3250
3754
|
color: shape.textColor || "#111827",
|
|
3251
3755
|
align: shape.textAlign ?? "center",
|
|
3252
3756
|
verticalAlign: shape.textVerticalAlign ?? "middle",
|
|
3253
|
-
lineHeight:
|
|
3757
|
+
lineHeight: chunkKXYSO6GC_cjs.finite(shape.lineHeight, 1.3),
|
|
3254
3758
|
rotation,
|
|
3255
3759
|
rotationCenter
|
|
3256
3760
|
};
|
|
3257
3761
|
if (hasBoldMarkup(shape.text)) {
|
|
3258
|
-
const { measure, spaceWidth } = metrics ??
|
|
3762
|
+
const { measure, spaceWidth } = metrics ?? chunkKXYSO6GC_cjs.heuristicRichMeasure(fontSize);
|
|
3259
3763
|
textNode.richLines = wrapRichText(shape.text, textWidth, measure, spaceWidth);
|
|
3260
3764
|
}
|
|
3261
3765
|
return textNode;
|
|
@@ -3294,19 +3798,19 @@ function renderDoubleStroke(context, strokeWidth) {
|
|
|
3294
3798
|
return nodes;
|
|
3295
3799
|
}
|
|
3296
3800
|
function createRenderContext(shape, index, diagnostics) {
|
|
3297
|
-
const x =
|
|
3298
|
-
const y =
|
|
3299
|
-
const width = Math.max(0,
|
|
3300
|
-
const height = Math.max(0,
|
|
3301
|
-
const rotation =
|
|
3302
|
-
const strokeWidth =
|
|
3801
|
+
const x = chunkKXYSO6GC_cjs.finite(shape.x, 0);
|
|
3802
|
+
const y = chunkKXYSO6GC_cjs.finite(shape.y, 0);
|
|
3803
|
+
const width = Math.max(0, chunkKXYSO6GC_cjs.finite(shape.width, 100));
|
|
3804
|
+
const height = Math.max(0, chunkKXYSO6GC_cjs.finite(shape.height, 100));
|
|
3805
|
+
const rotation = chunkKXYSO6GC_cjs.finite(shape.rotation, 0);
|
|
3806
|
+
const strokeWidth = chunkKXYSO6GC_cjs.finite(shape.strokeWidth, 2);
|
|
3303
3807
|
return {
|
|
3304
3808
|
strokeWidth,
|
|
3305
3809
|
context: {
|
|
3306
3810
|
shape,
|
|
3307
3811
|
id: `shape-${shape.id}`,
|
|
3308
3812
|
order: 1e4 + index,
|
|
3309
|
-
bounds:
|
|
3813
|
+
bounds: chunkKXYSO6GC_cjs.rotatedBounds({ x, y, width, height }, rotation, strokeWidth + (shape.hasShadow ? 20 : 2)),
|
|
3310
3814
|
rotation,
|
|
3311
3815
|
rotationCenter: { x: x + width / 2, y: y + height / 2 },
|
|
3312
3816
|
style: shapeStyle(shape, diagnostics),
|
|
@@ -3317,32 +3821,13 @@ function createRenderContext(shape, index, diagnostics) {
|
|
|
3317
3821
|
}
|
|
3318
3822
|
};
|
|
3319
3823
|
}
|
|
3320
|
-
function renderShaderSurface(context) {
|
|
3321
|
-
if (!context.shape.shader || context.shape.shapeType !== "circle" && context.shape.shapeType !== "oval") {
|
|
3322
|
-
return void 0;
|
|
3323
|
-
}
|
|
3324
|
-
return {
|
|
3325
|
-
id: `${context.id}-shader`,
|
|
3326
|
-
type: "shader-surface",
|
|
3327
|
-
order: context.order,
|
|
3328
|
-
bounds: context.bounds,
|
|
3329
|
-
x: context.x,
|
|
3330
|
-
y: context.y,
|
|
3331
|
-
width: context.width,
|
|
3332
|
-
height: context.height,
|
|
3333
|
-
rotation: context.rotation,
|
|
3334
|
-
shader: context.shape.shader,
|
|
3335
|
-
mask: "ellipse",
|
|
3336
|
-
fillColor: context.style.fill?.kind === "solid" ? context.style.fill.color : void 0
|
|
3337
|
-
};
|
|
3338
|
-
}
|
|
3339
3824
|
function buildShape(shape, index, diagnostics, measureText) {
|
|
3340
3825
|
if (shape.isVisible === false) {
|
|
3341
3826
|
return [];
|
|
3342
3827
|
}
|
|
3343
3828
|
const { context, strokeWidth } = createRenderContext(shape, index, diagnostics);
|
|
3344
3829
|
const nodes = shape.strokeStyle === "double" ? renderDoubleStroke(context, strokeWidth || 1) : renderShapeGeometry(context);
|
|
3345
|
-
const shader =
|
|
3830
|
+
const shader = renderShapeShaderSurface(context);
|
|
3346
3831
|
if (shader) {
|
|
3347
3832
|
for (const node of nodes) {
|
|
3348
3833
|
if (node.type === "ellipse" || node.type === "path" || node.type === "rect") {
|
|
@@ -3359,7 +3844,7 @@ function buildShape(shape, index, diagnostics, measureText) {
|
|
|
3359
3844
|
}
|
|
3360
3845
|
function buildShapes(shapes, diagnostics, measureText) {
|
|
3361
3846
|
return shapes.flatMap(
|
|
3362
|
-
(shape, index) =>
|
|
3847
|
+
(shape, index) => chunkKXYSO6GC_cjs.tag(
|
|
3363
3848
|
buildShape(shape, index, diagnostics, measureText),
|
|
3364
3849
|
"shape",
|
|
3365
3850
|
shape.id,
|
|
@@ -3376,7 +3861,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
3376
3861
|
return null;
|
|
3377
3862
|
}
|
|
3378
3863
|
return {
|
|
3379
|
-
...
|
|
3864
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
3380
3865
|
role: "axis",
|
|
3381
3866
|
id: `chart-x-label-${chart.id}`,
|
|
3382
3867
|
order,
|
|
@@ -3386,7 +3871,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
3386
3871
|
chart,
|
|
3387
3872
|
align: "center"
|
|
3388
3873
|
}),
|
|
3389
|
-
prop:
|
|
3874
|
+
prop: chunkKXYSO6GC_cjs.axisLabelProp("x")
|
|
3390
3875
|
};
|
|
3391
3876
|
}
|
|
3392
3877
|
function buildYAxisLabel(chart, layout, order) {
|
|
@@ -3394,7 +3879,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
3394
3879
|
return null;
|
|
3395
3880
|
}
|
|
3396
3881
|
return {
|
|
3397
|
-
...
|
|
3882
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
3398
3883
|
role: "axis",
|
|
3399
3884
|
id: `chart-y-label-${chart.id}`,
|
|
3400
3885
|
order,
|
|
@@ -3410,7 +3895,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
3410
3895
|
align: "center",
|
|
3411
3896
|
rotation: -90
|
|
3412
3897
|
}),
|
|
3413
|
-
prop:
|
|
3898
|
+
prop: chunkKXYSO6GC_cjs.axisLabelProp("y")
|
|
3414
3899
|
};
|
|
3415
3900
|
}
|
|
3416
3901
|
function buildAxisLabels(chart, layout, order) {
|
|
@@ -3433,7 +3918,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
3433
3918
|
return chart.series.map((series, index) => {
|
|
3434
3919
|
const centerY = layout.plot.y + (index + 0.5) * slotWidth;
|
|
3435
3920
|
return {
|
|
3436
|
-
...
|
|
3921
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
3437
3922
|
role: "axis",
|
|
3438
3923
|
id: `chart-y-tick-${chart.id}-${index}`,
|
|
3439
3924
|
order: order + index,
|
|
@@ -3443,7 +3928,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
3443
3928
|
chart,
|
|
3444
3929
|
align: "right"
|
|
3445
3930
|
}),
|
|
3446
|
-
prop:
|
|
3931
|
+
prop: chunkKXYSO6GC_cjs.seriesLabelProp(series.id)
|
|
3447
3932
|
};
|
|
3448
3933
|
});
|
|
3449
3934
|
}
|
|
@@ -3469,7 +3954,7 @@ function isStackedLegendPosition(position) {
|
|
|
3469
3954
|
return position === "bottomLeft" || position === "bottomRight";
|
|
3470
3955
|
}
|
|
3471
3956
|
function legendItemWidths(chart) {
|
|
3472
|
-
return legendSeries(chart).map((item) => Math.max(42, item.label.length *
|
|
3957
|
+
return legendSeries(chart).map((item) => Math.max(42, item.label.length * chunkKXYSO6GC_cjs.finite(chart.fontSize, 12) * 0.58 + 22));
|
|
3473
3958
|
}
|
|
3474
3959
|
function stackedLegendColumnWidth(chart) {
|
|
3475
3960
|
const widths = legendItemWidths(chart);
|
|
@@ -3522,9 +4007,9 @@ function renderLegendItem(render2, item) {
|
|
|
3522
4007
|
}
|
|
3523
4008
|
function createLegendSwatch(render2, item) {
|
|
3524
4009
|
const { chart, bounds, diagnostics } = render2;
|
|
3525
|
-
const fallback =
|
|
4010
|
+
const fallback = chunkKXYSO6GC_cjs.CHART_COLORS[item.seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
3526
4011
|
const solidOnly = chart.chartType === "line";
|
|
3527
|
-
const color = solidOnly ?
|
|
4012
|
+
const color = solidOnly ? chunkKXYSO6GC_cjs.representativeColor(item.series.color, fallback) : item.series.color ?? fallback;
|
|
3528
4013
|
return {
|
|
3529
4014
|
type: "rect",
|
|
3530
4015
|
id: `chart-legend-swatch-${chart.id}-${item.series.id}`,
|
|
@@ -3535,16 +4020,16 @@ function createLegendSwatch(render2, item) {
|
|
|
3535
4020
|
width: 10,
|
|
3536
4021
|
height: 10,
|
|
3537
4022
|
rx: 3,
|
|
3538
|
-
prop:
|
|
4023
|
+
prop: chunkKXYSO6GC_cjs.seriesColorProp(item.series.id),
|
|
3539
4024
|
propKind: "color",
|
|
3540
4025
|
propSolidOnly: solidOnly,
|
|
3541
|
-
style: { fill:
|
|
4026
|
+
style: { fill: chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id) }
|
|
3542
4027
|
};
|
|
3543
4028
|
}
|
|
3544
4029
|
function createLegendLabel(render2, item) {
|
|
3545
4030
|
const { chart, bounds } = render2;
|
|
3546
4031
|
return {
|
|
3547
|
-
...
|
|
4032
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
3548
4033
|
role: "legend",
|
|
3549
4034
|
id: `chart-legend-${chart.id}-${item.series.id}`,
|
|
3550
4035
|
order: item.order + 1,
|
|
@@ -3553,7 +4038,7 @@ function createLegendLabel(render2, item) {
|
|
|
3553
4038
|
text: item.series.label,
|
|
3554
4039
|
chart
|
|
3555
4040
|
}),
|
|
3556
|
-
prop:
|
|
4041
|
+
prop: chunkKXYSO6GC_cjs.seriesLabelProp(item.series.id)
|
|
3557
4042
|
};
|
|
3558
4043
|
}
|
|
3559
4044
|
|
|
@@ -3572,13 +4057,13 @@ function hasCartesianDecorations(chart) {
|
|
|
3572
4057
|
return !CHARTS_WITHOUT_CARTESIAN_DECORATIONS.has(chart.chartType);
|
|
3573
4058
|
}
|
|
3574
4059
|
function tickOffset(chart) {
|
|
3575
|
-
return hasCartesianDecorations(chart) ? Math.max(0,
|
|
4060
|
+
return hasCartesianDecorations(chart) ? Math.max(0, chunkKXYSO6GC_cjs.finite(chart.tickLength, 0)) : 0;
|
|
3576
4061
|
}
|
|
3577
4062
|
function isHorizontalBoxplot(chart) {
|
|
3578
4063
|
return chart.chartType === "boxplot" && chart.config?.orientation === "horizontal";
|
|
3579
4064
|
}
|
|
3580
4065
|
function boxplotCategoryLabelWidth(chart) {
|
|
3581
|
-
const fontSize =
|
|
4066
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(chart.fontSize, 12);
|
|
3582
4067
|
const longest = Math.max(0, ...chart.series.map((series) => (series.label || series.id).length));
|
|
3583
4068
|
return longest * fontSize * 0.58 + 16;
|
|
3584
4069
|
}
|
|
@@ -3590,7 +4075,7 @@ function treemapSideLegendSide(chart, showLegend) {
|
|
|
3590
4075
|
return chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : null;
|
|
3591
4076
|
}
|
|
3592
4077
|
function barCategoryLabelWidth(chart) {
|
|
3593
|
-
const fontSize =
|
|
4078
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(chart.axisFontSize ?? chart.fontSize, 12);
|
|
3594
4079
|
const categories = chart.config?.categories ?? [];
|
|
3595
4080
|
return Math.max(0, ...categories.map((category) => category.length)) * fontSize * 0.58 + 16;
|
|
3596
4081
|
}
|
|
@@ -3598,7 +4083,7 @@ function leftLabelWidth(chart) {
|
|
|
3598
4083
|
if (isHorizontalBoxplot(chart)) {
|
|
3599
4084
|
return boxplotCategoryLabelWidth(chart);
|
|
3600
4085
|
}
|
|
3601
|
-
if (
|
|
4086
|
+
if (chunkKXYSO6GC_cjs.isHorizontalBar(chart)) {
|
|
3602
4087
|
return chart.categoryAlign === "left" || chart.categoryAlign === "inside" ? 20 : barCategoryLabelWidth(chart);
|
|
3603
4088
|
}
|
|
3604
4089
|
if (chart.showValueAxis === false) {
|
|
@@ -3619,17 +4104,17 @@ function decorations(chart) {
|
|
|
3619
4104
|
const padLeft = tick + (showLabels ? leftLabelWidth(chart) : 12) + (legendPosition === "bottomLeft" ? sideColumnWidth : 0) + (treemapSide === "left" ? TREEMAP_SIDE_LEGEND_WIDTH : 0);
|
|
3620
4105
|
const padRight = 24 + (legendPosition === "bottomRight" ? sideColumnWidth : 0) + (treemapSide === "right" ? TREEMAP_SIDE_LEGEND_WIDTH : 0);
|
|
3621
4106
|
const valueRow = chart.chartType === "bar" && chart.config?.showBarLabels === true && chart.config.barLabelPosition === "axis";
|
|
3622
|
-
const horizontalValueAxis =
|
|
3623
|
-
const basePadBottom = showLabels ?
|
|
4107
|
+
const horizontalValueAxis = chunkKXYSO6GC_cjs.isHorizontalBar(chart) && chart.showValueAxis !== false;
|
|
4108
|
+
const basePadBottom = showLabels ? chunkKXYSO6GC_cjs.isHorizontalBar(chart) ? horizontalValueAxis ? 34 : 12 : (chart.axisX.label ? 52 : 34) + (valueRow ? 18 : 0) : 12;
|
|
3624
4109
|
const hasColorBar = chart.chartType === "field" && showLegend && Boolean(chart.config?.scale?.stops.length);
|
|
3625
4110
|
const legendAtBottomRow = hasLegendItems && !legendAtTop && !legendStacked;
|
|
3626
4111
|
const padBottom = tick + basePadBottom + (hasColorBar ? 44 : 0) + (legendAtBottomRow ? 16 + LEGEND_ROW_HEIGHT : 0);
|
|
3627
|
-
const titleHeight = chart.title ? Math.max(44, 20 +
|
|
4112
|
+
const titleHeight = chart.title ? Math.max(44, 20 + chunkKXYSO6GC_cjs.finite(chart.titleSize, 14) * 1.6) : 0;
|
|
3628
4113
|
const padTop = titleHeight || (legendAtTop && hasLegendItems ? 44 : 24);
|
|
3629
4114
|
return {
|
|
3630
|
-
bounds:
|
|
4115
|
+
bounds: chunkKXYSO6GC_cjs.boxBounds(
|
|
3631
4116
|
{ x: chart.x, y: chart.y, width: chart.width, height: chart.height },
|
|
3632
|
-
|
|
4117
|
+
chunkKXYSO6GC_cjs.finite(chart.strokeWidth, 1) + 2
|
|
3633
4118
|
),
|
|
3634
4119
|
plot: {
|
|
3635
4120
|
x: chart.x + padLeft,
|
|
@@ -3651,19 +4136,19 @@ function categoryLabels(chart, count) {
|
|
|
3651
4136
|
return Array.from({ length: count }, (_value, index) => String(index + 1));
|
|
3652
4137
|
}
|
|
3653
4138
|
function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
3654
|
-
const count =
|
|
4139
|
+
const count = chunkKXYSO6GC_cjs.barCategoryCount(chart);
|
|
3655
4140
|
const slotWidth = layout.plot.width / count;
|
|
3656
4141
|
const labels = categoryLabels(chart, count);
|
|
3657
4142
|
const editable = Boolean(chart.config?.categories?.length);
|
|
3658
4143
|
const left = chart.categoryAlign === "left";
|
|
3659
4144
|
const groupGap = left ? Math.min(
|
|
3660
|
-
Math.max(0,
|
|
4145
|
+
Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.barGroupGap, 8)),
|
|
3661
4146
|
Math.max(0, slotWidth - 1)
|
|
3662
4147
|
) : 0;
|
|
3663
4148
|
return Array.from({ length: count }, (_value, index) => {
|
|
3664
4149
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
3665
4150
|
return {
|
|
3666
|
-
...
|
|
4151
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
3667
4152
|
role: "axis",
|
|
3668
4153
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
3669
4154
|
order: order + index,
|
|
@@ -3678,7 +4163,7 @@ function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
|
3678
4163
|
chart,
|
|
3679
4164
|
align: left ? "left" : "center"
|
|
3680
4165
|
}),
|
|
3681
|
-
prop: editable ?
|
|
4166
|
+
prop: editable ? chunkKXYSO6GC_cjs.categoryProp(index) : void 0
|
|
3682
4167
|
};
|
|
3683
4168
|
});
|
|
3684
4169
|
}
|
|
@@ -3688,7 +4173,7 @@ function buildSeriesXAxisTicks(chart, layout, order) {
|
|
|
3688
4173
|
return chart.series.map((series, index) => {
|
|
3689
4174
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
3690
4175
|
return {
|
|
3691
|
-
...
|
|
4176
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
3692
4177
|
role: "axis",
|
|
3693
4178
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
3694
4179
|
order: order + index,
|
|
@@ -3703,16 +4188,16 @@ function buildSeriesXAxisTicks(chart, layout, order) {
|
|
|
3703
4188
|
chart,
|
|
3704
4189
|
align: "center"
|
|
3705
4190
|
}),
|
|
3706
|
-
prop:
|
|
4191
|
+
prop: chunkKXYSO6GC_cjs.seriesLabelProp(series.id)
|
|
3707
4192
|
};
|
|
3708
4193
|
});
|
|
3709
4194
|
}
|
|
3710
4195
|
|
|
3711
4196
|
// src/renderScene/charts/decorations/numericXAxis.ts
|
|
3712
4197
|
function buildNumericXAxisTicks(chart, layout, order) {
|
|
3713
|
-
return
|
|
3714
|
-
const x = layout.plot.x +
|
|
3715
|
-
return
|
|
4198
|
+
return chunkKXYSO6GC_cjs.chartTicks(chart.axisX).map((tick, index) => {
|
|
4199
|
+
const x = layout.plot.x + chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisX, layout.plot.width);
|
|
4200
|
+
return chunkKXYSO6GC_cjs.chartText({
|
|
3716
4201
|
role: "axis",
|
|
3717
4202
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
3718
4203
|
order: order + index,
|
|
@@ -3727,9 +4212,9 @@ function buildNumericXAxisTicks(chart, layout, order) {
|
|
|
3727
4212
|
|
|
3728
4213
|
// src/renderScene/charts/decorations/numericYAxis.ts
|
|
3729
4214
|
function buildNumericYAxisTicks(chart, layout, order) {
|
|
3730
|
-
return
|
|
3731
|
-
const y = layout.plot.y + layout.plot.height -
|
|
3732
|
-
return
|
|
4215
|
+
return chunkKXYSO6GC_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
4216
|
+
const y = layout.plot.y + layout.plot.height - chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisY, layout.plot.height);
|
|
4217
|
+
return chunkKXYSO6GC_cjs.chartText({
|
|
3733
4218
|
role: "axis",
|
|
3734
4219
|
id: `chart-y-tick-${chart.id}-${tick}`,
|
|
3735
4220
|
order: order + index,
|
|
@@ -3764,10 +4249,10 @@ function buildYAxisTicks(chart, layout, order) {
|
|
|
3764
4249
|
function xTickPositions(chart, layout) {
|
|
3765
4250
|
const { plot } = layout;
|
|
3766
4251
|
if (chart.chartType === "bar") {
|
|
3767
|
-
const count =
|
|
4252
|
+
const count = chunkKXYSO6GC_cjs.barCategoryCount(chart);
|
|
3768
4253
|
return Array.from({ length: count }, (_value, index) => plot.x + (index + 0.5) * plot.width / count);
|
|
3769
4254
|
}
|
|
3770
|
-
return
|
|
4255
|
+
return chunkKXYSO6GC_cjs.chartTicks(chart.axisX).map((tick) => plot.x + chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisX, plot.width));
|
|
3771
4256
|
}
|
|
3772
4257
|
function axisLineDash(chart, width) {
|
|
3773
4258
|
if (chart.axisLineStyle === "dashed") {
|
|
@@ -3776,8 +4261,8 @@ function axisLineDash(chart, width) {
|
|
|
3776
4261
|
return chart.axisLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : {};
|
|
3777
4262
|
}
|
|
3778
4263
|
function buildAxisLines(chart, layout, order) {
|
|
3779
|
-
const lineWidth =
|
|
3780
|
-
const tickLength =
|
|
4264
|
+
const lineWidth = chunkKXYSO6GC_cjs.finite(chart.axisLineWidth, 0);
|
|
4265
|
+
const tickLength = chunkKXYSO6GC_cjs.finite(chart.tickLength, 0);
|
|
3781
4266
|
if (lineWidth <= 0 && tickLength <= 0) {
|
|
3782
4267
|
return [];
|
|
3783
4268
|
}
|
|
@@ -3798,20 +4283,20 @@ function buildAxisLines(chart, layout, order) {
|
|
|
3798
4283
|
}
|
|
3799
4284
|
add("line-x", `M ${plot.x} ${bottom} L ${plot.x + plot.width} ${bottom}`);
|
|
3800
4285
|
}
|
|
3801
|
-
if (tickLength > 0 &&
|
|
3802
|
-
|
|
3803
|
-
const x = plot.x +
|
|
4286
|
+
if (tickLength > 0 && chunkKXYSO6GC_cjs.isHorizontalBar(chart)) {
|
|
4287
|
+
chunkKXYSO6GC_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4288
|
+
const x = plot.x + chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
3804
4289
|
add(`tick-v-${tick}`, `M ${x} ${bottom} L ${x} ${bottom + tickLength}`);
|
|
3805
4290
|
});
|
|
3806
|
-
const rows =
|
|
4291
|
+
const rows = chunkKXYSO6GC_cjs.horizontalRows(chart, plot);
|
|
3807
4292
|
for (let index = 0; index < rows.count; index++) {
|
|
3808
|
-
const y =
|
|
4293
|
+
const y = chunkKXYSO6GC_cjs.rowTop(rows, plot, index) + rows.labelRow + rows.barsHeight / 2;
|
|
3809
4294
|
add(`tick-c-${index}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
3810
4295
|
}
|
|
3811
4296
|
}
|
|
3812
|
-
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !
|
|
3813
|
-
|
|
3814
|
-
const y = bottom -
|
|
4297
|
+
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !chunkKXYSO6GC_cjs.isHorizontalBar(chart)) {
|
|
4298
|
+
chunkKXYSO6GC_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4299
|
+
const y = bottom - chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
3815
4300
|
add(`tick-y-${tick}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
3816
4301
|
});
|
|
3817
4302
|
xTickPositions(chart, layout).forEach((x, index) => {
|
|
@@ -3826,14 +4311,14 @@ function categoryNames(chart, count) {
|
|
|
3826
4311
|
}
|
|
3827
4312
|
function buildHorizontalBarAxes(chart, layout, order) {
|
|
3828
4313
|
const { plot, bounds } = layout;
|
|
3829
|
-
const rows =
|
|
4314
|
+
const rows = chunkKXYSO6GC_cjs.horizontalRows(chart, plot);
|
|
3830
4315
|
const above = chart.categoryAlign === "left";
|
|
3831
4316
|
const inside = chart.categoryAlign === "inside";
|
|
3832
4317
|
const editable = Boolean(chart.config?.categories?.length);
|
|
3833
4318
|
const nodes = categoryNames(chart, rows.count).map((name, index) => {
|
|
3834
|
-
const top =
|
|
4319
|
+
const top = chunkKXYSO6GC_cjs.rowTop(rows, plot, index);
|
|
3835
4320
|
return {
|
|
3836
|
-
...
|
|
4321
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
3837
4322
|
role: "axis",
|
|
3838
4323
|
id: `chart-y-category-${chart.id}-${index}`,
|
|
3839
4324
|
order: order + index,
|
|
@@ -3843,19 +4328,19 @@ function buildHorizontalBarAxes(chart, layout, order) {
|
|
|
3843
4328
|
chart,
|
|
3844
4329
|
align: above || inside ? "left" : "right"
|
|
3845
4330
|
}),
|
|
3846
|
-
prop: editable ?
|
|
4331
|
+
prop: editable ? chunkKXYSO6GC_cjs.categoryProp(index) : void 0
|
|
3847
4332
|
};
|
|
3848
4333
|
});
|
|
3849
4334
|
if (chart.showValueAxis !== false) {
|
|
3850
|
-
|
|
3851
|
-
const x = plot.x +
|
|
4335
|
+
chunkKXYSO6GC_cjs.chartTicks(chart.axisY).forEach((tick, index) => {
|
|
4336
|
+
const x = plot.x + chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
3852
4337
|
nodes.push(
|
|
3853
|
-
|
|
4338
|
+
chunkKXYSO6GC_cjs.chartText({
|
|
3854
4339
|
role: "axis",
|
|
3855
4340
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
3856
4341
|
order: order + rows.count + index,
|
|
3857
4342
|
bounds,
|
|
3858
|
-
frame: { x: x - 20, y: plot.y + plot.height + 4 +
|
|
4343
|
+
frame: { x: x - 20, y: plot.y + plot.height + 4 + chunkKXYSO6GC_cjs.finite(chart.tickLength, 0), width: 40, height: 18 },
|
|
3859
4344
|
text: String(tick),
|
|
3860
4345
|
chart,
|
|
3861
4346
|
align: "center"
|
|
@@ -3874,7 +4359,7 @@ function buildChartAxes(chart, layout, order) {
|
|
|
3874
4359
|
return lines;
|
|
3875
4360
|
}
|
|
3876
4361
|
order += lines.length;
|
|
3877
|
-
if (
|
|
4362
|
+
if (chunkKXYSO6GC_cjs.isHorizontalBar(chart)) {
|
|
3878
4363
|
return [...lines, ...buildHorizontalBarAxes(chart, layout, order)];
|
|
3879
4364
|
}
|
|
3880
4365
|
const xTicks = buildXAxisTicks(chart, layout, order);
|
|
@@ -3952,7 +4437,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
3952
4437
|
const centerX = plot.x + plot.width / 2;
|
|
3953
4438
|
const centerY = plot.y + plot.height / 2;
|
|
3954
4439
|
const radius = Math.max(0, Math.min(plot.width, plot.height) / 2);
|
|
3955
|
-
const width =
|
|
4440
|
+
const width = chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1);
|
|
3956
4441
|
if (chart.gridLineStyle === "dotted") {
|
|
3957
4442
|
return buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width);
|
|
3958
4443
|
}
|
|
@@ -3963,7 +4448,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
3963
4448
|
...gridLineDashStyle(chart, width)
|
|
3964
4449
|
};
|
|
3965
4450
|
const nodes = [];
|
|
3966
|
-
|
|
4451
|
+
chunkKXYSO6GC_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min).forEach((tick) => {
|
|
3967
4452
|
const ringRadius = radius * ringRatio(chart, tick);
|
|
3968
4453
|
nodes.push({
|
|
3969
4454
|
type: "ellipse",
|
|
@@ -3977,8 +4462,8 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
3977
4462
|
style
|
|
3978
4463
|
});
|
|
3979
4464
|
});
|
|
3980
|
-
|
|
3981
|
-
const angle =
|
|
4465
|
+
chunkKXYSO6GC_cjs.chartTicks(chart.axisX).forEach((tick) => {
|
|
4466
|
+
const angle = chunkKXYSO6GC_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, tick);
|
|
3982
4467
|
const edgeX = centerX + Math.cos(angle) * radius;
|
|
3983
4468
|
const edgeY = centerY + Math.sin(angle) * radius;
|
|
3984
4469
|
nodes.push({
|
|
@@ -3993,13 +4478,13 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
3993
4478
|
return nodes;
|
|
3994
4479
|
}
|
|
3995
4480
|
function buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width) {
|
|
3996
|
-
const yTicks =
|
|
3997
|
-
const xTicks =
|
|
4481
|
+
const yTicks = chunkKXYSO6GC_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min);
|
|
4482
|
+
const xTicks = chunkKXYSO6GC_cjs.chartTicks(chart.axisX);
|
|
3998
4483
|
const nodes = [];
|
|
3999
4484
|
yTicks.forEach((yTick) => {
|
|
4000
4485
|
const ringRadius = radius * ringRatio(chart, yTick);
|
|
4001
4486
|
xTicks.forEach((xTick) => {
|
|
4002
|
-
const angle =
|
|
4487
|
+
const angle = chunkKXYSO6GC_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, xTick);
|
|
4003
4488
|
const x = centerX + Math.cos(angle) * ringRadius;
|
|
4004
4489
|
const y = centerY + Math.sin(angle) * ringRadius;
|
|
4005
4490
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
@@ -4021,8 +4506,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4021
4506
|
if (chart.gridShape === "circle" && CIRCULAR_GRID_CHART_TYPES.has(chart.chartType)) {
|
|
4022
4507
|
return buildCircularChartGrid(chart, plot, bounds, order);
|
|
4023
4508
|
}
|
|
4024
|
-
const width =
|
|
4025
|
-
if (
|
|
4509
|
+
const width = chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1);
|
|
4510
|
+
if (chunkKXYSO6GC_cjs.isHorizontalBar(chart)) {
|
|
4026
4511
|
return buildHorizontalBarGrid(chart, plot, bounds, order, width);
|
|
4027
4512
|
}
|
|
4028
4513
|
const clip = chart.chartType === "field" ? fieldSurfaceClip(chart, plot) : void 0;
|
|
@@ -4037,8 +4522,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4037
4522
|
clip
|
|
4038
4523
|
};
|
|
4039
4524
|
const nodes = [];
|
|
4040
|
-
(chart.gridAxes === "y" ? [] :
|
|
4041
|
-
const x = plot.x +
|
|
4525
|
+
(chart.gridAxes === "y" ? [] : chunkKXYSO6GC_cjs.chartTicks(chart.axisX)).forEach((tick) => {
|
|
4526
|
+
const x = plot.x + chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisX, plot.width);
|
|
4042
4527
|
nodes.push({
|
|
4043
4528
|
type: "path",
|
|
4044
4529
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -4048,8 +4533,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4048
4533
|
style
|
|
4049
4534
|
});
|
|
4050
4535
|
});
|
|
4051
|
-
(chart.gridAxes === "x" ? [] :
|
|
4052
|
-
const y = plot.y + plot.height -
|
|
4536
|
+
(chart.gridAxes === "x" ? [] : chunkKXYSO6GC_cjs.chartTicks(chart.axisY)).forEach((tick) => {
|
|
4537
|
+
const y = plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
4053
4538
|
nodes.push({
|
|
4054
4539
|
type: "path",
|
|
4055
4540
|
id: `chart-grid-y-${chart.id}-${tick}`,
|
|
@@ -4071,8 +4556,8 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
4071
4556
|
strokeWidth: width,
|
|
4072
4557
|
...chart.gridLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : gridLineDashStyle(chart, width)
|
|
4073
4558
|
};
|
|
4074
|
-
return
|
|
4075
|
-
const x = plot.x +
|
|
4559
|
+
return chunkKXYSO6GC_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
4560
|
+
const x = plot.x + chunkKXYSO6GC_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4076
4561
|
return {
|
|
4077
4562
|
type: "path",
|
|
4078
4563
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -4084,13 +4569,13 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
4084
4569
|
});
|
|
4085
4570
|
}
|
|
4086
4571
|
function buildDottedRectGrid(chart, plot, bounds, order, width, clip) {
|
|
4087
|
-
const xTicks =
|
|
4088
|
-
const yTicks =
|
|
4572
|
+
const xTicks = chunkKXYSO6GC_cjs.chartTicks(chart.axisX);
|
|
4573
|
+
const yTicks = chunkKXYSO6GC_cjs.chartTicks(chart.axisY);
|
|
4089
4574
|
const nodes = [];
|
|
4090
4575
|
xTicks.forEach((xTick) => {
|
|
4091
|
-
const x = plot.x +
|
|
4576
|
+
const x = plot.x + chunkKXYSO6GC_cjs.mapChartValue(xTick, chart.axisX, plot.width);
|
|
4092
4577
|
yTicks.forEach((yTick) => {
|
|
4093
|
-
const y = plot.y + plot.height -
|
|
4578
|
+
const y = plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(yTick, chart.axisY, plot.height);
|
|
4094
4579
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
4095
4580
|
nodes.push(createGridDot(chart, id, order + nodes.length, bounds, x, y, width, clip));
|
|
4096
4581
|
});
|
|
@@ -4113,7 +4598,7 @@ function createChartRuleMarks(render2) {
|
|
|
4113
4598
|
return {
|
|
4114
4599
|
rule,
|
|
4115
4600
|
color: rule.color || render2.chart.strokeColor || "#475569",
|
|
4116
|
-
y: render2.plot.y + render2.plot.height -
|
|
4601
|
+
y: render2.plot.y + render2.plot.height - chunkKXYSO6GC_cjs.mapChartValue(rule.at, render2.chart.axisY, render2.plot.height),
|
|
4117
4602
|
lineOrder,
|
|
4118
4603
|
labelOrder
|
|
4119
4604
|
};
|
|
@@ -4133,7 +4618,7 @@ function createChartRuleLine(render2, mark) {
|
|
|
4133
4618
|
order: mark.lineOrder,
|
|
4134
4619
|
bounds: render2.bounds,
|
|
4135
4620
|
d: `M ${render2.plot.x} ${mark.y} L ${render2.plot.x + render2.plot.width} ${mark.y}`,
|
|
4136
|
-
prop:
|
|
4621
|
+
prop: chunkKXYSO6GC_cjs.ruleAtProp(mark.rule.id),
|
|
4137
4622
|
propKind: "value",
|
|
4138
4623
|
style: {
|
|
4139
4624
|
fill: { kind: "none" },
|
|
@@ -4144,9 +4629,9 @@ function createChartRuleLine(render2, mark) {
|
|
|
4144
4629
|
};
|
|
4145
4630
|
}
|
|
4146
4631
|
function createChartRuleLabel(render2, mark) {
|
|
4147
|
-
const fontSize = Math.max(9,
|
|
4632
|
+
const fontSize = Math.max(9, chunkKXYSO6GC_cjs.finite(render2.chart.fontSize, 12) - 2);
|
|
4148
4633
|
return {
|
|
4149
|
-
...
|
|
4634
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
4150
4635
|
id: `chart-rule-label-${render2.chart.id}-${mark.rule.id}`,
|
|
4151
4636
|
order: mark.labelOrder ?? mark.lineOrder + 1,
|
|
4152
4637
|
bounds: render2.bounds,
|
|
@@ -4155,38 +4640,38 @@ function createChartRuleLabel(render2, mark) {
|
|
|
4155
4640
|
chart: render2.chart
|
|
4156
4641
|
}),
|
|
4157
4642
|
color: mark.color,
|
|
4158
|
-
prop:
|
|
4643
|
+
prop: chunkKXYSO6GC_cjs.ruleTextProp(mark.rule.id)
|
|
4159
4644
|
};
|
|
4160
4645
|
}
|
|
4161
4646
|
|
|
4162
4647
|
// src/renderScene/charts/chartBackdrop.ts
|
|
4163
4648
|
function chartImageRect(chart) {
|
|
4164
|
-
const inset =
|
|
4649
|
+
const inset = chunkKXYSO6GC_cjs.finite(chart.strokeWidth, 1) / 2;
|
|
4165
4650
|
return {
|
|
4166
4651
|
x: chart.x + inset,
|
|
4167
4652
|
y: chart.y + inset,
|
|
4168
4653
|
width: Math.max(1, chart.width - inset * 2),
|
|
4169
4654
|
height: Math.max(1, chart.height - inset * 2),
|
|
4170
|
-
rx: Math.max(0,
|
|
4655
|
+
rx: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.cornerRadius, 12) - inset)
|
|
4171
4656
|
};
|
|
4172
4657
|
}
|
|
4173
4658
|
function buildChartBackdrop(chart, bounds, order) {
|
|
4174
4659
|
if (!chart.fillImage) {
|
|
4175
4660
|
return [];
|
|
4176
4661
|
}
|
|
4177
|
-
const
|
|
4662
|
+
const rect2 = chartImageRect(chart);
|
|
4178
4663
|
const nodes = [
|
|
4179
4664
|
{
|
|
4180
4665
|
type: "image",
|
|
4181
4666
|
id: `chart-image-${chart.id}`,
|
|
4182
4667
|
order: order.next(),
|
|
4183
4668
|
bounds,
|
|
4184
|
-
x:
|
|
4185
|
-
y:
|
|
4186
|
-
width:
|
|
4187
|
-
height:
|
|
4669
|
+
x: rect2.x,
|
|
4670
|
+
y: rect2.y,
|
|
4671
|
+
width: rect2.width,
|
|
4672
|
+
height: rect2.height,
|
|
4188
4673
|
href: chart.fillImage.url,
|
|
4189
|
-
style: { clip: { type: "rect", ...
|
|
4674
|
+
style: { clip: { type: "rect", ...rect2 }, pointerEvents: "none" }
|
|
4190
4675
|
}
|
|
4191
4676
|
];
|
|
4192
4677
|
if (chart.fillImage.overlay) {
|
|
@@ -4195,11 +4680,11 @@ function buildChartBackdrop(chart, bounds, order) {
|
|
|
4195
4680
|
id: `chart-image-overlay-${chart.id}`,
|
|
4196
4681
|
order: order.next(),
|
|
4197
4682
|
bounds,
|
|
4198
|
-
x:
|
|
4199
|
-
y:
|
|
4200
|
-
width:
|
|
4201
|
-
height:
|
|
4202
|
-
rx:
|
|
4683
|
+
x: rect2.x,
|
|
4684
|
+
y: rect2.y,
|
|
4685
|
+
width: rect2.width,
|
|
4686
|
+
height: rect2.height,
|
|
4687
|
+
rx: rect2.rx,
|
|
4203
4688
|
style: { fill: { kind: "solid", color: chart.fillImage.overlay }, pointerEvents: "none" }
|
|
4204
4689
|
});
|
|
4205
4690
|
}
|
|
@@ -4209,25 +4694,25 @@ function buildChartBackdrop(chart, bounds, order) {
|
|
|
4209
4694
|
// src/renderScene/charts/renderers/bar/glass.ts
|
|
4210
4695
|
function createGlassBackdropNodes(context, id, d) {
|
|
4211
4696
|
const { chart, bounds, nextOrder } = context;
|
|
4212
|
-
const blur =
|
|
4697
|
+
const blur = chunkKXYSO6GC_cjs.finite(chart.config?.barGlassBlur, 0);
|
|
4213
4698
|
if (blur <= 0 || !chart.fillImage) {
|
|
4214
4699
|
return [];
|
|
4215
4700
|
}
|
|
4216
|
-
const
|
|
4701
|
+
const rect2 = chartImageRect(chart);
|
|
4217
4702
|
const nodes = [
|
|
4218
4703
|
{
|
|
4219
4704
|
type: "image",
|
|
4220
4705
|
id: `chart-bar-glass-${chart.id}-${id}`,
|
|
4221
4706
|
order: nextOrder(),
|
|
4222
4707
|
bounds,
|
|
4223
|
-
x:
|
|
4224
|
-
y:
|
|
4225
|
-
width:
|
|
4226
|
-
height:
|
|
4708
|
+
x: rect2.x,
|
|
4709
|
+
y: rect2.y,
|
|
4710
|
+
width: rect2.width,
|
|
4711
|
+
height: rect2.height,
|
|
4227
4712
|
href: chart.fillImage.url,
|
|
4228
4713
|
style: {
|
|
4229
4714
|
blur,
|
|
4230
|
-
saturate:
|
|
4715
|
+
saturate: chunkKXYSO6GC_cjs.finite(chart.config?.barGlassSaturation, 1),
|
|
4231
4716
|
clip: { type: "path", d },
|
|
4232
4717
|
pointerEvents: "none"
|
|
4233
4718
|
}
|
|
@@ -4278,8 +4763,8 @@ function createBarGlowNode(context, id, d, color, glow, bounds = context.bounds)
|
|
|
4278
4763
|
bounds,
|
|
4279
4764
|
d,
|
|
4280
4765
|
style: {
|
|
4281
|
-
fill:
|
|
4282
|
-
shadow: { color:
|
|
4766
|
+
fill: chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id),
|
|
4767
|
+
shadow: { color: chunkKXYSO6GC_cjs.representativeColor(color, "#ffffff"), opacity: 0.9, blur: glow, dx: 0, dy: 0 },
|
|
4283
4768
|
pointerEvents: "none"
|
|
4284
4769
|
}
|
|
4285
4770
|
};
|
|
@@ -4290,14 +4775,14 @@ function barLabelsEnabled(context) {
|
|
|
4290
4775
|
return context.chart.config?.showBarLabels === true;
|
|
4291
4776
|
}
|
|
4292
4777
|
function resolvePlacement(target, size) {
|
|
4293
|
-
const fits = target.frame.height >= size.height +
|
|
4778
|
+
const fits = target.frame.height >= size.height + chunkKXYSO6GC_cjs.BAR_LABEL.gap * 2;
|
|
4294
4779
|
return target.placement !== "outside" && !fits ? "outside" : target.placement;
|
|
4295
4780
|
}
|
|
4296
4781
|
function labelTop(placement, frame, height) {
|
|
4297
4782
|
if (placement === "outside") {
|
|
4298
|
-
return frame.y - height -
|
|
4783
|
+
return frame.y - height - chunkKXYSO6GC_cjs.BAR_LABEL.gap;
|
|
4299
4784
|
}
|
|
4300
|
-
return placement === "inside" ? frame.y +
|
|
4785
|
+
return placement === "inside" ? frame.y + chunkKXYSO6GC_cjs.BAR_LABEL.gap : frame.y + frame.height / 2 - height / 2;
|
|
4301
4786
|
}
|
|
4302
4787
|
function createPillNode(context, id, box, color) {
|
|
4303
4788
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
@@ -4307,11 +4792,11 @@ function createPillNode(context, id, box, color) {
|
|
|
4307
4792
|
id: `${id}-pill`,
|
|
4308
4793
|
order: nextOrder(),
|
|
4309
4794
|
bounds,
|
|
4310
|
-
d:
|
|
4795
|
+
d: chunkKXYSO6GC_cjs.pillPath(box.left, box.top, box.width, box.height),
|
|
4311
4796
|
style: {
|
|
4312
|
-
fill: config?.barLabelPillColor ?
|
|
4313
|
-
stroke:
|
|
4314
|
-
strokeWidth:
|
|
4797
|
+
fill: config?.barLabelPillColor ? chunkKXYSO6GC_cjs.paint(config.barLabelPillColor, diagnostics, chart.id) : { kind: "none" },
|
|
4798
|
+
stroke: chunkKXYSO6GC_cjs.paint(config?.barLabelBorderColor ?? color, diagnostics, chart.id),
|
|
4799
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(config?.barLabelBorderWidth, 1),
|
|
4315
4800
|
pointerEvents: "none"
|
|
4316
4801
|
}
|
|
4317
4802
|
};
|
|
@@ -4320,7 +4805,7 @@ function createTextNode(context, id, box, text, placement, fontSize, color) {
|
|
|
4320
4805
|
const { chart, bounds, nextOrder } = context;
|
|
4321
4806
|
const config = chart.config;
|
|
4322
4807
|
return {
|
|
4323
|
-
...
|
|
4808
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
4324
4809
|
id,
|
|
4325
4810
|
order: nextOrder(),
|
|
4326
4811
|
bounds,
|
|
@@ -4341,7 +4826,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4341
4826
|
const config = chart.config;
|
|
4342
4827
|
const top = plot.y + plot.height + 4 + 16 + Math.max(0, chart.tickLength ?? 0);
|
|
4343
4828
|
return {
|
|
4344
|
-
...
|
|
4829
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
4345
4830
|
id: target.id,
|
|
4346
4831
|
order: nextOrder(),
|
|
4347
4832
|
bounds,
|
|
@@ -4350,7 +4835,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4350
4835
|
y: target.frame.y + target.frame.height / 2 - fontSize * 0.6,
|
|
4351
4836
|
width: plot.width - 14,
|
|
4352
4837
|
height: fontSize * 1.2
|
|
4353
|
-
} : { x: plot.x, y: target.frame.y -
|
|
4838
|
+
} : { x: plot.x, y: target.frame.y - chunkKXYSO6GC_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 },
|
|
4354
4839
|
text,
|
|
4355
4840
|
chart,
|
|
4356
4841
|
align: target.horizontal ? "right" : chart.categoryAlign === "left" ? "left" : "center"
|
|
@@ -4364,24 +4849,24 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4364
4849
|
}
|
|
4365
4850
|
function horizontalPlacement(target, size) {
|
|
4366
4851
|
const requested = target.placement === "axis" ? "outside" : target.placement;
|
|
4367
|
-
const fits = target.frame.width >= size.width +
|
|
4852
|
+
const fits = target.frame.width >= size.width + chunkKXYSO6GC_cjs.BAR_LABEL.gap * 2;
|
|
4368
4853
|
return requested !== "outside" && !fits ? "outside" : requested;
|
|
4369
4854
|
}
|
|
4370
4855
|
function horizontalBox(target, size, placement) {
|
|
4371
4856
|
const { frame } = target;
|
|
4372
|
-
const left = placement === "outside" ? frame.x + frame.width +
|
|
4857
|
+
const left = placement === "outside" ? frame.x + frame.width + chunkKXYSO6GC_cjs.BAR_LABEL.gap : placement === "inside" ? frame.x + frame.width - size.width - chunkKXYSO6GC_cjs.BAR_LABEL.gap : frame.x + frame.width / 2 - size.width / 2;
|
|
4373
4858
|
return { ...size, left, top: frame.y + frame.height / 2 - size.height / 2 };
|
|
4374
4859
|
}
|
|
4375
4860
|
function createBarLabelNodes(context, target) {
|
|
4376
4861
|
const { chart } = context;
|
|
4377
4862
|
const config = chart.config;
|
|
4378
|
-
const fontSize = Math.max(8,
|
|
4379
|
-
const text =
|
|
4863
|
+
const fontSize = Math.max(8, chunkKXYSO6GC_cjs.finite(config?.barLabelFontSize, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12)));
|
|
4864
|
+
const text = chunkKXYSO6GC_cjs.formatBarLabel(target.value, config?.barLabelFormat);
|
|
4380
4865
|
if (target.placement === "axis") {
|
|
4381
4866
|
return [createAxisValueNode(context, target, text, fontSize)];
|
|
4382
4867
|
}
|
|
4383
4868
|
const pill = config?.barLabelPill === true;
|
|
4384
|
-
const size =
|
|
4869
|
+
const size = chunkKXYSO6GC_cjs.barLabelSize(text, fontSize, pill);
|
|
4385
4870
|
const placement = target.horizontal ? horizontalPlacement(target, size) : resolvePlacement(target, size);
|
|
4386
4871
|
const box = target.horizontal ? horizontalBox(target, size, placement) : {
|
|
4387
4872
|
...size,
|
|
@@ -4422,7 +4907,7 @@ function barTrackClip(context, frame) {
|
|
|
4422
4907
|
}
|
|
4423
4908
|
return {
|
|
4424
4909
|
type: "path",
|
|
4425
|
-
d:
|
|
4910
|
+
d: chunkKXYSO6GC_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, context.chart.config?.barCornerRadius ?? 2)
|
|
4426
4911
|
};
|
|
4427
4912
|
}
|
|
4428
4913
|
function barTrackEnabled(context) {
|
|
@@ -4432,8 +4917,8 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
4432
4917
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
4433
4918
|
const config = chart.config;
|
|
4434
4919
|
const radius = config?.barCornerRadius ?? 2;
|
|
4435
|
-
const segments =
|
|
4436
|
-
const d = segments > 0 ?
|
|
4920
|
+
const segments = chunkKXYSO6GC_cjs.finite(config?.barSegments, 0);
|
|
4921
|
+
const d = segments > 0 ? chunkKXYSO6GC_cjs.segmentedBarPath(frame, orientation, segments, chunkKXYSO6GC_cjs.finite(config?.barSegmentGap, 4), radius, 1, true) : chunkKXYSO6GC_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, radius);
|
|
4437
4922
|
const nodes = [
|
|
4438
4923
|
{
|
|
4439
4924
|
type: "path",
|
|
@@ -4442,7 +4927,7 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
4442
4927
|
bounds,
|
|
4443
4928
|
d,
|
|
4444
4929
|
style: {
|
|
4445
|
-
fill:
|
|
4930
|
+
fill: chunkKXYSO6GC_cjs.paint(config?.barTrackColor ?? chart.gridColor ?? "#e2e8f0", diagnostics, chart.id),
|
|
4446
4931
|
pointerEvents: "none"
|
|
4447
4932
|
}
|
|
4448
4933
|
}
|
|
@@ -4458,13 +4943,13 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
4458
4943
|
frame.y,
|
|
4459
4944
|
frame.width,
|
|
4460
4945
|
frame.height,
|
|
4461
|
-
|
|
4462
|
-
Math.max(MIN_HATCH_SPACING,
|
|
4946
|
+
chunkKXYSO6GC_cjs.finite(config.barTrackHatchAngle, DEFAULT_HATCH.angle),
|
|
4947
|
+
Math.max(MIN_HATCH_SPACING, chunkKXYSO6GC_cjs.finite(config.barTrackHatchSpacing, DEFAULT_HATCH.spacing))
|
|
4463
4948
|
),
|
|
4464
4949
|
style: {
|
|
4465
4950
|
fill: { kind: "none" },
|
|
4466
|
-
stroke:
|
|
4467
|
-
strokeWidth:
|
|
4951
|
+
stroke: chunkKXYSO6GC_cjs.paint(config.barTrackHatchColor ?? chart.gridColor ?? "#cbd5e1", diagnostics, chart.id),
|
|
4952
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(config.barTrackHatchWidth, DEFAULT_HATCH.width),
|
|
4468
4953
|
pointerEvents: "none",
|
|
4469
4954
|
clip: { type: "path", d }
|
|
4470
4955
|
}
|
|
@@ -4511,23 +4996,23 @@ function groupedShape(context, frame) {
|
|
|
4511
4996
|
const { chart, plot } = context;
|
|
4512
4997
|
const config = chart.config;
|
|
4513
4998
|
const radius = config?.barCornerRadius ?? 2;
|
|
4514
|
-
const segments =
|
|
4999
|
+
const segments = chunkKXYSO6GC_cjs.finite(config?.barSegments, 0);
|
|
4515
5000
|
if (segments > 0) {
|
|
4516
|
-
return
|
|
5001
|
+
return chunkKXYSO6GC_cjs.segmentedBarPath(
|
|
4517
5002
|
{ x: frame.x, y: plot.y, width: frame.width, height: plot.height },
|
|
4518
5003
|
"vertical",
|
|
4519
5004
|
segments,
|
|
4520
|
-
|
|
5005
|
+
chunkKXYSO6GC_cjs.finite(config?.barSegmentGap, 4),
|
|
4521
5006
|
radius,
|
|
4522
5007
|
frame.height / plot.height,
|
|
4523
5008
|
config?.barSegmentSnap !== false
|
|
4524
5009
|
);
|
|
4525
5010
|
}
|
|
4526
|
-
return
|
|
5011
|
+
return chunkKXYSO6GC_cjs.barPath(frame.x, frame.y, frame.width, frame.height, radius, config?.barRoundedBottom === true);
|
|
4527
5012
|
}
|
|
4528
5013
|
function createGroupedGlow(context, mark) {
|
|
4529
5014
|
const { chart } = context;
|
|
4530
|
-
const glow =
|
|
5015
|
+
const glow = chunkKXYSO6GC_cjs.finite(chart.config?.barGlow, 0);
|
|
4531
5016
|
if (glow <= 0 || mark.frame.height <= 0) {
|
|
4532
5017
|
return [];
|
|
4533
5018
|
}
|
|
@@ -4538,10 +5023,10 @@ function createGroupedGlow(context, mark) {
|
|
|
4538
5023
|
}
|
|
4539
5024
|
function createGroupedBarLayout(context) {
|
|
4540
5025
|
const { chart, plot } = context;
|
|
4541
|
-
const valueCount =
|
|
5026
|
+
const valueCount = chunkKXYSO6GC_cjs.barCategoryCount(chart);
|
|
4542
5027
|
const slotWidth = plot.width / valueCount;
|
|
4543
|
-
const groupGap = Math.min(Math.max(0,
|
|
4544
|
-
const barGap = Math.max(0,
|
|
5028
|
+
const groupGap = Math.min(Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
5029
|
+
const barGap = Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.barGap, 2));
|
|
4545
5030
|
return {
|
|
4546
5031
|
slotWidth,
|
|
4547
5032
|
seriesWidth: Math.max(1, (slotWidth - groupGap) / Math.max(1, chart.series.length)),
|
|
@@ -4551,10 +5036,10 @@ function createGroupedBarLayout(context) {
|
|
|
4551
5036
|
}
|
|
4552
5037
|
function createSeriesBarMarks(context, layout, series, seriesIndex) {
|
|
4553
5038
|
const { chart, plot } = context;
|
|
4554
|
-
const seriesColor2 = series.color ??
|
|
5039
|
+
const seriesColor2 = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
4555
5040
|
return series.values.map((value, valueIndex) => {
|
|
4556
5041
|
const numericValue = Array.isArray(value) ? value[1] : value;
|
|
4557
|
-
const height = Math.max(0,
|
|
5042
|
+
const height = Math.max(0, chunkKXYSO6GC_cjs.mapChartValue(numericValue, chart.axisY, plot.height));
|
|
4558
5043
|
return {
|
|
4559
5044
|
seriesId: series.id,
|
|
4560
5045
|
valueIndex,
|
|
@@ -4588,10 +5073,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
4588
5073
|
const radius = chart.config?.barCornerRadius ?? 2;
|
|
4589
5074
|
const { x, width } = mark.frame;
|
|
4590
5075
|
const path = groupedShape(context, mark.frame);
|
|
4591
|
-
const fill2 =
|
|
4592
|
-
const stroke =
|
|
4593
|
-
const strokeWidth =
|
|
4594
|
-
const shadow =
|
|
5076
|
+
const fill2 = chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5077
|
+
const stroke = chunkKXYSO6GC_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5078
|
+
const strokeWidth = chunkKXYSO6GC_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5079
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
4595
5080
|
const shadowCaster = shadow ? {
|
|
4596
5081
|
type: "path",
|
|
4597
5082
|
id: `chart-bar-shadow-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
@@ -4621,10 +5106,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
4621
5106
|
valueIndex: mark.valueIndex,
|
|
4622
5107
|
mark: "bar",
|
|
4623
5108
|
radius,
|
|
4624
|
-
colorProp:
|
|
5109
|
+
colorProp: chunkKXYSO6GC_cjs.seriesValueColorProp(mark.seriesId, mark.valueIndex),
|
|
4625
5110
|
hasColorOverride: mark.hasColorOverride
|
|
4626
5111
|
},
|
|
4627
|
-
prop:
|
|
5112
|
+
prop: chunkKXYSO6GC_cjs.seriesValueProp(mark.seriesId, mark.valueIndex),
|
|
4628
5113
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
4629
5114
|
};
|
|
4630
5115
|
const glass = createGlassBackdropNodes(context, `${mark.seriesId}-${mark.valueIndex}`, path);
|
|
@@ -4635,15 +5120,15 @@ function createGroupedBarError(context, mark) {
|
|
|
4635
5120
|
return null;
|
|
4636
5121
|
}
|
|
4637
5122
|
const { chart, plot, bounds, nextOrder } = context;
|
|
4638
|
-
const [lower, upper] =
|
|
4639
|
-
return
|
|
5123
|
+
const [lower, upper] = chunkKXYSO6GC_cjs.errorBarRange(mark.value, mark.error);
|
|
5124
|
+
return chunkKXYSO6GC_cjs.createVerticalErrorWhiskerNode({
|
|
4640
5125
|
id: `chart-bar-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
4641
5126
|
order: nextOrder(),
|
|
4642
5127
|
bounds,
|
|
4643
5128
|
geometry: {
|
|
4644
5129
|
centerX: mark.frame.x + mark.frame.width / 2,
|
|
4645
|
-
startY: plot.y + plot.height -
|
|
4646
|
-
endY: plot.y + plot.height -
|
|
5130
|
+
startY: plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
5131
|
+
endY: plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
4647
5132
|
},
|
|
4648
5133
|
color: chart.textColor ?? "#0f172a",
|
|
4649
5134
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -4653,9 +5138,9 @@ function createGroupedBarError(context, mark) {
|
|
|
4653
5138
|
// src/renderScene/charts/renderers/bar/horizontal.ts
|
|
4654
5139
|
function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
4655
5140
|
const { chart, plot } = context;
|
|
4656
|
-
const top =
|
|
5141
|
+
const top = chunkKXYSO6GC_cjs.rowTop(rows, plot, valueIndex) + rows.labelRow;
|
|
4657
5142
|
if (context.stackedMode) {
|
|
4658
|
-
const segment =
|
|
5143
|
+
const segment = chunkKXYSO6GC_cjs.stackedSegment(chart, context.stackedMode, valueIndex, seriesIndex, plot.width);
|
|
4659
5144
|
const start = Math.min(segment.pixelStart, segment.pixelEnd);
|
|
4660
5145
|
return {
|
|
4661
5146
|
x: plot.x + start,
|
|
@@ -4664,27 +5149,27 @@ function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
|
4664
5149
|
height: rows.barsHeight
|
|
4665
5150
|
};
|
|
4666
5151
|
}
|
|
4667
|
-
const barGap = Math.max(0,
|
|
5152
|
+
const barGap = Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.barGap, 2));
|
|
4668
5153
|
const seriesHeight = rows.barsHeight / Math.max(1, chart.series.length);
|
|
4669
|
-
const width = Math.max(0,
|
|
5154
|
+
const width = Math.max(0, chunkKXYSO6GC_cjs.mapChartValue(value, chart.axisY, plot.width));
|
|
4670
5155
|
return { x: plot.x, y: top + seriesIndex * seriesHeight, width, height: Math.max(1, seriesHeight - barGap) };
|
|
4671
5156
|
}
|
|
4672
5157
|
function barPath2(context, frame) {
|
|
4673
5158
|
const { chart, plot } = context;
|
|
4674
5159
|
const config = chart.config;
|
|
4675
|
-
const segments = context.stackedMode && chart.series.length > 1 ? 0 :
|
|
5160
|
+
const segments = context.stackedMode && chart.series.length > 1 ? 0 : chunkKXYSO6GC_cjs.finite(config?.barSegments, 0);
|
|
4676
5161
|
if (segments > 0) {
|
|
4677
|
-
return
|
|
5162
|
+
return chunkKXYSO6GC_cjs.segmentedBarPath(
|
|
4678
5163
|
{ x: plot.x, y: frame.y, width: plot.width, height: frame.height },
|
|
4679
5164
|
"horizontal",
|
|
4680
5165
|
segments,
|
|
4681
|
-
|
|
5166
|
+
chunkKXYSO6GC_cjs.finite(config?.barSegmentGap, 4),
|
|
4682
5167
|
config?.barCornerRadius ?? 2,
|
|
4683
5168
|
frame.width / plot.width,
|
|
4684
5169
|
config?.barSegmentSnap !== false
|
|
4685
5170
|
);
|
|
4686
5171
|
}
|
|
4687
|
-
return
|
|
5172
|
+
return chunkKXYSO6GC_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, config?.barCornerRadius ?? 2);
|
|
4688
5173
|
}
|
|
4689
5174
|
function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
4690
5175
|
const { plot } = context;
|
|
@@ -4704,16 +5189,16 @@ function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
|
4704
5189
|
maxY: frame.y + frame.height
|
|
4705
5190
|
},
|
|
4706
5191
|
path: barPath2(context, frame),
|
|
4707
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5192
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length]
|
|
4708
5193
|
};
|
|
4709
5194
|
}
|
|
4710
5195
|
function barNodes(context, mark) {
|
|
4711
5196
|
const { chart, diagnostics, nextOrder } = context;
|
|
4712
5197
|
const config = chart.config;
|
|
4713
|
-
const stroke =
|
|
4714
|
-
const strokeWidth =
|
|
4715
|
-
const shadow =
|
|
4716
|
-
const fill2 =
|
|
5198
|
+
const stroke = chunkKXYSO6GC_cjs.paint(config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5199
|
+
const strokeWidth = chunkKXYSO6GC_cjs.finite(config?.barBorderWidth, 0);
|
|
5200
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5201
|
+
const fill2 = chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id);
|
|
4717
5202
|
const nodes = [...createGlassBackdropNodes(context, mark.id, mark.path)];
|
|
4718
5203
|
if (shadow) {
|
|
4719
5204
|
nodes.push({
|
|
@@ -4737,7 +5222,7 @@ function barNodes(context, mark) {
|
|
|
4737
5222
|
valueIndex: mark.valueIndex,
|
|
4738
5223
|
mark: "bar",
|
|
4739
5224
|
radius: config?.barCornerRadius ?? 2,
|
|
4740
|
-
colorProp:
|
|
5225
|
+
colorProp: chunkKXYSO6GC_cjs.seriesValueColorProp(mark.series.id, mark.valueIndex),
|
|
4741
5226
|
hasColorOverride: mark.series.colors?.[mark.valueIndex] != null
|
|
4742
5227
|
},
|
|
4743
5228
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
@@ -4767,7 +5252,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
4767
5252
|
layers.tracks.push(...createBarTrackNodes(context, mark.id, mark.trackFrame, "horizontal"));
|
|
4768
5253
|
}
|
|
4769
5254
|
layers.bars.push(...barNodes(context, mark));
|
|
4770
|
-
const glow =
|
|
5255
|
+
const glow = chunkKXYSO6GC_cjs.finite(chart.config?.barGlow, 0);
|
|
4771
5256
|
if (glow > 0 && mark.frame.width > 0) {
|
|
4772
5257
|
layers.glows.push(
|
|
4773
5258
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${mark.id}`, mark.path, mark.color, glow, mark.bounds)
|
|
@@ -4776,7 +5261,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
4776
5261
|
layers.labels.push(...labelNodes2(context, mark, highest));
|
|
4777
5262
|
}
|
|
4778
5263
|
function renderHorizontalBars(context) {
|
|
4779
|
-
const rows =
|
|
5264
|
+
const rows = chunkKXYSO6GC_cjs.horizontalRows(context.chart, context.plot);
|
|
4780
5265
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
4781
5266
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
4782
5267
|
const numeric = series.values.map((value) => typeof value === "number" ? value : value[1]);
|
|
@@ -4791,8 +5276,8 @@ function renderHorizontalBars(context) {
|
|
|
4791
5276
|
// src/renderScene/charts/renderers/bar/stacked.ts
|
|
4792
5277
|
function slotOf(context, mode) {
|
|
4793
5278
|
const { chart, plot } = context;
|
|
4794
|
-
const slotWidth = plot.width /
|
|
4795
|
-
const groupGap = Math.min(Math.max(0,
|
|
5279
|
+
const slotWidth = plot.width / chunkKXYSO6GC_cjs.barCategoryCount(chart);
|
|
5280
|
+
const groupGap = Math.min(Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
4796
5281
|
return {
|
|
4797
5282
|
slotWidth,
|
|
4798
5283
|
groupGap,
|
|
@@ -4803,19 +5288,19 @@ function slotOf(context, mode) {
|
|
|
4803
5288
|
}
|
|
4804
5289
|
function pathOf(context, x, y, height, slot, radius) {
|
|
4805
5290
|
const { chart, plot } = context;
|
|
4806
|
-
const segments = chart.series.length === 1 ?
|
|
5291
|
+
const segments = chart.series.length === 1 ? chunkKXYSO6GC_cjs.finite(chart.config?.barSegments, 0) : 0;
|
|
4807
5292
|
if (segments > 0) {
|
|
4808
|
-
return
|
|
5293
|
+
return chunkKXYSO6GC_cjs.segmentedBarPath(
|
|
4809
5294
|
{ x, y: plot.y, width: slot.barWidth, height: plot.height },
|
|
4810
5295
|
"vertical",
|
|
4811
5296
|
segments,
|
|
4812
|
-
|
|
5297
|
+
chunkKXYSO6GC_cjs.finite(chart.config?.barSegmentGap, 4),
|
|
4813
5298
|
radius,
|
|
4814
5299
|
height / plot.height,
|
|
4815
5300
|
chart.config?.barSegmentSnap !== false
|
|
4816
5301
|
);
|
|
4817
5302
|
}
|
|
4818
|
-
return
|
|
5303
|
+
return chunkKXYSO6GC_cjs.barPath(x, y, slot.barWidth, height, radius, chart.config?.barRoundedBottom === true);
|
|
4819
5304
|
}
|
|
4820
5305
|
function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame) {
|
|
4821
5306
|
const { chart } = context;
|
|
@@ -4837,7 +5322,7 @@ function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame
|
|
|
4837
5322
|
}
|
|
4838
5323
|
function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
4839
5324
|
const { chart, plot } = context;
|
|
4840
|
-
const segment =
|
|
5325
|
+
const segment = chunkKXYSO6GC_cjs.stackedSegment(chart, mode, valueIndex, seriesIndex, plot.height);
|
|
4841
5326
|
const radius = slot.outerSeriesIndex === null || seriesIndex === slot.outerSeriesIndex ? slot.cornerRadius : 0;
|
|
4842
5327
|
const x = plot.x + valueIndex * slot.slotWidth + slot.groupGap / 2;
|
|
4843
5328
|
const y = plot.y + plot.height - Math.max(segment.pixelStart, segment.pixelEnd);
|
|
@@ -4846,7 +5331,7 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
4846
5331
|
series,
|
|
4847
5332
|
valueIndex,
|
|
4848
5333
|
radius,
|
|
4849
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5334
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length],
|
|
4850
5335
|
x,
|
|
4851
5336
|
y,
|
|
4852
5337
|
height,
|
|
@@ -4857,10 +5342,10 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
4857
5342
|
function segmentNodes(context, mark) {
|
|
4858
5343
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
4859
5344
|
const { series, valueIndex, path } = mark;
|
|
4860
|
-
const fill2 =
|
|
4861
|
-
const stroke =
|
|
4862
|
-
const strokeWidth =
|
|
4863
|
-
const shadow =
|
|
5345
|
+
const fill2 = chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5346
|
+
const stroke = chunkKXYSO6GC_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5347
|
+
const strokeWidth = chunkKXYSO6GC_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5348
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
4864
5349
|
const nodes = [];
|
|
4865
5350
|
if (shadow) {
|
|
4866
5351
|
const plotClip = `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z`;
|
|
@@ -4892,10 +5377,10 @@ function segmentNodes(context, mark) {
|
|
|
4892
5377
|
valueIndex,
|
|
4893
5378
|
mark: "bar",
|
|
4894
5379
|
radius: mark.radius,
|
|
4895
|
-
colorProp:
|
|
5380
|
+
colorProp: chunkKXYSO6GC_cjs.seriesValueColorProp(series.id, valueIndex),
|
|
4896
5381
|
hasColorOverride: series.colors?.[valueIndex] != null
|
|
4897
5382
|
},
|
|
4898
|
-
prop:
|
|
5383
|
+
prop: chunkKXYSO6GC_cjs.seriesValueProp(series.id, valueIndex),
|
|
4899
5384
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
4900
5385
|
});
|
|
4901
5386
|
return nodes;
|
|
@@ -4909,7 +5394,7 @@ function pushSegment(context, mode, layers, slot, series, seriesIndex, valueInde
|
|
|
4909
5394
|
layers.bars.push(...segmentNodes(context, mark));
|
|
4910
5395
|
const frame = { x: mark.x, y: mark.y, width: slot.barWidth, height: mark.height };
|
|
4911
5396
|
pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame);
|
|
4912
|
-
const glow =
|
|
5397
|
+
const glow = chunkKXYSO6GC_cjs.finite(chart.config?.barGlow, 0);
|
|
4913
5398
|
if (glow > 0) {
|
|
4914
5399
|
layers.glows.push(
|
|
4915
5400
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${series.id}-${valueIndex}`, mark.path, mark.color, glow)
|
|
@@ -4920,7 +5405,7 @@ function renderStackedBars(context, mode) {
|
|
|
4920
5405
|
const { chart } = context;
|
|
4921
5406
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
4922
5407
|
const slot = slotOf(context, mode);
|
|
4923
|
-
const valueCount =
|
|
5408
|
+
const valueCount = chunkKXYSO6GC_cjs.barCategoryCount(chart);
|
|
4924
5409
|
for (let valueIndex = 0; valueIndex < valueCount; valueIndex++) {
|
|
4925
5410
|
chart.series.forEach((series, seriesIndex) => {
|
|
4926
5411
|
pushSegment(context, mode, layers, slot, series, seriesIndex, valueIndex);
|
|
@@ -4935,7 +5420,7 @@ function isSeriesMax2(values, index) {
|
|
|
4935
5420
|
|
|
4936
5421
|
// src/renderScene/charts/renderers/bar.ts
|
|
4937
5422
|
function renderBar(context) {
|
|
4938
|
-
if (
|
|
5423
|
+
if (chunkKXYSO6GC_cjs.isHorizontalBar(context.chart)) {
|
|
4939
5424
|
return renderHorizontalBars(context);
|
|
4940
5425
|
}
|
|
4941
5426
|
if (context.stackedMode) {
|
|
@@ -4950,7 +5435,7 @@ function createBoxplotLayout(context) {
|
|
|
4950
5435
|
const orientation = chart.config?.orientation ?? "vertical";
|
|
4951
5436
|
const boxCount = Math.max(1, chart.series.length);
|
|
4952
5437
|
const slotWidth = (orientation === "horizontal" ? plot.height : plot.width) / boxCount;
|
|
4953
|
-
const borderColor =
|
|
5438
|
+
const borderColor = chunkKXYSO6GC_cjs.representativeColor(chart.config?.barBorderColor, "#000000");
|
|
4954
5439
|
const widthFraction = Math.min(1, Math.max(0.05, chart.config?.boxWidth ?? 0.6));
|
|
4955
5440
|
return {
|
|
4956
5441
|
orientation,
|
|
@@ -4959,15 +5444,15 @@ function createBoxplotLayout(context) {
|
|
|
4959
5444
|
cornerRadius: chart.config?.barCornerRadius ?? 2,
|
|
4960
5445
|
showPoints: chart.config?.showBoxplotPoints ?? true,
|
|
4961
5446
|
borderColor,
|
|
4962
|
-
borderWidth:
|
|
4963
|
-
whiskerWidth: Math.max(0,
|
|
4964
|
-
medianWidth: Math.max(0,
|
|
5447
|
+
borderWidth: chunkKXYSO6GC_cjs.finite(chart.config?.barBorderWidth, 1),
|
|
5448
|
+
whiskerWidth: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.boxWhiskerWidth, 1)),
|
|
5449
|
+
medianWidth: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.boxMedianWidth, 2)),
|
|
4965
5450
|
medianColor: chart.config?.boxMedianColor ?? borderColor,
|
|
4966
5451
|
whiskerColor: chart.config?.boxWhiskerColor,
|
|
4967
|
-
capSize: Math.max(0,
|
|
4968
|
-
pointSize: Math.max(0,
|
|
4969
|
-
pointOpacity: Math.min(1, Math.max(0,
|
|
4970
|
-
jitter: Math.max(0,
|
|
5452
|
+
capSize: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.boxCapSize, 0.4)),
|
|
5453
|
+
pointSize: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.boxPointSize, 3)),
|
|
5454
|
+
pointOpacity: Math.min(1, Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.boxPointOpacity, 0.7))),
|
|
5455
|
+
jitter: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.boxJitter, 1))
|
|
4971
5456
|
};
|
|
4972
5457
|
}
|
|
4973
5458
|
|
|
@@ -4978,7 +5463,7 @@ function boxplotPoint(orientation, center, value) {
|
|
|
4978
5463
|
function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
4979
5464
|
const { chart, plot } = context;
|
|
4980
5465
|
const { orientation } = layout;
|
|
4981
|
-
const valueAt = (value) => orientation === "horizontal" ? plot.x +
|
|
5466
|
+
const valueAt = (value) => orientation === "horizontal" ? plot.x + chunkKXYSO6GC_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
4982
5467
|
const center = plot[orientation === "horizontal" ? "y" : "x"] + seriesIndex * layout.slotWidth + layout.slotWidth / 2;
|
|
4983
5468
|
return {
|
|
4984
5469
|
center,
|
|
@@ -4993,7 +5478,7 @@ function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
|
4993
5478
|
// src/renderScene/charts/renderers/boxplot/points.ts
|
|
4994
5479
|
function renderSamplePoints(context, layout, mark) {
|
|
4995
5480
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
4996
|
-
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x +
|
|
5481
|
+
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x + chunkKXYSO6GC_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
4997
5482
|
if (layout.pointSize <= 0) {
|
|
4998
5483
|
return [];
|
|
4999
5484
|
}
|
|
@@ -5009,7 +5494,7 @@ function renderSamplePoints(context, layout, mark) {
|
|
|
5009
5494
|
cy: y,
|
|
5010
5495
|
rx: layout.pointSize,
|
|
5011
5496
|
ry: layout.pointSize,
|
|
5012
|
-
style: { fill:
|
|
5497
|
+
style: { fill: chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id), opacity: layout.pointOpacity }
|
|
5013
5498
|
};
|
|
5014
5499
|
});
|
|
5015
5500
|
}
|
|
@@ -5033,7 +5518,7 @@ function renderBoxAndWhiskers(context, layout, mark) {
|
|
|
5033
5518
|
}
|
|
5034
5519
|
function whiskerColor(layout, mark) {
|
|
5035
5520
|
if (layout.whiskerColor === "series") {
|
|
5036
|
-
return
|
|
5521
|
+
return chunkKXYSO6GC_cjs.representativeColor(mark.color, layout.borderColor);
|
|
5037
5522
|
}
|
|
5038
5523
|
return layout.whiskerColor;
|
|
5039
5524
|
}
|
|
@@ -5115,7 +5600,7 @@ function createBoxNode(context, layout, mark) {
|
|
|
5115
5600
|
height,
|
|
5116
5601
|
rx: layout.cornerRadius,
|
|
5117
5602
|
style: {
|
|
5118
|
-
fill:
|
|
5603
|
+
fill: chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id),
|
|
5119
5604
|
stroke: { kind: "solid", color: layout.borderColor },
|
|
5120
5605
|
strokeWidth: layout.borderWidth
|
|
5121
5606
|
}
|
|
@@ -5124,12 +5609,12 @@ function createBoxNode(context, layout, mark) {
|
|
|
5124
5609
|
|
|
5125
5610
|
// src/renderScene/charts/renderers/boxplot/series.ts
|
|
5126
5611
|
function renderBoxplotSeries(context, layout, series, seriesIndex) {
|
|
5127
|
-
const stats =
|
|
5612
|
+
const stats = chunkKXYSO6GC_cjs.computeBoxplotStats(series.values);
|
|
5128
5613
|
if (!stats) {
|
|
5129
5614
|
return [];
|
|
5130
5615
|
}
|
|
5131
5616
|
const geometry = createBoxplotGeometry(context, layout, seriesIndex, stats);
|
|
5132
|
-
const color = series.color ??
|
|
5617
|
+
const color = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
5133
5618
|
const mark = {
|
|
5134
5619
|
id: `${context.chart.id}-${series.id}`,
|
|
5135
5620
|
series,
|
|
@@ -5191,21 +5676,21 @@ function metricComponent(chart, point) {
|
|
|
5191
5676
|
}
|
|
5192
5677
|
function customPointPosition(context, value) {
|
|
5193
5678
|
return {
|
|
5194
|
-
x: context.plot.x +
|
|
5195
|
-
y: context.plot.y + context.plot.height -
|
|
5679
|
+
x: context.plot.x + chunkKXYSO6GC_cjs.mapChartValue(value[0], context.chart.axisX, context.plot.width),
|
|
5680
|
+
y: context.plot.y + context.plot.height - chunkKXYSO6GC_cjs.mapChartValue(value[1], context.chart.axisY, context.plot.height)
|
|
5196
5681
|
};
|
|
5197
5682
|
}
|
|
5198
5683
|
function customSeriesStyle(context, series, seriesIndex) {
|
|
5199
|
-
const color = series.color ??
|
|
5684
|
+
const color = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
5200
5685
|
return {
|
|
5201
|
-
fill:
|
|
5686
|
+
fill: chunkKXYSO6GC_cjs.paint(color, context.diagnostics, context.chart.id),
|
|
5202
5687
|
stroke: series.stroke ? { kind: "solid", color: series.stroke } : void 0,
|
|
5203
|
-
strokeWidth: series.stroke ?
|
|
5688
|
+
strokeWidth: series.stroke ? chunkKXYSO6GC_cjs.finite(series.strokeWidth, 1) : void 0
|
|
5204
5689
|
};
|
|
5205
5690
|
}
|
|
5206
5691
|
function createCustomSymbolMark(context, mark) {
|
|
5207
5692
|
const symbol = mark.series.symbol;
|
|
5208
|
-
const size =
|
|
5693
|
+
const size = chunkKXYSO6GC_cjs.finite(mark.series.size, 3);
|
|
5209
5694
|
const scale = symbol?.normalized ? size * 2 : 1;
|
|
5210
5695
|
const offset = symbol?.normalized ? 0.5 : 0;
|
|
5211
5696
|
const points = (symbol?.points ?? []).map(([x, y]) => ({
|
|
@@ -5217,12 +5702,12 @@ function createCustomSymbolMark(context, mark) {
|
|
|
5217
5702
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
5218
5703
|
order: context.nextOrder(),
|
|
5219
5704
|
bounds: context.bounds,
|
|
5220
|
-
d:
|
|
5705
|
+
d: chunkKXYSO6GC_cjs.freeformPathData({ points, tension: chunkKXYSO6GC_cjs.finite(symbol?.tension, 0), closed: true }),
|
|
5221
5706
|
style: mark.style
|
|
5222
5707
|
};
|
|
5223
5708
|
}
|
|
5224
5709
|
function createCustomPointMark(context, mark) {
|
|
5225
|
-
const radius =
|
|
5710
|
+
const radius = chunkKXYSO6GC_cjs.finite(mark.series.size, 3);
|
|
5226
5711
|
return {
|
|
5227
5712
|
type: "ellipse",
|
|
5228
5713
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
@@ -5246,7 +5731,7 @@ function renderConnectedPairs(context) {
|
|
|
5246
5731
|
const zones = chart.config?.zones ?? [];
|
|
5247
5732
|
const betterColor = zones[0]?.color ?? "#10b981";
|
|
5248
5733
|
const worseColor = zones[1]?.color ?? "#ec4899";
|
|
5249
|
-
const tieColor = zones[2]?.color ??
|
|
5734
|
+
const tieColor = zones[2]?.color ?? chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL;
|
|
5250
5735
|
const reverse = Boolean(chart.config?.reverseComparison);
|
|
5251
5736
|
const count = Math.min(beforeValues.length, afterValues.length);
|
|
5252
5737
|
const categories = chart.config?.categories ?? [];
|
|
@@ -5261,7 +5746,7 @@ function renderConnectedPairs(context) {
|
|
|
5261
5746
|
const better = reverse ? afterMetric < beforeMetric : afterMetric > beforeMetric;
|
|
5262
5747
|
const worse = reverse ? afterMetric > beforeMetric : afterMetric < beforeMetric;
|
|
5263
5748
|
const comparisonColor = better ? betterColor : worse ? worseColor : tieColor;
|
|
5264
|
-
const radius =
|
|
5749
|
+
const radius = chunkKXYSO6GC_cjs.finite(afterSeries.size, 3);
|
|
5265
5750
|
nodes.push(createConnectorLine(context, index, beforePoint, afterPoint, comparisonColor));
|
|
5266
5751
|
nodes.push(
|
|
5267
5752
|
createCustomPointMark(context, {
|
|
@@ -5269,9 +5754,9 @@ function renderConnectedPairs(context) {
|
|
|
5269
5754
|
valueIndex: index,
|
|
5270
5755
|
point: beforePoint,
|
|
5271
5756
|
style: {
|
|
5272
|
-
fill:
|
|
5757
|
+
fill: chunkKXYSO6GC_cjs.paint(chart.config?.customBeforeFill ?? chart.gridColor ?? "#e2e8f0", context.diagnostics, chart.id),
|
|
5273
5758
|
stroke: { kind: "solid", color: chart.config?.customBeforeStroke ?? HOLLOW_POINT_STROKE },
|
|
5274
|
-
strokeWidth:
|
|
5759
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.config?.customBeforeStrokeWidth, 1.5)
|
|
5275
5760
|
}
|
|
5276
5761
|
})
|
|
5277
5762
|
);
|
|
@@ -5281,7 +5766,7 @@ function renderConnectedPairs(context) {
|
|
|
5281
5766
|
valueIndex: index,
|
|
5282
5767
|
point: afterPoint,
|
|
5283
5768
|
style: {
|
|
5284
|
-
fill:
|
|
5769
|
+
fill: chunkKXYSO6GC_cjs.paint(comparisonColor, context.diagnostics, chart.id),
|
|
5285
5770
|
stroke: void 0,
|
|
5286
5771
|
strokeWidth: void 0
|
|
5287
5772
|
}
|
|
@@ -5308,7 +5793,7 @@ function createConnectorLine(context, index, from, to, color) {
|
|
|
5308
5793
|
style: {
|
|
5309
5794
|
fill: { kind: "none" },
|
|
5310
5795
|
stroke: { kind: "solid", color },
|
|
5311
|
-
strokeWidth:
|
|
5796
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.config?.customConnectorWidth, 2),
|
|
5312
5797
|
opacity: chart.config?.customConnectorOpacity,
|
|
5313
5798
|
dash: connectorDash(chart.config?.customConnectorDash)
|
|
5314
5799
|
}
|
|
@@ -5329,7 +5814,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
5329
5814
|
height: 16
|
|
5330
5815
|
};
|
|
5331
5816
|
return {
|
|
5332
|
-
...
|
|
5817
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
5333
5818
|
id: `chart-custom-label-${chart.id}-${index}`,
|
|
5334
5819
|
order: nextOrder(),
|
|
5335
5820
|
bounds,
|
|
@@ -5338,7 +5823,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
5338
5823
|
chart,
|
|
5339
5824
|
align: horizontal ? "left" : "center"
|
|
5340
5825
|
}),
|
|
5341
|
-
fontSize: Math.max(6,
|
|
5826
|
+
fontSize: Math.max(6, chunkKXYSO6GC_cjs.finite(chart.config?.customLabelSize, Math.max(9, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
5342
5827
|
...chart.config?.customLabelColor ? { color: chart.config.customLabelColor } : {}
|
|
5343
5828
|
};
|
|
5344
5829
|
}
|
|
@@ -5350,8 +5835,8 @@ function classifyFieldData(context) {
|
|
|
5350
5835
|
const vectorSeries = chart.series.filter((series) => tupleSize(series.values[0]) === 4);
|
|
5351
5836
|
const scalarSamples = scalarSeries.flatMap(
|
|
5352
5837
|
(series) => series.values.map(([x, y, value]) => ({
|
|
5353
|
-
x:
|
|
5354
|
-
y: plot.height -
|
|
5838
|
+
x: chunkKXYSO6GC_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
5839
|
+
y: plot.height - chunkKXYSO6GC_cjs.mapChartValue(y, chart.axisY, plot.height),
|
|
5355
5840
|
value
|
|
5356
5841
|
}))
|
|
5357
5842
|
);
|
|
@@ -5415,20 +5900,20 @@ function createLegendLabels(context, minimum, maximum, geometry) {
|
|
|
5415
5900
|
const { chart, bounds, nextOrder } = context;
|
|
5416
5901
|
const y = geometry.y + geometry.height + 3;
|
|
5417
5902
|
return [
|
|
5418
|
-
|
|
5903
|
+
chunkKXYSO6GC_cjs.chartText({
|
|
5419
5904
|
id: `chart-field-colorbar-min-${chart.id}`,
|
|
5420
5905
|
order: nextOrder(),
|
|
5421
5906
|
bounds,
|
|
5422
5907
|
frame: { x: geometry.x, y, width: 80, height: 16 },
|
|
5423
|
-
text:
|
|
5908
|
+
text: chunkKXYSO6GC_cjs.formatFieldValue(minimum),
|
|
5424
5909
|
chart
|
|
5425
5910
|
}),
|
|
5426
|
-
|
|
5911
|
+
chunkKXYSO6GC_cjs.chartText({
|
|
5427
5912
|
id: `chart-field-colorbar-max-${chart.id}`,
|
|
5428
5913
|
order: nextOrder(),
|
|
5429
5914
|
bounds,
|
|
5430
5915
|
frame: { x: geometry.x + geometry.width - 80, y, width: 80, height: 16 },
|
|
5431
|
-
text:
|
|
5916
|
+
text: chunkKXYSO6GC_cjs.formatFieldValue(maximum),
|
|
5432
5917
|
chart,
|
|
5433
5918
|
align: "right"
|
|
5434
5919
|
})
|
|
@@ -5441,7 +5926,7 @@ function colorAtRamp(ramp, value) {
|
|
|
5441
5926
|
if (!ramp?.stops.length) {
|
|
5442
5927
|
return RAMP_FALLBACK_COLOR;
|
|
5443
5928
|
}
|
|
5444
|
-
return
|
|
5929
|
+
return chunkKXYSO6GC_cjs.interpolateHexColorStops(ramp.stops, value);
|
|
5445
5930
|
}
|
|
5446
5931
|
|
|
5447
5932
|
// src/renderScene/charts/field/isolines.ts
|
|
@@ -5651,7 +6136,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
5651
6136
|
}
|
|
5652
6137
|
const chains = stitchIsolineSegments(segments);
|
|
5653
6138
|
const path = chains.map(
|
|
5654
|
-
(chain) =>
|
|
6139
|
+
(chain) => chunkKXYSO6GC_cjs.linePathData(
|
|
5655
6140
|
chain.map(([x, y]) => ({ x: plot.x + x, y: plot.y + y })),
|
|
5656
6141
|
ISOLINE_TENSION
|
|
5657
6142
|
)
|
|
@@ -5675,7 +6160,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
5675
6160
|
function renderVectorField(context, seriesList) {
|
|
5676
6161
|
const nodes = [];
|
|
5677
6162
|
seriesList.forEach((series, seriesIndex) => {
|
|
5678
|
-
const color = series.color ??
|
|
6163
|
+
const color = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
5679
6164
|
series.values.forEach((vector, vectorIndex) => {
|
|
5680
6165
|
nodes.push(createVectorNode(context, series.id, vector, vectorIndex, color));
|
|
5681
6166
|
});
|
|
@@ -5685,10 +6170,10 @@ function renderVectorField(context, seriesList) {
|
|
|
5685
6170
|
function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
5686
6171
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
5687
6172
|
const [x, y, angle, magnitude] = vector;
|
|
5688
|
-
const startX = plot.x +
|
|
5689
|
-
const startY = plot.y + plot.height -
|
|
5690
|
-
const endX = plot.x +
|
|
5691
|
-
const endY = plot.y + plot.height -
|
|
6173
|
+
const startX = plot.x + chunkKXYSO6GC_cjs.mapChartValue(x, chart.axisX, plot.width);
|
|
6174
|
+
const startY = plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(y, chart.axisY, plot.height);
|
|
6175
|
+
const endX = plot.x + chunkKXYSO6GC_cjs.mapChartValue(x + Math.cos(angle) * magnitude, chart.axisX, plot.width);
|
|
6176
|
+
const endY = plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(y + Math.sin(angle) * magnitude, chart.axisY, plot.height);
|
|
5692
6177
|
return {
|
|
5693
6178
|
type: "path",
|
|
5694
6179
|
id: `chart-field-vector-${chart.id}-${seriesId}-${vectorIndex}`,
|
|
@@ -5698,7 +6183,7 @@ function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
|
5698
6183
|
markerEnd: "filled_arrow",
|
|
5699
6184
|
style: {
|
|
5700
6185
|
fill: { kind: "none" },
|
|
5701
|
-
stroke:
|
|
6186
|
+
stroke: chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id),
|
|
5702
6187
|
strokeWidth: 2
|
|
5703
6188
|
}
|
|
5704
6189
|
};
|
|
@@ -5745,7 +6230,7 @@ function createHeatmapCell(layout, series, rowIndex, columnIndex) {
|
|
|
5745
6230
|
};
|
|
5746
6231
|
}
|
|
5747
6232
|
function colorForValue(value, layout) {
|
|
5748
|
-
return
|
|
6233
|
+
return chunkKXYSO6GC_cjs.zoneColorAtValue(value, layout.bands, layout.zones);
|
|
5749
6234
|
}
|
|
5750
6235
|
function renderHeatmapCell(context, layout, cell) {
|
|
5751
6236
|
const background = createCellBackground(context, layout, cell);
|
|
@@ -5760,7 +6245,7 @@ function createCellBackground(context, layout, cell) {
|
|
|
5760
6245
|
const style = {
|
|
5761
6246
|
fill: { kind: "solid", color: cell.color },
|
|
5762
6247
|
stroke: { kind: "solid", color: chart.config?.cellStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
5763
|
-
strokeWidth:
|
|
6248
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.config?.cellStrokeWidth, chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1))
|
|
5764
6249
|
};
|
|
5765
6250
|
if (chart.config?.cellShape === "circle") {
|
|
5766
6251
|
return {
|
|
@@ -5787,9 +6272,9 @@ function createCellBackground(context, layout, cell) {
|
|
|
5787
6272
|
}
|
|
5788
6273
|
function createCellValueLabel(context, layout, cell) {
|
|
5789
6274
|
const { chart, bounds, nextOrder } = context;
|
|
5790
|
-
const size = Math.max(6,
|
|
6275
|
+
const size = Math.max(6, chunkKXYSO6GC_cjs.finite(chart.config?.cellValueSize, layout.fontSize));
|
|
5791
6276
|
return {
|
|
5792
|
-
...
|
|
6277
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
5793
6278
|
id: `chart-heatmap-value-${chart.id}-${cell.seriesId}-${cell.columnIndex}`,
|
|
5794
6279
|
order: nextOrder(),
|
|
5795
6280
|
bounds,
|
|
@@ -5804,7 +6289,7 @@ function createCellValueLabel(context, layout, cell) {
|
|
|
5804
6289
|
align: "center"
|
|
5805
6290
|
}),
|
|
5806
6291
|
...chart.config?.cellValueSize === void 0 ? {} : { fontSize: size },
|
|
5807
|
-
color: chart.config?.cellValueColor ??
|
|
6292
|
+
color: chart.config?.cellValueColor ?? chunkKXYSO6GC_cjs.contrastTextColor(cell.color)
|
|
5808
6293
|
};
|
|
5809
6294
|
}
|
|
5810
6295
|
|
|
@@ -5820,7 +6305,7 @@ function renderRowHeaders(context, layout) {
|
|
|
5820
6305
|
}
|
|
5821
6306
|
function createRowHeader(context, layout, series, rowIndex) {
|
|
5822
6307
|
const { chart, plot, bounds, nextOrder } = context;
|
|
5823
|
-
return
|
|
6308
|
+
return chunkKXYSO6GC_cjs.chartText({
|
|
5824
6309
|
id: `chart-heatmap-row-${chart.id}-${series.id}`,
|
|
5825
6310
|
order: nextOrder(),
|
|
5826
6311
|
bounds,
|
|
@@ -5842,7 +6327,7 @@ function renderColumnHeaders(context, layout) {
|
|
|
5842
6327
|
}
|
|
5843
6328
|
function createColumnHeader(context, layout, label, columnIndex) {
|
|
5844
6329
|
const { chart, plot, bounds, nextOrder } = context;
|
|
5845
|
-
return
|
|
6330
|
+
return chunkKXYSO6GC_cjs.chartText({
|
|
5846
6331
|
id: `chart-heatmap-col-${chart.id}-${columnIndex}`,
|
|
5847
6332
|
order: nextOrder(),
|
|
5848
6333
|
bounds,
|
|
@@ -5866,9 +6351,9 @@ function createHeatmapLayout(context) {
|
|
|
5866
6351
|
return {
|
|
5867
6352
|
rows: chart.series,
|
|
5868
6353
|
columns,
|
|
5869
|
-
bands:
|
|
5870
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
5871
|
-
fontSize: Math.max(9,
|
|
6354
|
+
bands: chunkKXYSO6GC_cjs.axisBands(chart.axisY),
|
|
6355
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkKXYSO6GC_cjs.DEFAULT_HEATMAP_ZONES,
|
|
6356
|
+
fontSize: Math.max(9, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12)),
|
|
5872
6357
|
reservedSpace,
|
|
5873
6358
|
grid: createHeatmapGrid(context, reservedSpace, columns.length)
|
|
5874
6359
|
};
|
|
@@ -5879,9 +6364,9 @@ function heatmapColumns(context) {
|
|
|
5879
6364
|
}
|
|
5880
6365
|
function heatmapReservedSpace(context) {
|
|
5881
6366
|
const { chart } = context;
|
|
5882
|
-
const fontSize = Math.max(9,
|
|
6367
|
+
const fontSize = Math.max(9, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12));
|
|
5883
6368
|
const longestLabel = chart.series.reduce(
|
|
5884
|
-
(max, series) => Math.max(max,
|
|
6369
|
+
(max, series) => Math.max(max, chunkKXYSO6GC_cjs.estimateTextWidth(series.label ?? "", fontSize, false)),
|
|
5885
6370
|
0
|
|
5886
6371
|
);
|
|
5887
6372
|
return {
|
|
@@ -5895,7 +6380,7 @@ function createHeatmapGrid(context, reservedSpace, columnCount) {
|
|
|
5895
6380
|
const width = Math.max(1, context.plot.width - reservedSpace.rowHeaders);
|
|
5896
6381
|
const height = Math.max(1, context.plot.height - reservedSpace.columnHeaders - reservedSpace.legend);
|
|
5897
6382
|
const rowCount = chart.series.length;
|
|
5898
|
-
const cellGap = Math.max(0,
|
|
6383
|
+
const cellGap = Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.cellGap, 0));
|
|
5899
6384
|
let cellWidth = columnCount ? width / columnCount : width;
|
|
5900
6385
|
let cellHeight = rowCount ? height / rowCount : height;
|
|
5901
6386
|
let gridWidth = width;
|
|
@@ -5915,7 +6400,7 @@ function createHeatmapGrid(context, reservedSpace, columnCount) {
|
|
|
5915
6400
|
cellWidth,
|
|
5916
6401
|
cellHeight,
|
|
5917
6402
|
cellGap,
|
|
5918
|
-
cellRadius: Math.max(0,
|
|
6403
|
+
cellRadius: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.barCornerRadius, cellGap))
|
|
5919
6404
|
};
|
|
5920
6405
|
}
|
|
5921
6406
|
|
|
@@ -5931,7 +6416,7 @@ function renderHeatmapLegend(context, layout) {
|
|
|
5931
6416
|
const barWidth = layout.grid.width;
|
|
5932
6417
|
const labelHeight = layout.fontSize + 2;
|
|
5933
6418
|
const barY = layout.grid.y + layout.grid.height + 6;
|
|
5934
|
-
const barBounds =
|
|
6419
|
+
const barBounds = chunkKXYSO6GC_cjs.boxBounds({ x: barX, y: barY, width: barWidth, height: BAR_HEIGHT });
|
|
5935
6420
|
return [
|
|
5936
6421
|
createGradientBar(context, layout, barX, barY, barWidth, barBounds),
|
|
5937
6422
|
...createBoundaryTicks(context, layout, barX, barY, barWidth, labelHeight)
|
|
@@ -5948,7 +6433,7 @@ function createGradientBar(context, layout, barX, barY, barWidth, barBounds) {
|
|
|
5948
6433
|
const zones = layout.zones.slice(0, bandCount);
|
|
5949
6434
|
const stops = zones.map((zone, index) => ({
|
|
5950
6435
|
offset: bandRatio(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
5951
|
-
color: zone.color ??
|
|
6436
|
+
color: zone.color ?? chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL
|
|
5952
6437
|
}));
|
|
5953
6438
|
return {
|
|
5954
6439
|
type: "rect",
|
|
@@ -5962,7 +6447,7 @@ function createGradientBar(context, layout, barX, barY, barWidth, barBounds) {
|
|
|
5962
6447
|
rx: 3,
|
|
5963
6448
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
5964
6449
|
style: {
|
|
5965
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color:
|
|
6450
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color: chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL },
|
|
5966
6451
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
5967
6452
|
strokeWidth: 1
|
|
5968
6453
|
}
|
|
@@ -5990,12 +6475,12 @@ function createBoundaryTicks(context, layout, barX, barY, barWidth, labelHeight)
|
|
|
5990
6475
|
const isLast = index === layout.bands.length - 1;
|
|
5991
6476
|
const align = isFirst ? "left" : isLast ? "right" : "center";
|
|
5992
6477
|
const frameX = isFirst ? x : isLast ? x - labelWidth : x - labelWidth / 2;
|
|
5993
|
-
const label =
|
|
6478
|
+
const label = chunkKXYSO6GC_cjs.chartText({
|
|
5994
6479
|
id: `chart-heatmap-legend-tick-label-${chart.id}-${index}`,
|
|
5995
6480
|
order: nextOrder(),
|
|
5996
6481
|
bounds,
|
|
5997
6482
|
frame: { x: frameX, y: labelY, width: labelWidth, height: labelHeight },
|
|
5998
|
-
text:
|
|
6483
|
+
text: chunkKXYSO6GC_cjs.formatFieldValue(value),
|
|
5999
6484
|
chart,
|
|
6000
6485
|
align
|
|
6001
6486
|
});
|
|
@@ -6337,22 +6822,22 @@ function renderHexbin(context) {
|
|
|
6337
6822
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
6338
6823
|
const nodes = [];
|
|
6339
6824
|
const config = chart.config;
|
|
6340
|
-
const hexRadius = Math.max(1, config?.hexRadius ??
|
|
6825
|
+
const hexRadius = Math.max(1, config?.hexRadius ?? chunkKXYSO6GC_cjs.DEFAULT_HEX_RADIUS);
|
|
6341
6826
|
const drawRadius = Math.max(0.5, hexRadius - Math.max(0, config?.hexGap ?? 0) * GAP_TO_RADIUS);
|
|
6342
6827
|
const strokeWidth = config?.hexStrokeWidth ?? 0;
|
|
6343
6828
|
const minOpacity = Math.min(1, Math.max(0, config?.hexMinOpacity ?? DEFAULT_MIN_OPACITY));
|
|
6344
|
-
const shadow =
|
|
6829
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
6345
6830
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
6346
6831
|
chart.series.forEach((series, seriesIndex) => {
|
|
6347
6832
|
const explicit = series.values.length > 0 && Array.isArray(series.values[0]);
|
|
6348
6833
|
const pairs = explicit ? series.values : series.values.map((y, i) => [chart.axisX.min + i * chart.axisX.step, y]);
|
|
6349
6834
|
const pixelPoints2 = pairs.map(([vx, vy]) => ({
|
|
6350
|
-
x:
|
|
6351
|
-
y: plot.height -
|
|
6835
|
+
x: chunkKXYSO6GC_cjs.mapChartValue(vx, chart.axisX, plot.width),
|
|
6836
|
+
y: plot.height - chunkKXYSO6GC_cjs.mapChartValue(vy, chart.axisY, plot.height)
|
|
6352
6837
|
}));
|
|
6353
6838
|
const bins = computeHexBins(pixelPoints2, hexRadius);
|
|
6354
6839
|
const maxCount = Math.max(1, ...bins.map((bin) => bin.count));
|
|
6355
|
-
const color = series.color ??
|
|
6840
|
+
const color = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
6356
6841
|
const ramp = config?.scale;
|
|
6357
6842
|
bins.forEach((bin, i) => {
|
|
6358
6843
|
const share = bin.count / maxCount;
|
|
@@ -6364,8 +6849,8 @@ function renderHexbin(context) {
|
|
|
6364
6849
|
bounds,
|
|
6365
6850
|
d: hexPath(plot.x + bin.cx, plot.y + bin.cy, drawRadius),
|
|
6366
6851
|
style: {
|
|
6367
|
-
fill:
|
|
6368
|
-
stroke: strokeWidth > 0 ?
|
|
6852
|
+
fill: chunkKXYSO6GC_cjs.paint(fill2, diagnostics, chart.id),
|
|
6853
|
+
stroke: strokeWidth > 0 ? chunkKXYSO6GC_cjs.paint(config?.hexStrokeColor ?? fill2, diagnostics, chart.id) : void 0,
|
|
6369
6854
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
6370
6855
|
opacity: ramp ? void 0 : Math.max(minOpacity, share),
|
|
6371
6856
|
shadow,
|
|
@@ -6387,8 +6872,8 @@ function seriesValuePairs(chart, series) {
|
|
|
6387
6872
|
function pixelPoints(context, pairs) {
|
|
6388
6873
|
const { chart, plot } = context;
|
|
6389
6874
|
return pairs.map(([x, y]) => ({
|
|
6390
|
-
x: plot.x +
|
|
6391
|
-
y: plot.y + plot.height -
|
|
6875
|
+
x: plot.x + chunkKXYSO6GC_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
6876
|
+
y: plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(y, chart.axisY, plot.height)
|
|
6392
6877
|
}));
|
|
6393
6878
|
}
|
|
6394
6879
|
|
|
@@ -6398,7 +6883,7 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
6398
6883
|
const baselineY = plot.y + plot.height;
|
|
6399
6884
|
const first = points[0];
|
|
6400
6885
|
const last = points[points.length - 1];
|
|
6401
|
-
const d = `${
|
|
6886
|
+
const d = `${chunkKXYSO6GC_cjs.linePathData(points, tension)} L ${last.x} ${baselineY} L ${first.x} ${baselineY} Z`;
|
|
6402
6887
|
const top = Math.min(...points.map((point) => point.y));
|
|
6403
6888
|
const centerX = (Math.min(...points.map((point) => point.x)) + Math.max(...points.map((point) => point.x))) / 2;
|
|
6404
6889
|
const halfHeight = (baselineY - top) / 2;
|
|
@@ -6420,8 +6905,8 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
6420
6905
|
kind: "linear-gradient",
|
|
6421
6906
|
angle: 90,
|
|
6422
6907
|
stops: [
|
|
6423
|
-
{ offset: 0, color:
|
|
6424
|
-
{ offset: 100, color:
|
|
6908
|
+
{ offset: 0, color: chunkKXYSO6GC_cjs.colorWithAlpha(color, areaOpacity) },
|
|
6909
|
+
{ offset: 100, color: chunkKXYSO6GC_cjs.colorWithAlpha(color, 0) }
|
|
6425
6910
|
]
|
|
6426
6911
|
},
|
|
6427
6912
|
stroke: { kind: "none" },
|
|
@@ -6444,7 +6929,7 @@ function guideNode(context, mark) {
|
|
|
6444
6929
|
d: `M ${mark.point.x} ${mark.point.y} V ${plot.y + plot.height}`,
|
|
6445
6930
|
style: {
|
|
6446
6931
|
fill: { kind: "none" },
|
|
6447
|
-
stroke:
|
|
6932
|
+
stroke: chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id),
|
|
6448
6933
|
strokeWidth: 1,
|
|
6449
6934
|
dash: [3, 4],
|
|
6450
6935
|
opacity: 0.55,
|
|
@@ -6465,7 +6950,7 @@ function dotNode(context, mark) {
|
|
|
6465
6950
|
rx: mark.radius,
|
|
6466
6951
|
ry: mark.radius,
|
|
6467
6952
|
style: {
|
|
6468
|
-
fill:
|
|
6953
|
+
fill: chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id),
|
|
6469
6954
|
shadow: glow ? { color: mark.color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : void 0,
|
|
6470
6955
|
pointerEvents: "none"
|
|
6471
6956
|
}
|
|
@@ -6478,7 +6963,7 @@ function labelNode3(context, mark, value) {
|
|
|
6478
6963
|
const text = formatHighlight(config?.highlightLabelFormat, config?.categories?.[mark.index] ?? "", value);
|
|
6479
6964
|
const width = Math.max(48, text.length * fontSize * 0.62);
|
|
6480
6965
|
return {
|
|
6481
|
-
...
|
|
6966
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
6482
6967
|
id: `chart-highlight-label-${mark.key}`,
|
|
6483
6968
|
order: nextOrder(),
|
|
6484
6969
|
bounds,
|
|
@@ -6558,15 +7043,15 @@ function createLineError(context, mark) {
|
|
|
6558
7043
|
return null;
|
|
6559
7044
|
}
|
|
6560
7045
|
const { chart, plot, bounds, nextOrder } = context;
|
|
6561
|
-
const [lower, upper] =
|
|
6562
|
-
return
|
|
7046
|
+
const [lower, upper] = chunkKXYSO6GC_cjs.errorBarRange(mark.value, mark.error);
|
|
7047
|
+
return chunkKXYSO6GC_cjs.createVerticalErrorWhiskerNode({
|
|
6563
7048
|
id: `chart-line-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
6564
7049
|
order: nextOrder(),
|
|
6565
7050
|
bounds,
|
|
6566
7051
|
geometry: {
|
|
6567
7052
|
centerX: mark.position.x,
|
|
6568
|
-
startY: plot.y + plot.height -
|
|
6569
|
-
endY: plot.y + plot.height -
|
|
7053
|
+
startY: plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
7054
|
+
endY: plot.y + plot.height - chunkKXYSO6GC_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
6570
7055
|
},
|
|
6571
7056
|
color: mark.color,
|
|
6572
7057
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -6590,8 +7075,8 @@ function createLinePoint(context, mark) {
|
|
|
6590
7075
|
ry: visible ? radius : 6,
|
|
6591
7076
|
detail: { of: "chartValue", series: mark.seriesId, valueIndex: mark.valueIndex },
|
|
6592
7077
|
style: {
|
|
6593
|
-
fill: visible ?
|
|
6594
|
-
stroke: visible && strokeWidth > 0 ?
|
|
7078
|
+
fill: visible ? chunkKXYSO6GC_cjs.paint(fill2, diagnostics, chart.id) : { kind: "none" },
|
|
7079
|
+
stroke: visible && strokeWidth > 0 ? chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id) : void 0,
|
|
6595
7080
|
strokeWidth: visible && strokeWidth > 0 ? strokeWidth : void 0,
|
|
6596
7081
|
pointerEvents: visible ? void 0 : "all"
|
|
6597
7082
|
}
|
|
@@ -6611,22 +7096,22 @@ function createLinePath(context, series, points, color, tension) {
|
|
|
6611
7096
|
order: nextOrder(),
|
|
6612
7097
|
bounds: gradient ? { minX: plot.x, maxX: plot.x + plot.width, minY: plot.y, maxY: plot.y + plot.height } : bounds,
|
|
6613
7098
|
detail: { of: "chartSeries", series: series.id, lineTension: tension || void 0 },
|
|
6614
|
-
d:
|
|
7099
|
+
d: chunkKXYSO6GC_cjs.linePathData(points, tension),
|
|
6615
7100
|
style: {
|
|
6616
7101
|
fill: { kind: "none" },
|
|
6617
|
-
stroke:
|
|
7102
|
+
stroke: chunkKXYSO6GC_cjs.paint(gradient ?? color, diagnostics, chart.id),
|
|
6618
7103
|
strokeWidth: series.strokeWidth ?? config?.lineWidth ?? 2,
|
|
6619
7104
|
dash: series.dash,
|
|
6620
7105
|
lineCap: config?.lineWidth === void 0 ? void 0 : "round",
|
|
6621
7106
|
lineJoin: "round",
|
|
6622
|
-
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } :
|
|
7107
|
+
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle)
|
|
6623
7108
|
}
|
|
6624
7109
|
};
|
|
6625
7110
|
}
|
|
6626
7111
|
|
|
6627
7112
|
// src/renderScene/charts/renderers/line/series.ts
|
|
6628
7113
|
function seriesColor(series, seriesIndex) {
|
|
6629
|
-
return
|
|
7114
|
+
return chunkKXYSO6GC_cjs.representativeColor(series.color, chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length]);
|
|
6630
7115
|
}
|
|
6631
7116
|
function renderLineSeriesArea(context, series, seriesIndex) {
|
|
6632
7117
|
const areaOpacity = context.chart.config?.areaOpacity;
|
|
@@ -6690,7 +7175,7 @@ function renderGridLines(context, layout) {
|
|
|
6690
7175
|
style: {
|
|
6691
7176
|
fill: { kind: "none" },
|
|
6692
7177
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
6693
|
-
strokeWidth:
|
|
7178
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1)
|
|
6694
7179
|
}
|
|
6695
7180
|
};
|
|
6696
7181
|
});
|
|
@@ -6698,7 +7183,7 @@ function renderGridLines(context, layout) {
|
|
|
6698
7183
|
function renderPercentageLabels(context, layout) {
|
|
6699
7184
|
const { chart, plot, bounds, nextOrder } = context;
|
|
6700
7185
|
return PERCENT_TICKS.map((percent) => ({
|
|
6701
|
-
...
|
|
7186
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
6702
7187
|
id: `chart-mekko-pct-${chart.id}-${percent}`,
|
|
6703
7188
|
order: nextOrder(),
|
|
6704
7189
|
bounds,
|
|
@@ -6730,7 +7215,7 @@ function renderMekkoColumnLabels(context, layout, columnIndex, column) {
|
|
|
6730
7215
|
function createTotalLabel(context, layout, columnIndex, column) {
|
|
6731
7216
|
const { chart, plot, bounds, nextOrder } = context;
|
|
6732
7217
|
return {
|
|
6733
|
-
...
|
|
7218
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
6734
7219
|
id: `chart-mekko-total-${chart.id}-${columnIndex}`,
|
|
6735
7220
|
order: nextOrder(),
|
|
6736
7221
|
bounds,
|
|
@@ -6751,7 +7236,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
6751
7236
|
const { chart, bounds, nextOrder } = context;
|
|
6752
7237
|
const { label, width } = column;
|
|
6753
7238
|
return {
|
|
6754
|
-
...
|
|
7239
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
6755
7240
|
id: `chart-mekko-col-label-${chart.id}-${columnIndex}`,
|
|
6756
7241
|
order: nextOrder(),
|
|
6757
7242
|
bounds,
|
|
@@ -6765,7 +7250,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
6765
7250
|
chart,
|
|
6766
7251
|
align: "center"
|
|
6767
7252
|
}),
|
|
6768
|
-
lines:
|
|
7253
|
+
lines: chunkKXYSO6GC_cjs.wrapText(label, width, layout.smallFontSize),
|
|
6769
7254
|
fontSize: layout.smallFontSize
|
|
6770
7255
|
};
|
|
6771
7256
|
}
|
|
@@ -6775,8 +7260,8 @@ function createMekkoLayout(context) {
|
|
|
6775
7260
|
const labels = mekkoColumnLabels(context);
|
|
6776
7261
|
const labelGutterWidth = context.showLabels ? 30 : 0;
|
|
6777
7262
|
const grid = createMekkoGrid(context, labelGutterWidth);
|
|
6778
|
-
const fontSize = Math.max(9,
|
|
6779
|
-
const columnGap = Math.max(0,
|
|
7263
|
+
const fontSize = Math.max(9, chunkKXYSO6GC_cjs.finite(context.chart.fontSize, 12));
|
|
7264
|
+
const columnGap = Math.max(0, chunkKXYSO6GC_cjs.finite(context.chart.config?.mekkoColumnGap, 4));
|
|
6780
7265
|
const smallFontSize = Math.max(8, fontSize - 1);
|
|
6781
7266
|
return {
|
|
6782
7267
|
columns: createMekkoColumns(context, grid, labels, columnGap),
|
|
@@ -6784,8 +7269,8 @@ function createMekkoLayout(context) {
|
|
|
6784
7269
|
smallFontSize,
|
|
6785
7270
|
labelGutterWidth,
|
|
6786
7271
|
columnGap,
|
|
6787
|
-
labelSize: Math.max(6,
|
|
6788
|
-
valueSize: Math.max(6,
|
|
7272
|
+
labelSize: Math.max(6, chunkKXYSO6GC_cjs.finite(context.chart.config?.mekkoLabelSize, smallFontSize)),
|
|
7273
|
+
valueSize: Math.max(6, chunkKXYSO6GC_cjs.finite(context.chart.config?.mekkoValueSize, smallFontSize)),
|
|
6789
7274
|
grid
|
|
6790
7275
|
};
|
|
6791
7276
|
}
|
|
@@ -6842,12 +7327,12 @@ function createColumnBackdrop(context, layout, columnIndex) {
|
|
|
6842
7327
|
id: `chart-mekko-column-backdrop-${chart.id}-${columnIndex}`,
|
|
6843
7328
|
order: nextOrder(),
|
|
6844
7329
|
bounds,
|
|
6845
|
-
d:
|
|
6846
|
-
style: { fill:
|
|
7330
|
+
d: chunkKXYSO6GC_cjs.barShapePath(column.x, layout.grid.y, column.width, layout.grid.height, cornerRadius),
|
|
7331
|
+
style: { fill: chunkKXYSO6GC_cjs.paint(chart.gridColor ?? "#e2e8f0", diagnostics, chart.id), opacity: BACKDROP_OPACITY }
|
|
6847
7332
|
};
|
|
6848
7333
|
}
|
|
6849
7334
|
function mekkoCornerRadius(context) {
|
|
6850
|
-
return Math.max(0,
|
|
7335
|
+
return Math.max(0, chunkKXYSO6GC_cjs.finite(context.chart.config?.barCornerRadius, 2));
|
|
6851
7336
|
}
|
|
6852
7337
|
function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
6853
7338
|
const segments = [];
|
|
@@ -6858,7 +7343,7 @@ function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
|
6858
7343
|
const height = (column.total > 0 ? value / column.total : 0) * column.height;
|
|
6859
7344
|
const y = column.y + cumulativeHeight;
|
|
6860
7345
|
cumulativeHeight += height;
|
|
6861
|
-
const color = series.color ??
|
|
7346
|
+
const color = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
6862
7347
|
segments.push({
|
|
6863
7348
|
columnIndex,
|
|
6864
7349
|
seriesId: series.id,
|
|
@@ -6881,12 +7366,12 @@ function renderSegment(context, layout, segment, nextColor) {
|
|
|
6881
7366
|
}
|
|
6882
7367
|
function createSegmentNode(context, segment, nextColor) {
|
|
6883
7368
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
6884
|
-
const shadow =
|
|
7369
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
6885
7370
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
6886
7371
|
const config = chart.config;
|
|
6887
7372
|
const radius = segment.isTop || config?.mekkoRoundAll ? mekkoCornerRadius(context) : 0;
|
|
6888
7373
|
const { x, y, width, height } = segment.frame;
|
|
6889
|
-
const segmentGap = Math.max(0,
|
|
7374
|
+
const segmentGap = Math.max(0, chunkKXYSO6GC_cjs.finite(config?.mekkoSegmentGap, 0));
|
|
6890
7375
|
const fallback = "#94a3b8";
|
|
6891
7376
|
const gradientBounds = {
|
|
6892
7377
|
minX: x + width / 2 - height / 2,
|
|
@@ -6898,20 +7383,20 @@ function createSegmentNode(context, segment, nextColor) {
|
|
|
6898
7383
|
kind: "linear-gradient",
|
|
6899
7384
|
angle: 90,
|
|
6900
7385
|
stops: [
|
|
6901
|
-
{ offset: 0, color:
|
|
6902
|
-
{ offset: 100, color:
|
|
7386
|
+
{ offset: 0, color: chunkKXYSO6GC_cjs.representativeColor(segment.color, fallback) },
|
|
7387
|
+
{ offset: 100, color: chunkKXYSO6GC_cjs.representativeColor(nextColor, fallback) }
|
|
6903
7388
|
]
|
|
6904
|
-
} :
|
|
7389
|
+
} : chunkKXYSO6GC_cjs.paint(segment.color, diagnostics, chart.id);
|
|
6905
7390
|
return {
|
|
6906
7391
|
type: "path",
|
|
6907
7392
|
id: `chart-mekko-seg-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
6908
7393
|
order: nextOrder(),
|
|
6909
7394
|
bounds: nextColor ? gradientBounds : bounds,
|
|
6910
|
-
d:
|
|
7395
|
+
d: chunkKXYSO6GC_cjs.barPath(x, y + segmentGap / 2, width, Math.max(0, height - segmentGap), radius, Boolean(config?.mekkoRoundAll)),
|
|
6911
7396
|
style: {
|
|
6912
7397
|
fill: fill2,
|
|
6913
7398
|
stroke: { kind: "solid", color: config?.mekkoSegmentStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
6914
|
-
strokeWidth:
|
|
7399
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(config?.mekkoSegmentStrokeWidth, chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1)),
|
|
6915
7400
|
shadow,
|
|
6916
7401
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
6917
7402
|
}
|
|
@@ -6927,17 +7412,17 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
6927
7412
|
const innerHeight = Math.max(1, height - 6);
|
|
6928
7413
|
const lineHeight = layout.labelSize * 1.2;
|
|
6929
7414
|
const valueHeight = layout.valueSize * 1.2;
|
|
6930
|
-
const labelLines =
|
|
6931
|
-
(line) =>
|
|
7415
|
+
const labelLines = chunkKXYSO6GC_cjs.wrapText(segment.seriesLabel, innerWidth, layout.labelSize).map(
|
|
7416
|
+
(line) => chunkKXYSO6GC_cjs.ellipsizeToWidth(line, innerWidth, layout.labelSize, true)
|
|
6932
7417
|
);
|
|
6933
7418
|
if (labelLines.length * lineHeight + valueHeight > innerHeight) {
|
|
6934
7419
|
return [];
|
|
6935
7420
|
}
|
|
6936
|
-
const textColor = chart.config?.mekkoTextColor ??
|
|
7421
|
+
const textColor = chart.config?.mekkoTextColor ?? chunkKXYSO6GC_cjs.contrastTextColor(chunkKXYSO6GC_cjs.representativeColor(segment.color, "#ffffff"));
|
|
6937
7422
|
const columnTotal = layout.columns[segment.columnIndex]?.total ?? 0;
|
|
6938
7423
|
const valueText = chart.config?.mekkoValueFormat === "percent" ? `${columnTotal > 0 ? Math.round(segment.value / columnTotal * 100) : 0}%` : String(segment.value);
|
|
6939
7424
|
const label = {
|
|
6940
|
-
...
|
|
7425
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
6941
7426
|
id: `chart-mekko-seg-label-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
6942
7427
|
order: nextOrder(),
|
|
6943
7428
|
bounds,
|
|
@@ -6951,7 +7436,7 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
6951
7436
|
color: textColor
|
|
6952
7437
|
};
|
|
6953
7438
|
const valueNode = {
|
|
6954
|
-
...
|
|
7439
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
6955
7440
|
id: `chart-mekko-seg-value-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
6956
7441
|
order: nextOrder(),
|
|
6957
7442
|
bounds,
|
|
@@ -6984,7 +7469,7 @@ function renderMekko(context) {
|
|
|
6984
7469
|
|
|
6985
7470
|
// src/renderScene/charts/renderers/pie/center.ts
|
|
6986
7471
|
function fill(template, chart) {
|
|
6987
|
-
const values = chart.series.map((series) => Math.max(0,
|
|
7472
|
+
const values = chart.series.map((series) => Math.max(0, chunkKXYSO6GC_cjs.finite(series.values[0], 0)));
|
|
6988
7473
|
const total = values.reduce((sum, value) => sum + value, 0);
|
|
6989
7474
|
const first = values[0] ?? 0;
|
|
6990
7475
|
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 ?? "");
|
|
@@ -6996,7 +7481,7 @@ function renderPieCenter(context, geometry) {
|
|
|
6996
7481
|
return [];
|
|
6997
7482
|
}
|
|
6998
7483
|
const lines = fill(template, chart).split(/\\n|\n/);
|
|
6999
|
-
const fontSize =
|
|
7484
|
+
const fontSize = chunkKXYSO6GC_cjs.finite(chart.config?.pieCenterSize, Math.max(14, Math.min(40, geometry.outerRadius * 0.3)));
|
|
7000
7485
|
const lineHeight = fontSize * 1.2;
|
|
7001
7486
|
const width = Math.max(40, (geometry.innerRadius > 0 ? geometry.innerRadius : geometry.outerRadius * 0.6) * 2);
|
|
7002
7487
|
const text = {
|
|
@@ -7009,7 +7494,7 @@ function renderPieCenter(context, geometry) {
|
|
|
7009
7494
|
width,
|
|
7010
7495
|
height: lineHeight * lines.length,
|
|
7011
7496
|
lines,
|
|
7012
|
-
fontFamily: chart.fontFamily ??
|
|
7497
|
+
fontFamily: chart.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
7013
7498
|
fontSize,
|
|
7014
7499
|
fontWeight: "bold",
|
|
7015
7500
|
align: "center",
|
|
@@ -7029,14 +7514,14 @@ var radians = (degrees) => degrees * Math.PI / 180;
|
|
|
7029
7514
|
function renderPieSlices(context, geometry) {
|
|
7030
7515
|
const config = context.chart.config;
|
|
7031
7516
|
const marks = createPieSliceMarks(context.chart.series, geometry.total, {
|
|
7032
|
-
start: TOP + radians(
|
|
7033
|
-
sweep: Math.min(FULL, Math.max(radians(1), radians(
|
|
7034
|
-
explode: Math.max(0,
|
|
7517
|
+
start: TOP + radians(chunkKXYSO6GC_cjs.finite(config?.pieStartAngle, 0)),
|
|
7518
|
+
sweep: Math.min(FULL, Math.max(radians(1), radians(chunkKXYSO6GC_cjs.finite(config?.pieSweep, 360)))),
|
|
7519
|
+
explode: Math.max(0, chunkKXYSO6GC_cjs.finite(config?.pieExplode, 0))
|
|
7035
7520
|
});
|
|
7036
7521
|
const gapPx = config?.pieSliceGap ?? 0;
|
|
7037
7522
|
return [
|
|
7038
7523
|
...marks.flatMap((mark) => createSliceNodes(context, shiftGeometry(geometry, mark), mark, gapPx)),
|
|
7039
|
-
...
|
|
7524
|
+
...chunkKXYSO6GC_cjs.renderPieLabels(
|
|
7040
7525
|
context,
|
|
7041
7526
|
geometry,
|
|
7042
7527
|
marks.map((mark) => ({
|
|
@@ -7068,20 +7553,20 @@ function createPieSliceMarks(seriesList, total, layout) {
|
|
|
7068
7553
|
const marks = [];
|
|
7069
7554
|
let angle = layout.start;
|
|
7070
7555
|
seriesList.forEach((series, seriesIndex) => {
|
|
7071
|
-
const value = Math.max(0,
|
|
7556
|
+
const value = Math.max(0, chunkKXYSO6GC_cjs.finite(series.values[0], 0));
|
|
7072
7557
|
const sweep = value / total * layout.sweep;
|
|
7073
7558
|
marks.push({
|
|
7074
7559
|
seriesId: series.id,
|
|
7075
7560
|
label: series.label,
|
|
7076
|
-
color: series.color ??
|
|
7561
|
+
color: series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length],
|
|
7077
7562
|
stroke: series.stroke,
|
|
7078
7563
|
strokeWidth: series.strokeWidth,
|
|
7079
7564
|
value,
|
|
7080
7565
|
share: value / total,
|
|
7081
7566
|
angles: { start: angle, end: angle + Math.min(sweep, layout.sweep >= FULL ? MAXIMUM_SWEEP : layout.sweep) },
|
|
7082
|
-
explode: Math.max(0,
|
|
7083
|
-
labelOffsetX:
|
|
7084
|
-
labelOffsetY:
|
|
7567
|
+
explode: Math.max(0, chunkKXYSO6GC_cjs.finite(series.offset, layout.explode)),
|
|
7568
|
+
labelOffsetX: chunkKXYSO6GC_cjs.finite(series.labelOffsetX, 0),
|
|
7569
|
+
labelOffsetY: chunkKXYSO6GC_cjs.finite(series.labelOffsetY, 0)
|
|
7085
7570
|
});
|
|
7086
7571
|
angle += sweep;
|
|
7087
7572
|
});
|
|
@@ -7104,14 +7589,14 @@ function pieOuterShadow(shadow, gapPx) {
|
|
|
7104
7589
|
function sliceCornerRadius(geometry, mark, gapPx) {
|
|
7105
7590
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
7106
7591
|
const rawSweep = mark.angles.end - mark.angles.start;
|
|
7107
|
-
const usesInnerArc =
|
|
7108
|
-
const gapSweep = 2 *
|
|
7592
|
+
const usesInnerArc = chunkKXYSO6GC_cjs.pieUsesInnerArc(geometry, mark.angles, gapPx);
|
|
7593
|
+
const gapSweep = 2 * chunkKXYSO6GC_cjs.gapInsetAngle(halfGap, geometry.outerRadius);
|
|
7109
7594
|
const availableSweep = Math.max(0, rawSweep - gapSweep);
|
|
7110
7595
|
return Math.min(
|
|
7111
7596
|
geometry.cornerRadius,
|
|
7112
|
-
usesInnerArc ?
|
|
7597
|
+
usesInnerArc ? chunkKXYSO6GC_cjs.maxPieCornerRadius(geometry.outerRadius, geometry.innerRadius, availableSweep) : chunkKXYSO6GC_cjs.maxApexCornerRadius(
|
|
7113
7598
|
geometry.outerRadius,
|
|
7114
|
-
|
|
7599
|
+
chunkKXYSO6GC_cjs.pieApexRadius(halfGap, rawSweep, geometry.outerRadius),
|
|
7115
7600
|
availableSweep
|
|
7116
7601
|
)
|
|
7117
7602
|
);
|
|
@@ -7124,14 +7609,14 @@ function sliceStroke(context, mark) {
|
|
|
7124
7609
|
}
|
|
7125
7610
|
return {
|
|
7126
7611
|
stroke: { kind: "solid", color: strokeColor },
|
|
7127
|
-
strokeWidth:
|
|
7612
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(mark.strokeWidth, chunkKXYSO6GC_cjs.finite(config?.pieStrokeWidth, 1))
|
|
7128
7613
|
};
|
|
7129
7614
|
}
|
|
7130
7615
|
function createSliceNodes(context, geometry, mark, gapPx) {
|
|
7131
7616
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
7132
|
-
const fill2 =
|
|
7133
|
-
const slicePath =
|
|
7134
|
-
const shadow =
|
|
7617
|
+
const fill2 = chunkKXYSO6GC_cjs.paint(mark.color, diagnostics, chart.id);
|
|
7618
|
+
const slicePath = chunkKXYSO6GC_cjs.createPieSlicePath(geometry, mark.angles, sliceCornerRadius(geometry, mark, gapPx), gapPx);
|
|
7619
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7135
7620
|
const strokeStyle = sliceStroke(context, mark);
|
|
7136
7621
|
const glow = chart.config?.pieGlow;
|
|
7137
7622
|
const shadowCaster = shadow ? {
|
|
@@ -7162,12 +7647,12 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
7162
7647
|
pieEnd: mark.angles.end,
|
|
7163
7648
|
pieValue: mark.value
|
|
7164
7649
|
},
|
|
7165
|
-
prop:
|
|
7650
|
+
prop: chunkKXYSO6GC_cjs.seriesValueProp(mark.seriesId, 0),
|
|
7166
7651
|
style: {
|
|
7167
7652
|
fill: fill2,
|
|
7168
7653
|
...strokeStyle,
|
|
7169
7654
|
innerShadow: shadow,
|
|
7170
|
-
shadow: glow ? { color:
|
|
7655
|
+
shadow: glow ? { color: chunkKXYSO6GC_cjs.representativeColor(mark.color, "#ffffff"), opacity: 0.85, blur: glow, dx: 0, dy: 0 } : void 0
|
|
7171
7656
|
}
|
|
7172
7657
|
};
|
|
7173
7658
|
return shadowCaster ? [shadowCaster, slice] : [slice];
|
|
@@ -7175,7 +7660,7 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
7175
7660
|
|
|
7176
7661
|
// src/renderScene/charts/renderers/pie.ts
|
|
7177
7662
|
function renderPie(context) {
|
|
7178
|
-
const geometry =
|
|
7663
|
+
const geometry = chunkKXYSO6GC_cjs.createPieGeometry(context);
|
|
7179
7664
|
return [...renderPieSlices(context, geometry), ...renderPieCenter(context, geometry)];
|
|
7180
7665
|
}
|
|
7181
7666
|
|
|
@@ -7192,18 +7677,18 @@ var OUTSIDE_FALLBACK_COLOR = "#334155";
|
|
|
7192
7677
|
function layoutOf(context) {
|
|
7193
7678
|
const { chart, plot } = context;
|
|
7194
7679
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
7195
|
-
const axisMin =
|
|
7680
|
+
const axisMin = chunkKXYSO6GC_cjs.finite(chart.axisY.min, 0);
|
|
7196
7681
|
return {
|
|
7197
7682
|
centerX: plot.x + plot.width / 2,
|
|
7198
7683
|
centerY: plot.y + plot.height / 2,
|
|
7199
7684
|
maxRadius,
|
|
7200
|
-
innerRadius: Math.max(0, Math.min(
|
|
7201
|
-
cornerRadius: Math.max(0,
|
|
7202
|
-
gapPx: Math.max(0,
|
|
7685
|
+
innerRadius: Math.max(0, Math.min(chunkKXYSO6GC_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1)),
|
|
7686
|
+
cornerRadius: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.pieCornerRadius, 0)),
|
|
7687
|
+
gapPx: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.pieSliceGap, 0)),
|
|
7203
7688
|
axisMin,
|
|
7204
|
-
range:
|
|
7689
|
+
range: chunkKXYSO6GC_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
7205
7690
|
sweep: chart.series.length > 0 ? Math.PI * 2 / chart.series.length : 0,
|
|
7206
|
-
start: TOP2 +
|
|
7691
|
+
start: TOP2 + chunkKXYSO6GC_cjs.finite(chart.config?.pieStartAngle, 0) * Math.PI / 180
|
|
7207
7692
|
};
|
|
7208
7693
|
}
|
|
7209
7694
|
function clampedCorner(layout, outerRadius, angles) {
|
|
@@ -7211,19 +7696,19 @@ function clampedCorner(layout, outerRadius, angles) {
|
|
|
7211
7696
|
const geometry = { centerX, centerY, outerRadius, innerRadius };
|
|
7212
7697
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
7213
7698
|
const rawSweep = angles.end - angles.start;
|
|
7214
|
-
const availableSweep = Math.max(0, rawSweep - 2 *
|
|
7215
|
-
if (
|
|
7216
|
-
return Math.min(cornerRadius,
|
|
7699
|
+
const availableSweep = Math.max(0, rawSweep - 2 * chunkKXYSO6GC_cjs.gapInsetAngle(halfGap, outerRadius));
|
|
7700
|
+
if (chunkKXYSO6GC_cjs.pieUsesInnerArc(geometry, angles, gapPx)) {
|
|
7701
|
+
return Math.min(cornerRadius, chunkKXYSO6GC_cjs.maxPieCornerRadius(outerRadius, innerRadius, availableSweep));
|
|
7217
7702
|
}
|
|
7218
|
-
const apexRadius =
|
|
7219
|
-
return Math.min(cornerRadius,
|
|
7703
|
+
const apexRadius = chunkKXYSO6GC_cjs.pieApexRadius(halfGap, rawSweep, outerRadius);
|
|
7704
|
+
return Math.min(cornerRadius, chunkKXYSO6GC_cjs.maxApexCornerRadius(outerRadius, apexRadius, availableSweep));
|
|
7220
7705
|
}
|
|
7221
7706
|
function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor) {
|
|
7222
7707
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
7223
7708
|
const { centerX, centerY, innerRadius, maxRadius, gapPx } = layout;
|
|
7224
|
-
const color =
|
|
7225
|
-
const shadow =
|
|
7226
|
-
const trackPath =
|
|
7709
|
+
const color = chunkKXYSO6GC_cjs.paint(rawColor, diagnostics, chart.id);
|
|
7710
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7711
|
+
const trackPath = chunkKXYSO6GC_cjs.createPieSlicePath(
|
|
7227
7712
|
{ centerX, centerY, outerRadius: maxRadius, innerRadius },
|
|
7228
7713
|
angles,
|
|
7229
7714
|
clampedCorner(layout, maxRadius, angles),
|
|
@@ -7236,12 +7721,12 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
7236
7721
|
bounds,
|
|
7237
7722
|
d: trackPath,
|
|
7238
7723
|
style: {
|
|
7239
|
-
fill:
|
|
7724
|
+
fill: chunkKXYSO6GC_cjs.paint(chart.gridColor ?? TRACK_COLOR_FALLBACK, diagnostics, chart.id),
|
|
7240
7725
|
opacity: chart.config?.polarTrackOpacity,
|
|
7241
7726
|
...trackStroke(context)
|
|
7242
7727
|
}
|
|
7243
7728
|
};
|
|
7244
|
-
const wedgePath =
|
|
7729
|
+
const wedgePath = chunkKXYSO6GC_cjs.createPieSlicePath(
|
|
7245
7730
|
{ centerX, centerY, outerRadius, innerRadius },
|
|
7246
7731
|
angles,
|
|
7247
7732
|
clampedCorner(layout, outerRadius, angles),
|
|
@@ -7270,7 +7755,7 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
7270
7755
|
pieEnd: angles.end,
|
|
7271
7756
|
pieValue: value
|
|
7272
7757
|
},
|
|
7273
|
-
prop:
|
|
7758
|
+
prop: chunkKXYSO6GC_cjs.seriesValueProp(series.id, 0),
|
|
7274
7759
|
style: { fill: color, innerShadow: shadow, ...wedgeStroke(context) }
|
|
7275
7760
|
};
|
|
7276
7761
|
return shadowCaster ? [track, shadowCaster, wedge] : [track, wedge];
|
|
@@ -7283,7 +7768,7 @@ function trackStroke(context) {
|
|
|
7283
7768
|
const dash = (config.polarTrackDash ?? "").split(/[ ,]+/).map(Number).filter((part) => Number.isFinite(part) && part > 0);
|
|
7284
7769
|
return {
|
|
7285
7770
|
stroke: { kind: "solid", color: config.polarTrackStroke },
|
|
7286
|
-
strokeWidth:
|
|
7771
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(config.polarTrackStrokeWidth, 1),
|
|
7287
7772
|
dash: dash.length > 0 ? dash : void 0
|
|
7288
7773
|
};
|
|
7289
7774
|
}
|
|
@@ -7294,7 +7779,7 @@ function wedgeStroke(context) {
|
|
|
7294
7779
|
}
|
|
7295
7780
|
return {
|
|
7296
7781
|
stroke: { kind: "solid", color: config.pieStroke },
|
|
7297
|
-
strokeWidth:
|
|
7782
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(config.pieStrokeWidth, 1)
|
|
7298
7783
|
};
|
|
7299
7784
|
}
|
|
7300
7785
|
function ringNodes(context, layout) {
|
|
@@ -7302,7 +7787,7 @@ function ringNodes(context, layout) {
|
|
|
7302
7787
|
if (!chart.config?.polarRings || layout.range <= 0) {
|
|
7303
7788
|
return [];
|
|
7304
7789
|
}
|
|
7305
|
-
return
|
|
7790
|
+
return chunkKXYSO6GC_cjs.chartTicks(chart.axisY).filter((tick) => tick > layout.axisMin && tick < layout.axisMin + layout.range).map((tick) => {
|
|
7306
7791
|
const radius = layout.innerRadius + (layout.maxRadius - layout.innerRadius) * (tick - layout.axisMin) / layout.range;
|
|
7307
7792
|
return {
|
|
7308
7793
|
type: "ellipse",
|
|
@@ -7316,7 +7801,7 @@ function ringNodes(context, layout) {
|
|
|
7316
7801
|
style: {
|
|
7317
7802
|
fill: { kind: "none" },
|
|
7318
7803
|
stroke: { kind: "solid", color: chart.textColor ?? "#334155" },
|
|
7319
|
-
strokeWidth:
|
|
7804
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1),
|
|
7320
7805
|
opacity: 0.25
|
|
7321
7806
|
}
|
|
7322
7807
|
};
|
|
@@ -7328,10 +7813,10 @@ function renderPolarArea(context) {
|
|
|
7328
7813
|
const showLabels = context.showLabels && sweep >= MIN_LABEL_SWEEP;
|
|
7329
7814
|
const wedges = context.chart.series.flatMap((series, index) => {
|
|
7330
7815
|
const angles = { start: start + index * sweep, end: start + (index + 1) * sweep };
|
|
7331
|
-
const value = Math.max(0,
|
|
7816
|
+
const value = Math.max(0, chunkKXYSO6GC_cjs.finite(series.values[0], 0));
|
|
7332
7817
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
7333
7818
|
const outerRadius = Math.max(innerRadius + 1, innerRadius + (maxRadius - innerRadius) * fraction);
|
|
7334
|
-
const rawColor = series.color ??
|
|
7819
|
+
const rawColor = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[index % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
7335
7820
|
const nodes = wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor);
|
|
7336
7821
|
if (!showLabels) {
|
|
7337
7822
|
return nodes;
|
|
@@ -7342,10 +7827,10 @@ function renderPolarArea(context) {
|
|
|
7342
7827
|
return [...wedges, ...ringNodes(context, layout)];
|
|
7343
7828
|
}
|
|
7344
7829
|
function labelSizes(chart) {
|
|
7345
|
-
const base = Math.max(9,
|
|
7830
|
+
const base = Math.max(9, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12));
|
|
7346
7831
|
return {
|
|
7347
|
-
nameSize: Math.max(6,
|
|
7348
|
-
valueSize: Math.max(6,
|
|
7832
|
+
nameSize: Math.max(6, chunkKXYSO6GC_cjs.finite(chart.config?.polarNameSize, base)),
|
|
7833
|
+
valueSize: Math.max(6, chunkKXYSO6GC_cjs.finite(chart.config?.polarValueSize, base))
|
|
7349
7834
|
};
|
|
7350
7835
|
}
|
|
7351
7836
|
function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
@@ -7353,8 +7838,8 @@ function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
|
7353
7838
|
const { nameSize, valueSize } = labelSizes(context.chart);
|
|
7354
7839
|
const lineHeight = (nameSize + valueSize) * 1.2 / 2;
|
|
7355
7840
|
const ringThickness = geometry.outerRadius - geometry.innerRadius;
|
|
7356
|
-
const labelOffsetX =
|
|
7357
|
-
const labelOffsetY =
|
|
7841
|
+
const labelOffsetX = chunkKXYSO6GC_cjs.finite(series.labelOffsetX, 0);
|
|
7842
|
+
const labelOffsetY = chunkKXYSO6GC_cjs.finite(series.labelOffsetY, 0);
|
|
7358
7843
|
const hasManualOffset = labelOffsetX !== 0 || labelOffsetY !== 0;
|
|
7359
7844
|
const tooThin = ringThickness < lineHeight * 2 + 6;
|
|
7360
7845
|
const chordWidth = 2 * geometry.outerRadius * Math.sin(Math.abs(angles.end - angles.start) / 2);
|
|
@@ -7364,11 +7849,11 @@ function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
|
7364
7849
|
return void 0;
|
|
7365
7850
|
}
|
|
7366
7851
|
const outside = hasManualOffset || !fitsInline;
|
|
7367
|
-
const tickStart =
|
|
7368
|
-
const point = outside ? hasManualOffset ? addOffset(
|
|
7369
|
-
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor :
|
|
7370
|
-
|
|
7371
|
-
|
|
7852
|
+
const tickStart = chunkKXYSO6GC_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + LEADER_INSET);
|
|
7853
|
+
const point = outside ? hasManualOffset ? addOffset(chunkKXYSO6GC_cjs.pieArcPoint(geometry, mid, geometry.outerRadius), labelOffsetX, labelOffsetY) : chunkKXYSO6GC_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + OUTSIDE_GAP) : chunkKXYSO6GC_cjs.pieArcPoint(geometry, mid, geometry.innerRadius + ringThickness * LABEL_RADIUS_FRACTION);
|
|
7854
|
+
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor : chunkKXYSO6GC_cjs.sameHueTint(chunkKXYSO6GC_cjs.representativeColor(fillColor, OUTSIDE_FALLBACK_COLOR), OUTSIDE_TINT_LIGHTNESS) ?? OUTSIDE_FALLBACK_COLOR : chunkKXYSO6GC_cjs.sameHueContrastColor(
|
|
7855
|
+
chunkKXYSO6GC_cjs.representativeColor(fillColor, "#0f172a"),
|
|
7856
|
+
chunkKXYSO6GC_cjs.contrastTextColor(chunkKXYSO6GC_cjs.representativeColor(fillColor, "#0f172a"))
|
|
7372
7857
|
);
|
|
7373
7858
|
return { point, color, outside, mid, tickStart };
|
|
7374
7859
|
}
|
|
@@ -7381,7 +7866,7 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7381
7866
|
const { point, color, outside, mid, tickStart } = placement;
|
|
7382
7867
|
const { nameSize, valueSize } = labelSizes(chart);
|
|
7383
7868
|
const lineHeight = Math.max(nameSize, valueSize) * 1.2;
|
|
7384
|
-
const tickEnd = outside ?
|
|
7869
|
+
const tickEnd = outside ? chunkKXYSO6GC_cjs.clipSegmentToRect(tickStart, point, LABEL_WIDTH / 2, lineHeight) : tickStart;
|
|
7385
7870
|
const tick = {
|
|
7386
7871
|
type: "path",
|
|
7387
7872
|
id: `chart-polar-area-label-tick-${chart.id}-${series.id}`,
|
|
@@ -7403,7 +7888,7 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7403
7888
|
bounds,
|
|
7404
7889
|
x: point.x - LABEL_WIDTH / 2,
|
|
7405
7890
|
width: LABEL_WIDTH,
|
|
7406
|
-
fontFamily: chart.fontFamily ??
|
|
7891
|
+
fontFamily: chart.fontFamily ?? chunkKXYSO6GC_cjs.DEFAULT_FONT,
|
|
7407
7892
|
align: "center",
|
|
7408
7893
|
verticalAlign: "middle",
|
|
7409
7894
|
lineHeight: 1.2,
|
|
@@ -7426,7 +7911,7 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7426
7911
|
lines: [series.label],
|
|
7427
7912
|
fontWeight: valueFirst ? "normal" : "bold",
|
|
7428
7913
|
detail,
|
|
7429
|
-
prop:
|
|
7914
|
+
prop: chunkKXYSO6GC_cjs.seriesLabelProp(series.id)
|
|
7430
7915
|
};
|
|
7431
7916
|
const valueText = {
|
|
7432
7917
|
type: "text",
|
|
@@ -7436,10 +7921,10 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7436
7921
|
y: valueY,
|
|
7437
7922
|
height: valueSize * 1.2,
|
|
7438
7923
|
fontSize: valueSize,
|
|
7439
|
-
lines: [
|
|
7924
|
+
lines: [chunkKXYSO6GC_cjs.formatFieldValue(value)],
|
|
7440
7925
|
fontWeight: valueFirst ? "bold" : "normal",
|
|
7441
7926
|
detail,
|
|
7442
|
-
prop:
|
|
7927
|
+
prop: chunkKXYSO6GC_cjs.seriesValueProp(series.id, 0),
|
|
7443
7928
|
propKind: "value"
|
|
7444
7929
|
};
|
|
7445
7930
|
return [tick, nameText, valueText];
|
|
@@ -7457,10 +7942,10 @@ function radarFrameFor(context) {
|
|
|
7457
7942
|
return {
|
|
7458
7943
|
centerX: plot.x + plot.width / 2,
|
|
7459
7944
|
centerY: plot.y + plot.height / 2,
|
|
7460
|
-
radius:
|
|
7945
|
+
radius: chunkKXYSO6GC_cjs.radarRadius(plot.width, plot.height, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12), context.showLabels),
|
|
7461
7946
|
min: chart.axisY.min,
|
|
7462
7947
|
max: chart.axisY.max,
|
|
7463
|
-
count:
|
|
7948
|
+
count: chunkKXYSO6GC_cjs.radarCategoryCount(configuredCount, dataCount),
|
|
7464
7949
|
curved: chart.chartType === "radial",
|
|
7465
7950
|
tension: chart.config?.radarTension
|
|
7466
7951
|
};
|
|
@@ -7470,7 +7955,7 @@ function createRadarGeometry(context) {
|
|
|
7470
7955
|
const configuredCategories = chart.config?.categories?.filter(Boolean) ?? [];
|
|
7471
7956
|
const frame = radarFrameFor(context);
|
|
7472
7957
|
const categories = createCategories(configuredCategories, frame.count);
|
|
7473
|
-
const pointAt = (pointRadius, pointIndex) =>
|
|
7958
|
+
const pointAt = (pointRadius, pointIndex) => chunkKXYSO6GC_cjs.radarPointAt(frame, pointIndex, pointRadius);
|
|
7474
7959
|
return {
|
|
7475
7960
|
circular: frame.curved,
|
|
7476
7961
|
areaOpacity: Math.max(0, Math.min(1, chart.config?.areaOpacity ?? 0.16)),
|
|
@@ -7482,9 +7967,9 @@ function createRadarGeometry(context) {
|
|
|
7482
7967
|
centerX: frame.centerX,
|
|
7483
7968
|
centerY: frame.centerY,
|
|
7484
7969
|
radius: frame.radius,
|
|
7485
|
-
radiusForValue: (value) =>
|
|
7970
|
+
radiusForValue: (value) => chunkKXYSO6GC_cjs.radarRadiusForValue(frame, value),
|
|
7486
7971
|
pointAt,
|
|
7487
|
-
polygonPath: (pointRadius) =>
|
|
7972
|
+
polygonPath: (pointRadius) => chunkKXYSO6GC_cjs.radarSeriesPath(
|
|
7488
7973
|
categories.map((_, index) => pointAt(pointRadius, index)),
|
|
7489
7974
|
false
|
|
7490
7975
|
)
|
|
@@ -7505,7 +7990,7 @@ function renderRadarGrid(context, geometry) {
|
|
|
7505
7990
|
return [...renderRings(context, geometry), ...geometry.showSpokes ? renderSpokes(context, geometry) : []];
|
|
7506
7991
|
}
|
|
7507
7992
|
function renderRings(context, geometry) {
|
|
7508
|
-
return
|
|
7993
|
+
return chunkKXYSO6GC_cjs.chartTicks(context.chart.axisY).filter((tick) => tick > context.chart.axisY.min).map((tick) => createRingNode(context, geometry, tick));
|
|
7509
7994
|
}
|
|
7510
7995
|
function createRingNode(context, geometry, tick) {
|
|
7511
7996
|
const { chart, bounds, nextOrder } = context;
|
|
@@ -7513,7 +7998,7 @@ function createRingNode(context, geometry, tick) {
|
|
|
7513
7998
|
const style = {
|
|
7514
7999
|
fill: { kind: "none" },
|
|
7515
8000
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
7516
|
-
strokeWidth:
|
|
8001
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1)
|
|
7517
8002
|
};
|
|
7518
8003
|
if (geometry.circular) {
|
|
7519
8004
|
return {
|
|
@@ -7550,7 +8035,7 @@ function renderSpokes(context, geometry) {
|
|
|
7550
8035
|
style: {
|
|
7551
8036
|
fill: { kind: "none" },
|
|
7552
8037
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
7553
|
-
strokeWidth:
|
|
8038
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1)
|
|
7554
8039
|
}
|
|
7555
8040
|
};
|
|
7556
8041
|
});
|
|
@@ -7570,7 +8055,7 @@ function createCategoryLabel(context, geometry, category, categoryIndex) {
|
|
|
7570
8055
|
const labelPoint = geometry.pointAt(geometry.radius + 10, categoryIndex);
|
|
7571
8056
|
const horizontalOffset = labelPoint.x - geometry.centerX;
|
|
7572
8057
|
const width = Math.max(64, Math.min(120, plot.width / 3));
|
|
7573
|
-
return
|
|
8058
|
+
return chunkKXYSO6GC_cjs.chartText({
|
|
7574
8059
|
id: `chart-radar-label-${chart.id}-${categoryIndex}`,
|
|
7575
8060
|
order: nextOrder(),
|
|
7576
8061
|
bounds,
|
|
@@ -7608,9 +8093,9 @@ function renderRadarSeries(context, geometry) {
|
|
|
7608
8093
|
return nodes;
|
|
7609
8094
|
}
|
|
7610
8095
|
function renderSeries(context, geometry, series, seriesIndex) {
|
|
7611
|
-
const color = series.color ??
|
|
8096
|
+
const color = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
7612
8097
|
const points = seriesPoints(series, context, geometry);
|
|
7613
|
-
const path =
|
|
8098
|
+
const path = chunkKXYSO6GC_cjs.radarSeriesPath(points, geometry.circular, geometry.tension);
|
|
7614
8099
|
return [
|
|
7615
8100
|
createSeriesFill(context, geometry, series, path, color),
|
|
7616
8101
|
...geometry.strokeWidth > 0 ? [createSeriesStroke(context, geometry, series, path, color)] : [],
|
|
@@ -7633,7 +8118,7 @@ function createSeriesFill(context, geometry, series, path, color) {
|
|
|
7633
8118
|
d: path,
|
|
7634
8119
|
detail: { of: "chartSeries", series: series.id },
|
|
7635
8120
|
style: {
|
|
7636
|
-
fill:
|
|
8121
|
+
fill: chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id),
|
|
7637
8122
|
stroke: { kind: "none" },
|
|
7638
8123
|
opacity: Math.max(0, Math.min(1, series.opacity ?? geometry.areaOpacity))
|
|
7639
8124
|
}
|
|
@@ -7650,10 +8135,10 @@ function createSeriesStroke(context, geometry, series, path, color) {
|
|
|
7650
8135
|
detail: { of: "chartSeries", series: series.id },
|
|
7651
8136
|
style: {
|
|
7652
8137
|
fill: { kind: "none" },
|
|
7653
|
-
stroke:
|
|
8138
|
+
stroke: chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id),
|
|
7654
8139
|
strokeWidth: geometry.strokeWidth,
|
|
7655
8140
|
lineJoin: "round",
|
|
7656
|
-
shadow:
|
|
8141
|
+
shadow: chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle)
|
|
7657
8142
|
}
|
|
7658
8143
|
};
|
|
7659
8144
|
}
|
|
@@ -7669,8 +8154,8 @@ function createSeriesPoints(context, geometry, series, points, color) {
|
|
|
7669
8154
|
rx: geometry.pointSize,
|
|
7670
8155
|
ry: geometry.pointSize,
|
|
7671
8156
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex, mark: "radar-vertex" },
|
|
7672
|
-
prop:
|
|
7673
|
-
style: { fill:
|
|
8157
|
+
prop: chunkKXYSO6GC_cjs.seriesValueProp(series.id, pointIndex),
|
|
8158
|
+
style: { fill: chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id) }
|
|
7674
8159
|
}));
|
|
7675
8160
|
}
|
|
7676
8161
|
|
|
@@ -7724,25 +8209,25 @@ function ringProgressPath(cx, cy, r, sweep, from) {
|
|
|
7724
8209
|
}
|
|
7725
8210
|
function layoutOf2(context) {
|
|
7726
8211
|
const { chart, plot } = context;
|
|
7727
|
-
const axisMin =
|
|
8212
|
+
const axisMin = chunkKXYSO6GC_cjs.finite(chart.axisY.min, 0);
|
|
7728
8213
|
return {
|
|
7729
8214
|
centerX: plot.x + plot.width / 2,
|
|
7730
8215
|
centerY: plot.y + plot.height / 2,
|
|
7731
8216
|
outerRadius: Math.max(1, Math.min(plot.width, plot.height) / 2 - 4),
|
|
7732
|
-
ringThickness: Math.max(1,
|
|
7733
|
-
ringGap: Math.max(0,
|
|
8217
|
+
ringThickness: Math.max(1, chunkKXYSO6GC_cjs.finite(chart.config?.ringThickness, DEFAULT_RING_THICKNESS)),
|
|
8218
|
+
ringGap: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.ringGap, DEFAULT_RING_GAP)),
|
|
7734
8219
|
axisMin,
|
|
7735
|
-
range:
|
|
7736
|
-
start: TOP3 +
|
|
7737
|
-
total: Math.min(360, Math.max(1,
|
|
7738
|
-
trackOpacity: Math.min(1, Math.max(0,
|
|
8220
|
+
range: chunkKXYSO6GC_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
8221
|
+
start: TOP3 + chunkKXYSO6GC_cjs.finite(chart.config?.ringStartAngle, 0) * Math.PI / 180,
|
|
8222
|
+
total: Math.min(360, Math.max(1, chunkKXYSO6GC_cjs.finite(chart.config?.ringSweep, 360))) * Math.PI / 180,
|
|
8223
|
+
trackOpacity: Math.min(1, Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.ringTrackOpacity, TRACK_OPACITY))),
|
|
7739
8224
|
cap: chart.config?.ringCap ?? "round"
|
|
7740
8225
|
};
|
|
7741
8226
|
}
|
|
7742
8227
|
function ringEndShadows(context, layout, series, radius, sweep, color) {
|
|
7743
8228
|
const { chart, bounds, nextOrder } = context;
|
|
7744
8229
|
const { centerX, centerY, ringThickness, start } = layout;
|
|
7745
|
-
const shadow =
|
|
8230
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7746
8231
|
const isFullCircle = sweep >= Math.PI * 2 - FULL_SWEEP_EPSILON;
|
|
7747
8232
|
if (!shadow || isFullCircle) {
|
|
7748
8233
|
return [];
|
|
@@ -7780,8 +8265,8 @@ function ringNodes2(context, layout, series, index) {
|
|
|
7780
8265
|
if (radius <= ringThickness / 2) {
|
|
7781
8266
|
return [];
|
|
7782
8267
|
}
|
|
7783
|
-
const color =
|
|
7784
|
-
const value = Math.max(0,
|
|
8268
|
+
const color = chunkKXYSO6GC_cjs.paint(series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[index % chunkKXYSO6GC_cjs.CHART_COLORS.length], diagnostics, chart.id);
|
|
8269
|
+
const value = Math.max(0, chunkKXYSO6GC_cjs.finite(series.values[0], 0));
|
|
7785
8270
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
7786
8271
|
const trackStyle = {
|
|
7787
8272
|
fill: { kind: "none" },
|
|
@@ -7819,7 +8304,7 @@ function ringNodes2(context, layout, series, index) {
|
|
|
7819
8304
|
bounds,
|
|
7820
8305
|
d: ringProgressPath(centerX, centerY, radius, sweep, start),
|
|
7821
8306
|
detail: { of: "chartValue", series: series.id, valueIndex: 0, mark: "radial-bar-ring" },
|
|
7822
|
-
prop:
|
|
8307
|
+
prop: chunkKXYSO6GC_cjs.seriesValueProp(series.id, 0),
|
|
7823
8308
|
style: { fill: { kind: "none" }, stroke: color, strokeWidth: ringThickness, lineCap: cap }
|
|
7824
8309
|
};
|
|
7825
8310
|
return [track, ...casters, progress];
|
|
@@ -7831,7 +8316,7 @@ function renderRadialBar(context) {
|
|
|
7831
8316
|
|
|
7832
8317
|
// src/renderScene/charts/renderers/sankey/links.ts
|
|
7833
8318
|
function renderSankeyLinks(context, data) {
|
|
7834
|
-
const shadow =
|
|
8319
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
7835
8320
|
const gradient = Boolean(context.chart.config?.linkGradient);
|
|
7836
8321
|
const { plot } = context;
|
|
7837
8322
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
@@ -7852,8 +8337,8 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
7852
8337
|
bottom: data.baseY + link.targetY1
|
|
7853
8338
|
};
|
|
7854
8339
|
const config = context.chart.config;
|
|
7855
|
-
const fromColor = link.color || data.nodeColors.get(link.source) ||
|
|
7856
|
-
const toColor = data.nodeColors.get(link.target) ||
|
|
8340
|
+
const fromColor = link.color || data.nodeColors.get(link.source) || chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL;
|
|
8341
|
+
const toColor = data.nodeColors.get(link.target) || chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL;
|
|
7857
8342
|
const fill2 = gradient ? {
|
|
7858
8343
|
kind: "linear-gradient",
|
|
7859
8344
|
angle: 0,
|
|
@@ -7868,9 +8353,9 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
7868
8353
|
toId: link.target,
|
|
7869
8354
|
source,
|
|
7870
8355
|
target,
|
|
7871
|
-
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0,
|
|
8356
|
+
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0, chunkKXYSO6GC_cjs.finite(config?.sankeyLinkCurve, 0.5))),
|
|
7872
8357
|
fill: fill2,
|
|
7873
|
-
opacity: Math.min(1, Math.max(0,
|
|
8358
|
+
opacity: Math.min(1, Math.max(0, chunkKXYSO6GC_cjs.finite(config?.sankeyLinkOpacity, link.color ? 0.85 : 0.45)))
|
|
7874
8359
|
};
|
|
7875
8360
|
}
|
|
7876
8361
|
function createSankeyRibbonNode(context, ribbon, shadow, clipPath, gradient) {
|
|
@@ -7911,7 +8396,7 @@ function sankeyRibbonPath(ribbon) {
|
|
|
7911
8396
|
var OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG = 0.3;
|
|
7912
8397
|
var OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG = 0.78;
|
|
7913
8398
|
function renderSankeyNodes(context, data) {
|
|
7914
|
-
const cornerRadius = Math.max(0,
|
|
8399
|
+
const cornerRadius = Math.max(0, chunkKXYSO6GC_cjs.finite(context.chart.config?.barCornerRadius, 0));
|
|
7915
8400
|
const nodes = [];
|
|
7916
8401
|
data.nodes.forEach((node) => {
|
|
7917
8402
|
nodes.push(createNodeRect(context, data, node, cornerRadius));
|
|
@@ -7927,8 +8412,8 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
7927
8412
|
const x = data.baseX + node.x;
|
|
7928
8413
|
const y = data.baseY + node.y;
|
|
7929
8414
|
const style = {
|
|
7930
|
-
fill: { kind: "solid", color: node.color ||
|
|
7931
|
-
shadow:
|
|
8415
|
+
fill: { kind: "solid", color: node.color || chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL },
|
|
8416
|
+
shadow: chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle)
|
|
7932
8417
|
};
|
|
7933
8418
|
const isFirstColumn = node.column === 0;
|
|
7934
8419
|
const isLastColumn = node.column === data.columnCount - 1;
|
|
@@ -7954,7 +8439,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
7954
8439
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
7955
8440
|
order: nextOrder(),
|
|
7956
8441
|
bounds,
|
|
7957
|
-
d:
|
|
8442
|
+
d: chunkKXYSO6GC_cjs.leftRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
7958
8443
|
style,
|
|
7959
8444
|
detail
|
|
7960
8445
|
};
|
|
@@ -7965,7 +8450,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
7965
8450
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
7966
8451
|
order: nextOrder(),
|
|
7967
8452
|
bounds,
|
|
7968
|
-
d:
|
|
8453
|
+
d: chunkKXYSO6GC_cjs.rightRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
7969
8454
|
style,
|
|
7970
8455
|
detail
|
|
7971
8456
|
};
|
|
@@ -7991,9 +8476,9 @@ function createNodeLabel(context, data, node) {
|
|
|
7991
8476
|
return void 0;
|
|
7992
8477
|
}
|
|
7993
8478
|
const fallback = chart.textColor ?? "#0f172a";
|
|
7994
|
-
const defaultColor = position === "inside" ?
|
|
8479
|
+
const defaultColor = position === "inside" ? chunkKXYSO6GC_cjs.contrastTextColor(node.color) : chunkKXYSO6GC_cjs.sameHueTint(
|
|
7995
8480
|
node.color,
|
|
7996
|
-
|
|
8481
|
+
chunkKXYSO6GC_cjs.isLightColor(fallback) ? OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG : OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG
|
|
7997
8482
|
) ?? fallback;
|
|
7998
8483
|
const color = chart.config?.labelColor ?? defaultColor;
|
|
7999
8484
|
return { ...label, color, detail: { of: "chartSeries", series: node.id, mark: "sankey-node-label" } };
|
|
@@ -8005,7 +8490,7 @@ function createOutsideLabel(context, data, node) {
|
|
|
8005
8490
|
const y = data.baseY + node.y;
|
|
8006
8491
|
const labelX2 = isLastColumn ? x - data.labelGutter + 8 : x + node.width + 6;
|
|
8007
8492
|
return {
|
|
8008
|
-
...
|
|
8493
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
8009
8494
|
id: `chart-sankey-label-${chart.id}-${node.id}`,
|
|
8010
8495
|
order: nextOrder(),
|
|
8011
8496
|
bounds,
|
|
@@ -8030,11 +8515,11 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
8030
8515
|
if (orientation === "vertical") {
|
|
8031
8516
|
const thickness = fontSize * 1.4;
|
|
8032
8517
|
const width = Math.max(1, node.height - 8);
|
|
8033
|
-
if (
|
|
8518
|
+
if (chunkKXYSO6GC_cjs.estimateTextWidth(node.label, fontSize, false) > width) {
|
|
8034
8519
|
return void 0;
|
|
8035
8520
|
}
|
|
8036
8521
|
return {
|
|
8037
|
-
...
|
|
8522
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
8038
8523
|
id,
|
|
8039
8524
|
order: nextOrder(),
|
|
8040
8525
|
bounds,
|
|
@@ -8051,7 +8536,7 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
8051
8536
|
};
|
|
8052
8537
|
}
|
|
8053
8538
|
return {
|
|
8054
|
-
...
|
|
8539
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
8055
8540
|
id,
|
|
8056
8541
|
order: nextOrder(),
|
|
8057
8542
|
bounds,
|
|
@@ -8072,18 +8557,18 @@ function createSankeyRenderData(context) {
|
|
|
8072
8557
|
const labelGutter = showLabels ? 92 : 0;
|
|
8073
8558
|
const availableWidth = Math.max(1, plot.width - labelGutter * 2);
|
|
8074
8559
|
const layout = layoutSankey(createNodeInputs(context), createLinkInputs(context), availableWidth, plot.height, {
|
|
8075
|
-
nodeWidth: Math.max(1,
|
|
8076
|
-
nodeGap: Math.max(0,
|
|
8560
|
+
nodeWidth: Math.max(1, chunkKXYSO6GC_cjs.finite(chart.config?.sankeyNodeWidth, 18)),
|
|
8561
|
+
nodeGap: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.sankeyNodeGap, 8))
|
|
8077
8562
|
});
|
|
8078
8563
|
return {
|
|
8079
8564
|
...layout,
|
|
8080
8565
|
baseX: plot.x + labelGutter,
|
|
8081
8566
|
baseY: plot.y,
|
|
8082
8567
|
labelGutter,
|
|
8083
|
-
fontSize: Math.max(9,
|
|
8084
|
-
labelSize: Math.max(6,
|
|
8568
|
+
fontSize: Math.max(9, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12)),
|
|
8569
|
+
labelSize: Math.max(6, chunkKXYSO6GC_cjs.finite(chart.config?.sankeyLabelSize, Math.max(9, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
8085
8570
|
columnCount: Math.max(1, ...layout.nodes.map((node) => node.column + 1)),
|
|
8086
|
-
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color ||
|
|
8571
|
+
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color || chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL]))
|
|
8087
8572
|
};
|
|
8088
8573
|
}
|
|
8089
8574
|
function createNodeInputs(context) {
|
|
@@ -8105,7 +8590,7 @@ function createLinkInputs(context) {
|
|
|
8105
8590
|
source: series.source,
|
|
8106
8591
|
target: series.target,
|
|
8107
8592
|
value: series.values[0] ?? 0,
|
|
8108
|
-
color: series.color ?
|
|
8593
|
+
color: series.color ? chunkKXYSO6GC_cjs.representativeColor(series.color, chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL) : void 0
|
|
8109
8594
|
});
|
|
8110
8595
|
});
|
|
8111
8596
|
return inputs;
|
|
@@ -8124,9 +8609,9 @@ function renderSankey(context) {
|
|
|
8124
8609
|
var DEFAULT_POINT_SIZE = 4;
|
|
8125
8610
|
function renderScatter(context) {
|
|
8126
8611
|
const nodes = [];
|
|
8127
|
-
const shadow =
|
|
8612
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
8128
8613
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
8129
|
-
const color = series.color ??
|
|
8614
|
+
const color = series.color ?? chunkKXYSO6GC_cjs.CHART_COLORS[seriesIndex % chunkKXYSO6GC_cjs.CHART_COLORS.length];
|
|
8130
8615
|
const points = pixelPoints(context, seriesValuePairs(context.chart, series));
|
|
8131
8616
|
points.forEach((point, pointIndex) => {
|
|
8132
8617
|
nodes.push(createScatterPoint(context, series, point, pointIndex, color, shadow));
|
|
@@ -8150,8 +8635,8 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
8150
8635
|
ry: radius,
|
|
8151
8636
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex },
|
|
8152
8637
|
style: {
|
|
8153
|
-
fill:
|
|
8154
|
-
stroke: strokeWidth > 0 ?
|
|
8638
|
+
fill: chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id),
|
|
8639
|
+
stroke: strokeWidth > 0 ? chunkKXYSO6GC_cjs.paint(config?.pointStrokeColor ?? color, diagnostics, chart.id) : void 0,
|
|
8155
8640
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
8156
8641
|
opacity: config?.pointOpacity,
|
|
8157
8642
|
shadow
|
|
@@ -8162,14 +8647,14 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
8162
8647
|
// src/renderScene/charts/renderers/treemap/layout.ts
|
|
8163
8648
|
function createTreemapLayout(context) {
|
|
8164
8649
|
const { chart, plot, showLegend } = context;
|
|
8165
|
-
const fontSize = Math.max(9,
|
|
8650
|
+
const fontSize = Math.max(9, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12));
|
|
8166
8651
|
const legendPosition = chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : "bottom";
|
|
8167
8652
|
const legendHeight = showLegend && legendPosition === "bottom" ? 48 : 0;
|
|
8168
|
-
const cellGap = Math.max(0,
|
|
8653
|
+
const cellGap = Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.cellGap, 0));
|
|
8169
8654
|
return {
|
|
8170
8655
|
leaves: chart.series,
|
|
8171
|
-
bands:
|
|
8172
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
8656
|
+
bands: chunkKXYSO6GC_cjs.axisBands(chart.axisY),
|
|
8657
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkKXYSO6GC_cjs.DEFAULT_HEATMAP_ZONES,
|
|
8173
8658
|
fontSize,
|
|
8174
8659
|
smallFontSize: Math.max(8, fontSize - 1),
|
|
8175
8660
|
legendPosition,
|
|
@@ -8177,23 +8662,23 @@ function createTreemapLayout(context) {
|
|
|
8177
8662
|
gridWidth: Math.max(1, plot.width),
|
|
8178
8663
|
gridHeight: Math.max(1, plot.height - legendHeight),
|
|
8179
8664
|
cellGap,
|
|
8180
|
-
cellRadius: Math.max(0,
|
|
8181
|
-
headerHeight: Math.max(0,
|
|
8182
|
-
labelSize: Math.max(6,
|
|
8183
|
-
valueSize: Math.max(6,
|
|
8184
|
-
labelPadding: Math.max(0,
|
|
8665
|
+
cellRadius: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.barCornerRadius, cellGap)),
|
|
8666
|
+
headerHeight: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.headerHeight, 20)),
|
|
8667
|
+
labelSize: Math.max(6, chunkKXYSO6GC_cjs.finite(chart.config?.tileLabelSize, Math.max(8, fontSize - 1))),
|
|
8668
|
+
valueSize: Math.max(6, chunkKXYSO6GC_cjs.finite(chart.config?.tileValueSize, Math.max(8, fontSize - 1))),
|
|
8669
|
+
labelPadding: Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.tileLabelPadding, 4))
|
|
8185
8670
|
};
|
|
8186
8671
|
}
|
|
8187
8672
|
function treemapLeafValue(leaf) {
|
|
8188
8673
|
return leaf.values[0] ?? 0;
|
|
8189
8674
|
}
|
|
8190
8675
|
function treemapLeafColor(leaf, layout) {
|
|
8191
|
-
return leaf.color ??
|
|
8676
|
+
return leaf.color ?? chunkKXYSO6GC_cjs.zoneColorAtValue(treemapLeafValue(leaf), layout.bands, layout.zones);
|
|
8192
8677
|
}
|
|
8193
8678
|
|
|
8194
8679
|
// src/renderScene/charts/renderers/treemap/legend.ts
|
|
8195
8680
|
var BAR_THICKNESS = 10;
|
|
8196
|
-
var
|
|
8681
|
+
var TICK_LENGTH2 = 4;
|
|
8197
8682
|
var ROW_GAP2 = 2;
|
|
8198
8683
|
var CHART_GAP = 16;
|
|
8199
8684
|
var LABEL_SIZE = 34;
|
|
@@ -8213,7 +8698,7 @@ function bandStops(layout) {
|
|
|
8213
8698
|
const zones = layout.zones.slice(0, bandCount);
|
|
8214
8699
|
return zones.map((zone, index) => ({
|
|
8215
8700
|
offset: bandRatio2(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
8216
|
-
color: zone.color ??
|
|
8701
|
+
color: zone.color ?? chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL
|
|
8217
8702
|
}));
|
|
8218
8703
|
}
|
|
8219
8704
|
function renderBottomLegend(context, layout) {
|
|
@@ -8222,7 +8707,7 @@ function renderBottomLegend(context, layout) {
|
|
|
8222
8707
|
const barWidth = layout.gridWidth;
|
|
8223
8708
|
const labelHeight = layout.fontSize + 2;
|
|
8224
8709
|
const barY = plot.y + layout.gridHeight + CHART_GAP;
|
|
8225
|
-
const barBounds =
|
|
8710
|
+
const barBounds = chunkKXYSO6GC_cjs.boxBounds({ x: barX, y: barY, width: barWidth, height: BAR_THICKNESS });
|
|
8226
8711
|
const stops = bandStops(layout);
|
|
8227
8712
|
const bar = {
|
|
8228
8713
|
type: "rect",
|
|
@@ -8236,19 +8721,19 @@ function renderBottomLegend(context, layout) {
|
|
|
8236
8721
|
rx: 3,
|
|
8237
8722
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
8238
8723
|
style: {
|
|
8239
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color:
|
|
8724
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color: chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL },
|
|
8240
8725
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8241
8726
|
strokeWidth: 1
|
|
8242
8727
|
}
|
|
8243
8728
|
};
|
|
8244
|
-
const
|
|
8729
|
+
const ticks2 = layout.bands.flatMap((value, index) => {
|
|
8245
8730
|
const x = barX + bandRatio2(layout, value) * barWidth;
|
|
8246
8731
|
const tick = {
|
|
8247
8732
|
type: "path",
|
|
8248
8733
|
id: `chart-treemap-legend-tick-${chart.id}-${index}`,
|
|
8249
8734
|
order: nextOrder(),
|
|
8250
8735
|
bounds,
|
|
8251
|
-
d: `M ${x} ${barY + BAR_THICKNESS} L ${x} ${barY + BAR_THICKNESS +
|
|
8736
|
+
d: `M ${x} ${barY + BAR_THICKNESS} L ${x} ${barY + BAR_THICKNESS + TICK_LENGTH2}`,
|
|
8252
8737
|
style: {
|
|
8253
8738
|
fill: { kind: "none" },
|
|
8254
8739
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
@@ -8259,18 +8744,18 @@ function renderBottomLegend(context, layout) {
|
|
|
8259
8744
|
const isLast = index === layout.bands.length - 1;
|
|
8260
8745
|
const align = isFirst ? "left" : isLast ? "right" : "center";
|
|
8261
8746
|
const frameX = isFirst ? x : isLast ? x - LABEL_SIZE : x - LABEL_SIZE / 2;
|
|
8262
|
-
const label =
|
|
8747
|
+
const label = chunkKXYSO6GC_cjs.chartText({
|
|
8263
8748
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
8264
8749
|
order: nextOrder(),
|
|
8265
8750
|
bounds,
|
|
8266
|
-
frame: { x: frameX, y: barY + BAR_THICKNESS +
|
|
8267
|
-
text:
|
|
8751
|
+
frame: { x: frameX, y: barY + BAR_THICKNESS + TICK_LENGTH2 + ROW_GAP2, width: LABEL_SIZE, height: labelHeight },
|
|
8752
|
+
text: chunkKXYSO6GC_cjs.formatFieldValue(value),
|
|
8268
8753
|
chart,
|
|
8269
8754
|
align
|
|
8270
8755
|
});
|
|
8271
8756
|
return [tick, label];
|
|
8272
8757
|
});
|
|
8273
|
-
return [bar, ...
|
|
8758
|
+
return [bar, ...ticks2];
|
|
8274
8759
|
}
|
|
8275
8760
|
function renderSideLegend(context, layout) {
|
|
8276
8761
|
const { chart, plot, bounds, nextOrder } = context;
|
|
@@ -8278,7 +8763,7 @@ function renderSideLegend(context, layout) {
|
|
|
8278
8763
|
const barTop = plot.y;
|
|
8279
8764
|
const barHeight = layout.gridHeight;
|
|
8280
8765
|
const barX = side === "left" ? plot.x - CHART_GAP - BAR_THICKNESS : plot.x + layout.gridWidth + CHART_GAP;
|
|
8281
|
-
const barBounds =
|
|
8766
|
+
const barBounds = chunkKXYSO6GC_cjs.boxBounds({ x: barX, y: barTop, width: BAR_THICKNESS, height: barHeight });
|
|
8282
8767
|
const stops = bandStops(layout);
|
|
8283
8768
|
const bar = {
|
|
8284
8769
|
type: "rect",
|
|
@@ -8292,15 +8777,15 @@ function renderSideLegend(context, layout) {
|
|
|
8292
8777
|
rx: 3,
|
|
8293
8778
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
8294
8779
|
style: {
|
|
8295
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color:
|
|
8780
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color: chunkKXYSO6GC_cjs.DEFAULT_ZONE_FILL },
|
|
8296
8781
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8297
8782
|
strokeWidth: 1
|
|
8298
8783
|
}
|
|
8299
8784
|
};
|
|
8300
8785
|
const tickX = side === "left" ? barX : barX + BAR_THICKNESS;
|
|
8301
|
-
const tickEndX = side === "left" ? tickX -
|
|
8786
|
+
const tickEndX = side === "left" ? tickX - TICK_LENGTH2 : tickX + TICK_LENGTH2;
|
|
8302
8787
|
const labelX2 = side === "left" ? tickEndX - ROW_GAP2 - LABEL_SIZE : tickEndX + ROW_GAP2;
|
|
8303
|
-
const
|
|
8788
|
+
const ticks2 = layout.bands.flatMap((value, index) => {
|
|
8304
8789
|
const y = barTop + (1 - bandRatio2(layout, value)) * barHeight;
|
|
8305
8790
|
const tick = {
|
|
8306
8791
|
type: "path",
|
|
@@ -8314,18 +8799,18 @@ function renderSideLegend(context, layout) {
|
|
|
8314
8799
|
strokeWidth: 1
|
|
8315
8800
|
}
|
|
8316
8801
|
};
|
|
8317
|
-
const label =
|
|
8802
|
+
const label = chunkKXYSO6GC_cjs.chartText({
|
|
8318
8803
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
8319
8804
|
order: nextOrder(),
|
|
8320
8805
|
bounds,
|
|
8321
8806
|
frame: { x: labelX2, y: y - layout.fontSize / 2, width: LABEL_SIZE, height: layout.fontSize + 2 },
|
|
8322
|
-
text:
|
|
8807
|
+
text: chunkKXYSO6GC_cjs.formatFieldValue(value),
|
|
8323
8808
|
chart,
|
|
8324
8809
|
align: side === "left" ? "right" : "left"
|
|
8325
8810
|
});
|
|
8326
8811
|
return [tick, label];
|
|
8327
8812
|
});
|
|
8328
|
-
return [bar, ...
|
|
8813
|
+
return [bar, ...ticks2];
|
|
8329
8814
|
}
|
|
8330
8815
|
|
|
8331
8816
|
// src/renderScene/charts/renderers/treemap/tiles.ts
|
|
@@ -8407,7 +8892,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
8407
8892
|
};
|
|
8408
8893
|
const smallFontSize = Math.max(8, Math.max(9, chart.fontSize ?? 12) - 1);
|
|
8409
8894
|
const label = {
|
|
8410
|
-
...
|
|
8895
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
8411
8896
|
id: `chart-treemap-header-label-${chart.id}-${index}`,
|
|
8412
8897
|
order: nextOrder(),
|
|
8413
8898
|
bounds,
|
|
@@ -8422,7 +8907,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
8422
8907
|
align: "center"
|
|
8423
8908
|
}),
|
|
8424
8909
|
fontSize: smallFontSize,
|
|
8425
|
-
color:
|
|
8910
|
+
color: chunkKXYSO6GC_cjs.contrastTextColor(fill2)
|
|
8426
8911
|
};
|
|
8427
8912
|
return [background, label];
|
|
8428
8913
|
}
|
|
@@ -8438,7 +8923,7 @@ function renderTile(context, layout, tile, nextTile) {
|
|
|
8438
8923
|
function createTileNode(context, layout, tile, color, nextColor) {
|
|
8439
8924
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
8440
8925
|
const gap = layout.cellGap;
|
|
8441
|
-
const shadow =
|
|
8926
|
+
const shadow = chunkKXYSO6GC_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8442
8927
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
8443
8928
|
const tileX = plot.x + tile.x + gap / 2;
|
|
8444
8929
|
const tileY = plot.y + tile.y + gap / 2;
|
|
@@ -8455,10 +8940,10 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
8455
8940
|
kind: "linear-gradient",
|
|
8456
8941
|
angle: 0,
|
|
8457
8942
|
stops: [
|
|
8458
|
-
{ offset: 0, color:
|
|
8459
|
-
{ offset: 100, color:
|
|
8943
|
+
{ offset: 0, color: chunkKXYSO6GC_cjs.representativeColor(color, fallback) },
|
|
8944
|
+
{ offset: 100, color: chunkKXYSO6GC_cjs.representativeColor(nextColor, fallback) }
|
|
8460
8945
|
]
|
|
8461
|
-
} :
|
|
8946
|
+
} : chunkKXYSO6GC_cjs.paint(color, diagnostics, chart.id);
|
|
8462
8947
|
return {
|
|
8463
8948
|
type: "rect",
|
|
8464
8949
|
id: `chart-treemap-tile-${chart.id}-${tile.item.leaf.id}`,
|
|
@@ -8472,7 +8957,7 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
8472
8957
|
style: {
|
|
8473
8958
|
fill: fill2,
|
|
8474
8959
|
stroke: { kind: "solid", color: chart.config?.tileStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
8475
|
-
strokeWidth:
|
|
8960
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.config?.tileStrokeWidth, chunkKXYSO6GC_cjs.finite(chart.gridWidth, 1)),
|
|
8476
8961
|
shadow,
|
|
8477
8962
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
8478
8963
|
}
|
|
@@ -8487,12 +8972,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
8487
8972
|
const height = Math.max(1, tile.height - gap - pad * 1.5);
|
|
8488
8973
|
const x = plot.x + tile.x + gap / 2 + pad;
|
|
8489
8974
|
const y = plot.y + tile.y + gap / 2 + pad * 0.75;
|
|
8490
|
-
const textColor = chart.config?.tileTextColor ??
|
|
8975
|
+
const textColor = chart.config?.tileTextColor ?? chunkKXYSO6GC_cjs.contrastTextColor(chunkKXYSO6GC_cjs.representativeColor(color, "#ffffff"));
|
|
8491
8976
|
const lineHeight = layout.labelSize * 1.2;
|
|
8492
8977
|
const maxLines = Math.max(1, Math.floor(height / lineHeight));
|
|
8493
|
-
const labelLines =
|
|
8978
|
+
const labelLines = chunkKXYSO6GC_cjs.wrapText(leaf.label, width, layout.labelSize).slice(0, maxLines).map((line) => chunkKXYSO6GC_cjs.ellipsizeToWidth(line, width, layout.labelSize, true));
|
|
8494
8979
|
const label = {
|
|
8495
|
-
...
|
|
8980
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
8496
8981
|
id: `chart-treemap-label-${chart.id}-${leaf.id}`,
|
|
8497
8982
|
order: nextOrder(),
|
|
8498
8983
|
bounds,
|
|
@@ -8506,12 +8991,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
8506
8991
|
color: textColor
|
|
8507
8992
|
};
|
|
8508
8993
|
const valueText = String(value);
|
|
8509
|
-
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 &&
|
|
8994
|
+
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 && chunkKXYSO6GC_cjs.estimateTextWidth(valueText, layout.valueSize, false) <= width;
|
|
8510
8995
|
if (chart.config?.showTileValues === false || !valueFits) {
|
|
8511
8996
|
return [label];
|
|
8512
8997
|
}
|
|
8513
8998
|
const valueNode = {
|
|
8514
|
-
...
|
|
8999
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
8515
9000
|
id: `chart-treemap-value-${chart.id}-${leaf.id}`,
|
|
8516
9001
|
order: nextOrder(),
|
|
8517
9002
|
bounds,
|
|
@@ -8588,7 +9073,7 @@ function buildCartesianChart(foundation) {
|
|
|
8588
9073
|
|
|
8589
9074
|
// src/renderScene/charts/chartFrame.ts
|
|
8590
9075
|
function scaleDetail(chart, plot) {
|
|
8591
|
-
const horizontal =
|
|
9076
|
+
const horizontal = chunkKXYSO6GC_cjs.isHorizontalBar(chart);
|
|
8592
9077
|
const range = horizontal ? `${plot.x},${plot.width}` : `${plot.y},${plot.height}`;
|
|
8593
9078
|
return {
|
|
8594
9079
|
of: "chartScale",
|
|
@@ -8596,7 +9081,7 @@ function scaleDetail(chart, plot) {
|
|
|
8596
9081
|
};
|
|
8597
9082
|
}
|
|
8598
9083
|
function pieDetail(chart, plot) {
|
|
8599
|
-
const { outerRadius, innerRadius, cornerRadius } =
|
|
9084
|
+
const { outerRadius, innerRadius, cornerRadius } = chunkKXYSO6GC_cjs.resolvePieRadii(
|
|
8600
9085
|
plot.width,
|
|
8601
9086
|
plot.height,
|
|
8602
9087
|
chart.config?.innerRadius,
|
|
@@ -8609,8 +9094,8 @@ function pieDetail(chart, plot) {
|
|
|
8609
9094
|
}
|
|
8610
9095
|
function polarAreaDetail(chart, plot) {
|
|
8611
9096
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
8612
|
-
const innerRadius = Math.max(0, Math.min(
|
|
8613
|
-
const cornerRadius = Math.max(0,
|
|
9097
|
+
const innerRadius = Math.max(0, Math.min(chunkKXYSO6GC_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1));
|
|
9098
|
+
const cornerRadius = Math.max(0, chunkKXYSO6GC_cjs.finite(chart.config?.pieCornerRadius, 0));
|
|
8614
9099
|
return {
|
|
8615
9100
|
of: "pieGeometry",
|
|
8616
9101
|
pieGeometry: `${plot.x + plot.width / 2},${plot.y + plot.height / 2},${maxRadius},${innerRadius},${cornerRadius}`
|
|
@@ -8619,8 +9104,8 @@ function polarAreaDetail(chart, plot) {
|
|
|
8619
9104
|
function radarDetail(chart, plot) {
|
|
8620
9105
|
const configuredCount = (chart.config?.categories?.filter(Boolean) ?? []).length;
|
|
8621
9106
|
const dataCount = Math.max(0, ...chart.series.map((series) => series.values.length));
|
|
8622
|
-
const count =
|
|
8623
|
-
const radius =
|
|
9107
|
+
const count = chunkKXYSO6GC_cjs.radarCategoryCount(configuredCount, dataCount);
|
|
9108
|
+
const radius = chunkKXYSO6GC_cjs.radarRadius(plot.width, plot.height, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12), chart.showAxisLabels !== false);
|
|
8624
9109
|
const centerX = plot.x + plot.width / 2;
|
|
8625
9110
|
const centerY = plot.y + plot.height / 2;
|
|
8626
9111
|
const curved = chart.chartType === "radial" ? 1 : 0;
|
|
@@ -8654,9 +9139,9 @@ function buildChartFrame(chart, bounds, plot, order) {
|
|
|
8654
9139
|
height: chart.height,
|
|
8655
9140
|
rx: chart.cornerRadius ?? 12,
|
|
8656
9141
|
style: {
|
|
8657
|
-
fill:
|
|
9142
|
+
fill: chunkKXYSO6GC_cjs.paint(chart.fillColor ?? "#ffffff", [], chart.id),
|
|
8658
9143
|
stroke: { kind: "solid", color: chart.strokeColor ?? "#475569" },
|
|
8659
|
-
strokeWidth:
|
|
9144
|
+
strokeWidth: chunkKXYSO6GC_cjs.finite(chart.strokeWidth, 1)
|
|
8660
9145
|
}
|
|
8661
9146
|
};
|
|
8662
9147
|
const detail = frameDetail(chart, plot);
|
|
@@ -8716,7 +9201,7 @@ function buildChartTitle(chart, bounds, plot, renderOrder) {
|
|
|
8716
9201
|
}
|
|
8717
9202
|
return [
|
|
8718
9203
|
{
|
|
8719
|
-
...
|
|
9204
|
+
...chunkKXYSO6GC_cjs.chartText({
|
|
8720
9205
|
id: `chart-title-${chart.id}`,
|
|
8721
9206
|
order: renderOrder.next(),
|
|
8722
9207
|
bounds,
|
|
@@ -8726,8 +9211,8 @@ function buildChartTitle(chart, bounds, plot, renderOrder) {
|
|
|
8726
9211
|
}),
|
|
8727
9212
|
...chart.titleColor ? { color: chart.titleColor } : {},
|
|
8728
9213
|
fontWeight: chart.titleWeight ?? "bold",
|
|
8729
|
-
fontSize:
|
|
8730
|
-
prop:
|
|
9214
|
+
fontSize: chunkKXYSO6GC_cjs.finite(chart.titleSize, Math.max(10, chunkKXYSO6GC_cjs.finite(chart.fontSize, 12)) + 2),
|
|
9215
|
+
prop: chunkKXYSO6GC_cjs.CHART_TITLE_PROP
|
|
8731
9216
|
}
|
|
8732
9217
|
];
|
|
8733
9218
|
}
|
|
@@ -8780,14 +9265,14 @@ function buildChart(chart, index, diagnostics) {
|
|
|
8780
9265
|
// src/renderScene/charts/artifacts.ts
|
|
8781
9266
|
function buildCharts(charts, diagnostics) {
|
|
8782
9267
|
return charts.flatMap(
|
|
8783
|
-
(chart, index) =>
|
|
9268
|
+
(chart, index) => chunkKXYSO6GC_cjs.tag(buildChart(chart, index, diagnostics), "chart", chart.id, chart.chartType, chart.title ?? "Chart")
|
|
8784
9269
|
);
|
|
8785
9270
|
}
|
|
8786
9271
|
|
|
8787
9272
|
// src/renderScene/scene/build.ts
|
|
8788
9273
|
function sceneBounds(nodes) {
|
|
8789
9274
|
if (!nodes.length) {
|
|
8790
|
-
return
|
|
9275
|
+
return chunkKXYSO6GC_cjs.EMPTY_BOUNDS;
|
|
8791
9276
|
}
|
|
8792
9277
|
return {
|
|
8793
9278
|
minX: Math.min(...nodes.map((n) => n.bounds.minX)),
|
|
@@ -8801,8 +9286,8 @@ function stackingOf(input) {
|
|
|
8801
9286
|
const add = (role, objects, legacyBase) => {
|
|
8802
9287
|
objects.forEach((object, index) => {
|
|
8803
9288
|
stacking.set(`${role}:${object.id}`, {
|
|
8804
|
-
rank:
|
|
8805
|
-
sequence:
|
|
9289
|
+
rank: chunkKXYSO6GC_cjs.stackRank(object),
|
|
9290
|
+
sequence: chunkKXYSO6GC_cjs.stackSequence(object, legacyBase + index)
|
|
8806
9291
|
});
|
|
8807
9292
|
});
|
|
8808
9293
|
};
|
|
@@ -9150,6 +9635,12 @@ function addStrokeAttrs(attrs, style) {
|
|
|
9150
9635
|
if (style.pointerEvents) {
|
|
9151
9636
|
attrs.push(`pointer-events="${style.pointerEvents}"`);
|
|
9152
9637
|
}
|
|
9638
|
+
if (style.transition && style.transition > 0) {
|
|
9639
|
+
const time = `${num(style.transition)}ms ease`;
|
|
9640
|
+
attrs.push(
|
|
9641
|
+
`style="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}"`
|
|
9642
|
+
);
|
|
9643
|
+
}
|
|
9153
9644
|
}
|
|
9154
9645
|
function elementSize(node) {
|
|
9155
9646
|
const shape = node;
|
|
@@ -9280,31 +9771,31 @@ function chartSeriesAttrs(detail) {
|
|
|
9280
9771
|
];
|
|
9281
9772
|
}
|
|
9282
9773
|
function frameBoundaryAttrs(detail) {
|
|
9283
|
-
return [`${
|
|
9774
|
+
return [`${chunkKXYSO6GC_cjs.CORNER_RADIUS_ATTR}="${num(detail.cornerRadius)}"`, `${chunkKXYSO6GC_cjs.SQUARE_CORNER_ATTR}="${detail.squareCorner}"`];
|
|
9284
9775
|
}
|
|
9285
9776
|
function declaredBoundsAttr(bounds) {
|
|
9286
|
-
return `${
|
|
9777
|
+
return `${chunkKXYSO6GC_cjs.SYMBOL_BOUNDS_ATTR}="${num(bounds.x)},${num(bounds.y)},${num(bounds.width)},${num(bounds.height)}"`;
|
|
9287
9778
|
}
|
|
9288
9779
|
function symbolGeometryAttrs(detail) {
|
|
9289
9780
|
return [
|
|
9290
|
-
`${
|
|
9291
|
-
`${
|
|
9781
|
+
`${chunkKXYSO6GC_cjs.SYMBOL_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
9782
|
+
`${chunkKXYSO6GC_cjs.SYMBOL_TENSION_ATTR}="${num(detail.tension)}"`,
|
|
9292
9783
|
declaredBoundsAttr(detail.declaredBounds)
|
|
9293
9784
|
];
|
|
9294
9785
|
}
|
|
9295
9786
|
function pathGeometryAttrs(detail) {
|
|
9296
9787
|
return [
|
|
9297
|
-
`${
|
|
9298
|
-
`${
|
|
9299
|
-
`${
|
|
9788
|
+
`${chunkKXYSO6GC_cjs.PATH_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
9789
|
+
`${chunkKXYSO6GC_cjs.PATH_TENSION_ATTR}="${num(detail.tension)}"`,
|
|
9790
|
+
`${chunkKXYSO6GC_cjs.PATH_CLOSED_ATTR}="${detail.closed}"`
|
|
9300
9791
|
];
|
|
9301
9792
|
}
|
|
9302
9793
|
function isometricGeometryAttrs(detail) {
|
|
9303
9794
|
return [
|
|
9304
|
-
`${
|
|
9305
|
-
`${
|
|
9795
|
+
`${chunkKXYSO6GC_cjs.ISOMETRIC_SIZE_ATTR}="${num(detail.width)},${num(detail.height)},${num(detail.depth)}"`,
|
|
9796
|
+
`${chunkKXYSO6GC_cjs.CORNER_RADIUS_ATTR}="${num(detail.cornerRadius)}"`,
|
|
9306
9797
|
declaredBoundsAttr(detail.bounds),
|
|
9307
|
-
`${
|
|
9798
|
+
`${chunkKXYSO6GC_cjs.ISOMETRIC_LABEL_OFFSET_ATTR}="${num(detail.labelOffsetX)},${num(detail.labelOffsetY)}"`
|
|
9308
9799
|
];
|
|
9309
9800
|
}
|
|
9310
9801
|
function linkDetailAttrs(detail) {
|
|
@@ -9399,8 +9890,9 @@ function lineOffset(index, linePx) {
|
|
|
9399
9890
|
function shaderSurfaceSvg(node, defs) {
|
|
9400
9891
|
const rotation = transform(node.rotation, { x: node.x + node.width / 2, y: node.y + node.height / 2 });
|
|
9401
9892
|
const parameters = xml(JSON.stringify(node.shader.parameters));
|
|
9893
|
+
const surfacePadding = node.shader.surfacePadding ?? 0;
|
|
9402
9894
|
const fillColor = node.fillColor ? ` data-sf-shader-fill="${xml(node.fillColor)}"` : "";
|
|
9403
|
-
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}"${fillColor} x="${num(node.x)}" y="${num(node.y)}" width="${num(node.width)}" height="${num(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>`;
|
|
9895
|
+
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="${num(surfacePadding)}"${fillColor} x="${num(node.x)}" y="${num(node.y)}" width="${num(node.width)}" height="${num(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>`;
|
|
9404
9896
|
}
|
|
9405
9897
|
function rollingDigitSvg(character, node) {
|
|
9406
9898
|
const style = node.componentStyle;
|
|
@@ -9450,7 +9942,7 @@ function renderSvgDocument(scene, options = {}) {
|
|
|
9450
9942
|
const nodes = options.linkHitAreas ? withLinkHitAreas(scene.nodes) : scene.nodes;
|
|
9451
9943
|
const body = nodes.map((node) => nodeSvg(node, defs)).join("\n ");
|
|
9452
9944
|
const declaration = options.includeXmlDeclaration === false ? "" : '<?xml version="1.0" encoding="UTF-8"?>\n';
|
|
9453
|
-
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${num(width)}px" height="${num(height)}px" viewBox="${viewBox}" role="img" data-sf-contract="${
|
|
9945
|
+
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${num(width)}px" height="${num(height)}px" viewBox="${viewBox}" role="img" data-sf-contract="${chunkKXYSO6GC_cjs.DOM_CONTRACT_VERSION}">
|
|
9454
9946
|
<defs>${defs.entries.join("")}</defs>
|
|
9455
9947
|
${body}
|
|
9456
9948
|
</svg>`;
|
|
@@ -9470,9 +9962,9 @@ function renderCanvas(input, options = {}) {
|
|
|
9470
9962
|
}
|
|
9471
9963
|
var SCENE_CACHE_LIMIT = 50;
|
|
9472
9964
|
var sceneCache = /* @__PURE__ */ new Map();
|
|
9473
|
-
var cachedForRegistry =
|
|
9965
|
+
var cachedForRegistry = chunkKXYSO6GC_cjs.componentRegistryVersion();
|
|
9474
9966
|
function cachedRenderScene(source) {
|
|
9475
|
-
const registry =
|
|
9967
|
+
const registry = chunkKXYSO6GC_cjs.componentRegistryVersion();
|
|
9476
9968
|
if (registry !== cachedForRegistry) {
|
|
9477
9969
|
sceneCache.clear();
|
|
9478
9970
|
cachedForRegistry = registry;
|
|
@@ -9504,7 +9996,7 @@ function render(source, options = {}) {
|
|
|
9504
9996
|
var SCENE_ORDER_BASE = 1e4;
|
|
9505
9997
|
function defineComponent(definition) {
|
|
9506
9998
|
const { scene, ...descriptor } = definition;
|
|
9507
|
-
const unregisterDescriptor =
|
|
9999
|
+
const unregisterDescriptor = chunkKXYSO6GC_cjs.registerComponentDescriptor(descriptor);
|
|
9508
10000
|
const unregisterBuilder = registerComponentBuilder(
|
|
9509
10001
|
descriptor.type,
|
|
9510
10002
|
(component, index) => scene(component, { order: SCENE_ORDER_BASE + index })
|
|
@@ -9522,5 +10014,6 @@ exports.defineComponent = defineComponent;
|
|
|
9522
10014
|
exports.render = render;
|
|
9523
10015
|
exports.renderCanvas = renderCanvas;
|
|
9524
10016
|
exports.sflToRenderInput = sflToRenderInput;
|
|
9525
|
-
|
|
9526
|
-
//# sourceMappingURL=chunk-
|
|
10017
|
+
exports.sliderReach = sliderReach;
|
|
10018
|
+
//# sourceMappingURL=chunk-A73UJ5AQ.cjs.map
|
|
10019
|
+
//# sourceMappingURL=chunk-A73UJ5AQ.cjs.map
|