stickyflow 0.11.3 → 0.12.1
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 +23 -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-WZA3DJJH.cjs → chunk-3OF37CZX.cjs} +15 -15
- package/dist/{chunk-WZA3DJJH.cjs.map → chunk-3OF37CZX.cjs.map} +1 -1
- package/dist/{chunk-G6IW2IX3.js → chunk-4SXXMOXR.js} +31 -5
- package/dist/chunk-4SXXMOXR.js.map +1 -0
- package/dist/{chunk-GQRJSA73.cjs → chunk-5JPONNKW.cjs} +23 -23
- package/dist/{chunk-GQRJSA73.cjs.map → chunk-5JPONNKW.cjs.map} +1 -1
- package/dist/{chunk-V22J7Z4H.cjs → chunk-6TTSSFCF.cjs} +37 -37
- package/dist/chunk-6TTSSFCF.cjs.map +1 -0
- package/dist/{chunk-BFQWCOEC.js → chunk-FYSJMUJI.js} +3 -3
- package/dist/{chunk-BFQWCOEC.js.map → chunk-FYSJMUJI.js.map} +1 -1
- package/dist/{chunk-EBHO2FJ5.js → chunk-LLBTELO3.js} +12 -10
- package/dist/chunk-LLBTELO3.js.map +1 -0
- package/dist/{chunk-IQQ5KBL6.js → chunk-NZPLAEDJ.js} +6 -6
- package/dist/chunk-NZPLAEDJ.js.map +1 -0
- package/dist/{chunk-W25SXORW.js → chunk-P7HTMWBT.js} +4 -4
- package/dist/{chunk-W25SXORW.js.map → chunk-P7HTMWBT.js.map} +1 -1
- package/dist/{chunk-K5PGMZAD.cjs → chunk-PSC7G6NL.cjs} +664 -662
- package/dist/chunk-PSC7G6NL.cjs.map +1 -0
- package/dist/{chunk-UHKFJBY5.cjs → chunk-SKGJXCAO.cjs} +31 -5
- package/dist/chunk-SKGJXCAO.cjs.map +1 -0
- package/dist/index.cjs +36 -36
- package/dist/index.d.cts +5 -5
- package/dist/index.d.ts +5 -5
- package/dist/index.js +5 -5
- package/dist/interaction/index.cjs +276 -238
- package/dist/interaction/index.cjs.map +1 -1
- package/dist/interaction/index.d.cts +2 -2
- package/dist/interaction/index.d.ts +2 -2
- package/dist/interaction/index.js +42 -4
- package/dist/interaction/index.js.map +1 -1
- package/dist/{render-BDO4S5uF.d.cts → render-BMhLssMa.d.cts} +1 -0
- package/dist/{render-BDO4S5uF.d.ts → render-BMhLssMa.d.ts} +1 -0
- package/dist/{runtime-lCAfU-1Q.d.ts → runtime-7Tpn2PHh.d.ts} +2 -2
- package/dist/{runtime-C-C5v9po.d.cts → runtime-BPBjVGa6.d.cts} +2 -2
- package/dist/{runtimeTypes-B7p6b1Bi.d.cts → runtimeTypes-Bt9twc5R.d.ts} +2 -2
- package/dist/{runtimeTypes-BDA_CfWh.d.ts → runtimeTypes-CRv6IJs-.d.cts} +2 -2
- package/dist/stickyflow-diagram.global.js +39 -39
- package/dist/stickyflow-diagram.global.js.map +1 -1
- package/dist/{types-CZJzycKw.d.cts → types-BnU5MZNj.d.cts} +1 -1
- package/dist/{types-Dp8JVZLB.d.ts → types-CLZFgmcG.d.ts} +1 -1
- package/dist/viewer/index.cjs +9 -9
- package/dist/viewer/index.d.cts +4 -4
- package/dist/viewer/index.d.ts +4 -4
- package/dist/viewer/index.js +4 -4
- package/dist/web-component/index.cjs +6 -6
- package/dist/web-component/index.d.cts +2 -2
- package/dist/web-component/index.d.ts +2 -2
- package/dist/web-component/index.js +4 -4
- package/package.json +1 -1
- package/dist/chunk-EBHO2FJ5.js.map +0 -1
- package/dist/chunk-G6IW2IX3.js.map +0 -1
- package/dist/chunk-IQQ5KBL6.js.map +0 -1
- package/dist/chunk-K5PGMZAD.cjs.map +0 -1
- package/dist/chunk-UHKFJBY5.cjs.map +0 -1
- package/dist/chunk-V22J7Z4H.cjs.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkSKGJXCAO_cjs = require('./chunk-SKGJXCAO.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-]*`;
|
|
@@ -660,7 +660,7 @@ function readComponentValue(descriptor, raw) {
|
|
|
660
660
|
return raw;
|
|
661
661
|
}
|
|
662
662
|
function genericComponentObject(canvasObject) {
|
|
663
|
-
const descriptor =
|
|
663
|
+
const descriptor = chunkSKGJXCAO_cjs.getComponentDescriptor(canvasObject.component.type);
|
|
664
664
|
return {
|
|
665
665
|
id: canvasObject.id,
|
|
666
666
|
type: canvasObject.component.type,
|
|
@@ -849,7 +849,7 @@ var BUILT_IN_OBJECTS = {
|
|
|
849
849
|
};
|
|
850
850
|
function componentObject(canvasObject) {
|
|
851
851
|
const type = canvasObject.component.type;
|
|
852
|
-
return
|
|
852
|
+
return chunkSKGJXCAO_cjs.isBuiltInComponentType(type) ? BUILT_IN_OBJECTS[type](canvasObject) : genericComponentObject(canvasObject);
|
|
853
853
|
}
|
|
854
854
|
|
|
855
855
|
// src/renderInput/fromSfl/canvasObjects/connection.ts
|
|
@@ -896,6 +896,7 @@ function dimensionObject(canvasObject) {
|
|
|
896
896
|
// src/renderInput/fromSfl/canvasObjects/frame.ts
|
|
897
897
|
function frameObject(e) {
|
|
898
898
|
const p = e.props;
|
|
899
|
+
const screen = e.kind === "screen";
|
|
899
900
|
return {
|
|
900
901
|
id: e.id,
|
|
901
902
|
title: e.text ?? null,
|
|
@@ -903,19 +904,20 @@ function frameObject(e) {
|
|
|
903
904
|
y: e.y,
|
|
904
905
|
width: e.width,
|
|
905
906
|
height: e.height,
|
|
906
|
-
fillColor: p.fill ?? "rgba(155, 66, 223, 0.05)",
|
|
907
|
-
strokeColor: p.stroke ?? "#9b42df",
|
|
908
|
-
strokeWidth: numOf(p.strokeWidth) ?? 2,
|
|
909
|
-
cornerRadius: numOf(p.cornerRadius) ?? 12,
|
|
907
|
+
fillColor: p.fill ?? (screen ? "rgba(0, 0, 0, 0)" : "rgba(155, 66, 223, 0.05)"),
|
|
908
|
+
strokeColor: p.stroke ?? (screen ? "rgba(0, 0, 0, 0)" : "#9b42df"),
|
|
909
|
+
strokeWidth: numOf(p.strokeWidth) ?? (screen ? 0 : 2),
|
|
910
|
+
cornerRadius: numOf(p.cornerRadius) ?? (screen ? 0 : 12),
|
|
910
911
|
textColor: p.textColor ?? "#ffffff",
|
|
911
912
|
fontSize: numOf(p.fontSize) ?? 14,
|
|
912
913
|
fontWeight: oneOf(p.fontWeight, FONT_WEIGHTS, "bold"),
|
|
913
914
|
fontFamily: p.fontFamily,
|
|
914
915
|
dash: dashArray(p.dash),
|
|
915
|
-
showLabel: p.showLabel !== "false",
|
|
916
|
+
showLabel: screen ? p.showLabel === "true" : p.showLabel !== "false",
|
|
916
917
|
labelPosition: oneOf(p.labelPosition, LABEL_POSITIONS, "top"),
|
|
917
|
-
shadow: p.shadow !== "false",
|
|
918
|
+
shadow: screen ? p.shadow === "true" : p.shadow !== "false",
|
|
918
919
|
clip: p.clip === "true" || void 0,
|
|
920
|
+
screen: screen || void 0,
|
|
919
921
|
order: e.order,
|
|
920
922
|
sourceIndex: e.sourceIndex
|
|
921
923
|
};
|
|
@@ -1113,9 +1115,9 @@ function collectCanvasObjects(state) {
|
|
|
1113
1115
|
shapes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "shape").map((shape) => shapeObject(shape, shaders)),
|
|
1114
1116
|
frames: canvasObjects.filter((canvasObject) => canvasObject.objectType === "frame").map(frameObject),
|
|
1115
1117
|
swimlanes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "swimlane").map(swimlaneObject),
|
|
1116
|
-
isometricObjects: canvasObjects.filter(
|
|
1118
|
+
isometricObjects: canvasObjects.filter(chunkSKGJXCAO_cjs.isIsometricObject).map(isometricObject),
|
|
1117
1119
|
paths: canvasObjects.filter((canvasObject) => canvasObject.objectType === "path").map(pathObject),
|
|
1118
|
-
dimensions: canvasObjects.filter(
|
|
1120
|
+
dimensions: canvasObjects.filter(chunkSKGJXCAO_cjs.isDimensionObject).map(dimensionObject),
|
|
1119
1121
|
charts: canvasObjects.filter((canvasObject) => canvasObject.objectType === "chart").map(chartObject),
|
|
1120
1122
|
components: canvasObjects.filter(
|
|
1121
1123
|
(canvasObject) => canvasObject.objectType === "component" && canvasObject.component !== void 0
|
|
@@ -1142,9 +1144,9 @@ function sidePoint(canvasObject, endpoint) {
|
|
|
1142
1144
|
function namedPortPoint(canvasObject, endpoint) {
|
|
1143
1145
|
const port = canvasObject.symbol?.ports?.find((candidate) => candidate.name === endpoint.port);
|
|
1144
1146
|
if (!port) {
|
|
1145
|
-
return
|
|
1147
|
+
return chunkSKGJXCAO_cjs.elementCenter(canvasObject);
|
|
1146
1148
|
}
|
|
1147
|
-
return
|
|
1149
|
+
return chunkSKGJXCAO_cjs.pointAtNormalizedPort(
|
|
1148
1150
|
{
|
|
1149
1151
|
x: canvasObject.x,
|
|
1150
1152
|
y: canvasObject.y,
|
|
@@ -1190,7 +1192,7 @@ function explicitAnchorPoint(canvasObject, endpoint) {
|
|
|
1190
1192
|
return null;
|
|
1191
1193
|
}
|
|
1192
1194
|
function automaticEndpointPoint(canvasObject, opposite) {
|
|
1193
|
-
return opposite ?
|
|
1195
|
+
return opposite ? chunkSKGJXCAO_cjs.edgePointToward(canvasObject, opposite) : chunkSKGJXCAO_cjs.elementCenter(canvasObject);
|
|
1194
1196
|
}
|
|
1195
1197
|
function findPositionedCanvasObject(canvasObjects, id) {
|
|
1196
1198
|
return canvasObjects.find((candidate) => candidate.id === id);
|
|
@@ -1208,7 +1210,7 @@ function positionedCanvasObjects(canvasObjects) {
|
|
|
1208
1210
|
];
|
|
1209
1211
|
}
|
|
1210
1212
|
function connectionEndpointPoint(object, face) {
|
|
1211
|
-
return object ?
|
|
1213
|
+
return object ? chunkSKGJXCAO_cjs.isometricFaceCenter(object, face) : { x: 0, y: 0 };
|
|
1212
1214
|
}
|
|
1213
1215
|
function isometricStackPosition(isometricObjects, id) {
|
|
1214
1216
|
const index = isometricObjects.findIndex((object2) => object2.id === id);
|
|
@@ -1223,8 +1225,8 @@ function connectionStack(isometricObjects, connection) {
|
|
|
1223
1225
|
return { order: connection.order, sourceIndex: connection.sourceIndex };
|
|
1224
1226
|
}
|
|
1225
1227
|
const behind = [
|
|
1226
|
-
|
|
1227
|
-
|
|
1228
|
+
chunkSKGJXCAO_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.fromFace) ? void 0 : isometricStackPosition(isometricObjects, connection.fromId),
|
|
1229
|
+
chunkSKGJXCAO_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.toFace) ? void 0 : isometricStackPosition(isometricObjects, connection.toId)
|
|
1228
1230
|
].filter((position) => position !== void 0);
|
|
1229
1231
|
if (!behind.length) {
|
|
1230
1232
|
return { sourceIndex: connection.sourceIndex };
|
|
@@ -1266,7 +1268,7 @@ function createRenderInputLinks(canvasObjects) {
|
|
|
1266
1268
|
|
|
1267
1269
|
// src/renderInput/fromSfl/index.ts
|
|
1268
1270
|
function sflToRenderInput(sfl) {
|
|
1269
|
-
const state =
|
|
1271
|
+
const state = chunkSKGJXCAO_cjs.sflToCanvasState(sfl);
|
|
1270
1272
|
const canvasObjects = collectCanvasObjects(state);
|
|
1271
1273
|
return {
|
|
1272
1274
|
shapes: canvasObjects.shapes,
|
|
@@ -1285,13 +1287,13 @@ function sflToRenderInput(sfl) {
|
|
|
1285
1287
|
// src/renderScene/artifacts/component/placeholder.ts
|
|
1286
1288
|
var STROKE = "#94a3b8";
|
|
1287
1289
|
function buildPlaceholder(component, index) {
|
|
1288
|
-
const x =
|
|
1289
|
-
const y =
|
|
1290
|
-
const width = Math.max(0,
|
|
1291
|
-
const height = Math.max(0,
|
|
1292
|
-
const rotation =
|
|
1290
|
+
const x = chunkSKGJXCAO_cjs.finite(component.x, 0);
|
|
1291
|
+
const y = chunkSKGJXCAO_cjs.finite(component.y, 0);
|
|
1292
|
+
const width = Math.max(0, chunkSKGJXCAO_cjs.finite(component.width, 120));
|
|
1293
|
+
const height = Math.max(0, chunkSKGJXCAO_cjs.finite(component.height, 60));
|
|
1294
|
+
const rotation = chunkSKGJXCAO_cjs.finite(component.rotation, 0);
|
|
1293
1295
|
const order = 1e4 + index;
|
|
1294
|
-
const bounds =
|
|
1296
|
+
const bounds = chunkSKGJXCAO_cjs.rotatedBounds({ x, y, width, height }, rotation, 2);
|
|
1295
1297
|
return [
|
|
1296
1298
|
{
|
|
1297
1299
|
id: `widget-${component.id}`,
|
|
@@ -1316,7 +1318,7 @@ function buildPlaceholder(component, index) {
|
|
|
1316
1318
|
width,
|
|
1317
1319
|
height,
|
|
1318
1320
|
lines: [component.type],
|
|
1319
|
-
fontFamily:
|
|
1321
|
+
fontFamily: chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
1320
1322
|
fontSize: 12,
|
|
1321
1323
|
fontWeight: "normal",
|
|
1322
1324
|
color: STROKE,
|
|
@@ -1330,44 +1332,44 @@ function buildPlaceholder(component, index) {
|
|
|
1330
1332
|
|
|
1331
1333
|
// src/renderScene/artifacts/component/builtIn.ts
|
|
1332
1334
|
function buildRollingNumber(component, index) {
|
|
1333
|
-
const x =
|
|
1334
|
-
const y =
|
|
1335
|
-
const width = Math.max(0,
|
|
1336
|
-
const height = Math.max(0,
|
|
1337
|
-
const rotation =
|
|
1335
|
+
const x = chunkSKGJXCAO_cjs.finite(component.x, 0);
|
|
1336
|
+
const y = chunkSKGJXCAO_cjs.finite(component.y, 0);
|
|
1337
|
+
const width = Math.max(0, chunkSKGJXCAO_cjs.finite(component.width, 160));
|
|
1338
|
+
const height = Math.max(0, chunkSKGJXCAO_cjs.finite(component.height, 90));
|
|
1339
|
+
const rotation = chunkSKGJXCAO_cjs.finite(component.rotation, 0);
|
|
1338
1340
|
return [
|
|
1339
1341
|
{
|
|
1340
1342
|
id: `widget-${component.id}`,
|
|
1341
1343
|
type: "rolling-number",
|
|
1342
1344
|
order: 1e4 + index,
|
|
1343
|
-
bounds:
|
|
1345
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1344
1346
|
x,
|
|
1345
1347
|
y,
|
|
1346
1348
|
width,
|
|
1347
1349
|
height,
|
|
1348
1350
|
rotation,
|
|
1349
|
-
value:
|
|
1351
|
+
value: chunkSKGJXCAO_cjs.formatRollingNumber(component.value, component.digits),
|
|
1350
1352
|
digits: component.digits,
|
|
1351
|
-
duration: Math.max(0,
|
|
1353
|
+
duration: Math.max(0, chunkSKGJXCAO_cjs.finite(component.duration, 420)),
|
|
1352
1354
|
label: component.label,
|
|
1353
|
-
componentStyle:
|
|
1355
|
+
componentStyle: chunkSKGJXCAO_cjs.resolveRollingNumberStyle(component.style)
|
|
1354
1356
|
}
|
|
1355
1357
|
];
|
|
1356
1358
|
}
|
|
1357
1359
|
function buildTickScale(component, index) {
|
|
1358
|
-
const x =
|
|
1359
|
-
const y =
|
|
1360
|
-
const width = Math.max(0,
|
|
1361
|
-
const height = Math.max(0,
|
|
1362
|
-
const rotation =
|
|
1363
|
-
const max =
|
|
1364
|
-
const progress = Math.min(1, Math.max(0,
|
|
1360
|
+
const x = chunkSKGJXCAO_cjs.finite(component.x, 0);
|
|
1361
|
+
const y = chunkSKGJXCAO_cjs.finite(component.y, 0);
|
|
1362
|
+
const width = Math.max(0, chunkSKGJXCAO_cjs.finite(component.width, 200));
|
|
1363
|
+
const height = Math.max(0, chunkSKGJXCAO_cjs.finite(component.height, 200));
|
|
1364
|
+
const rotation = chunkSKGJXCAO_cjs.finite(component.rotation, 0);
|
|
1365
|
+
const max = chunkSKGJXCAO_cjs.finite(component.max, 100) || 100;
|
|
1366
|
+
const progress = Math.min(1, Math.max(0, chunkSKGJXCAO_cjs.finite(Number(component.value), 0) / max));
|
|
1365
1367
|
const nodes = [
|
|
1366
1368
|
{
|
|
1367
1369
|
id: `widget-${component.id}`,
|
|
1368
1370
|
type: "shader-surface",
|
|
1369
1371
|
order: 1e4 + index,
|
|
1370
|
-
bounds:
|
|
1372
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1371
1373
|
x,
|
|
1372
1374
|
y,
|
|
1373
1375
|
width,
|
|
@@ -1384,12 +1386,12 @@ function buildTickScale(component, index) {
|
|
|
1384
1386
|
}
|
|
1385
1387
|
function buildTickLabels(component, box) {
|
|
1386
1388
|
const labels = component.labels ?? {};
|
|
1387
|
-
const ticks2 = Math.max(1,
|
|
1388
|
-
const major = Math.max(1,
|
|
1389
|
-
const start =
|
|
1390
|
-
const sweep =
|
|
1391
|
-
const radius =
|
|
1392
|
-
const fontSize =
|
|
1389
|
+
const ticks2 = Math.max(1, chunkSKGJXCAO_cjs.finite(Number(component.parameters.ticks), 48));
|
|
1390
|
+
const major = Math.max(1, chunkSKGJXCAO_cjs.finite(Number(component.parameters.major), 5));
|
|
1391
|
+
const start = chunkSKGJXCAO_cjs.finite(Number(component.parameters.start), 225) * Math.PI / 180;
|
|
1392
|
+
const sweep = chunkSKGJXCAO_cjs.finite(Number(component.parameters.sweep), 270) * Math.PI / 180;
|
|
1393
|
+
const radius = chunkSKGJXCAO_cjs.finite(Number(component.parameters.radius), 0.9) + chunkSKGJXCAO_cjs.finite(labels.offset, 0.08);
|
|
1394
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(labels.size, 12);
|
|
1393
1395
|
const centerX = box.x + box.width / 2;
|
|
1394
1396
|
const centerY = box.y + box.height / 2;
|
|
1395
1397
|
const count = Math.floor(ticks2 / major);
|
|
@@ -1404,10 +1406,10 @@ function buildTickLabels(component, box) {
|
|
|
1404
1406
|
id: `widget-${component.id}-label-${step}`,
|
|
1405
1407
|
type: "text",
|
|
1406
1408
|
order: box.order + 0.1,
|
|
1407
|
-
bounds:
|
|
1409
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1408
1410
|
...labelBox,
|
|
1409
1411
|
lines: [String(Math.round(box.max * fraction * 10) / 10)],
|
|
1410
|
-
fontFamily: labels.fontFamily ||
|
|
1412
|
+
fontFamily: labels.fontFamily || chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
1411
1413
|
fontSize,
|
|
1412
1414
|
fontWeight: labels.weight ?? "normal",
|
|
1413
1415
|
color: labels.color || "#8f95c4",
|
|
@@ -1419,20 +1421,20 @@ function buildTickLabels(component, box) {
|
|
|
1419
1421
|
return nodes;
|
|
1420
1422
|
}
|
|
1421
1423
|
function buildRuler(component, index) {
|
|
1422
|
-
const x =
|
|
1423
|
-
const y =
|
|
1424
|
-
const width = Math.max(0,
|
|
1425
|
-
const height = Math.max(0,
|
|
1426
|
-
const rotation =
|
|
1427
|
-
const min =
|
|
1428
|
-
const max =
|
|
1429
|
-
const progress = max === min ? 0 : Math.min(1, Math.max(0, (
|
|
1424
|
+
const x = chunkSKGJXCAO_cjs.finite(component.x, 0);
|
|
1425
|
+
const y = chunkSKGJXCAO_cjs.finite(component.y, 0);
|
|
1426
|
+
const width = Math.max(0, chunkSKGJXCAO_cjs.finite(component.width, 120));
|
|
1427
|
+
const height = Math.max(0, chunkSKGJXCAO_cjs.finite(component.height, 360));
|
|
1428
|
+
const rotation = chunkSKGJXCAO_cjs.finite(component.rotation, 0);
|
|
1429
|
+
const min = chunkSKGJXCAO_cjs.finite(component.min, 0);
|
|
1430
|
+
const max = chunkSKGJXCAO_cjs.finite(component.max, 100);
|
|
1431
|
+
const progress = max === min ? 0 : Math.min(1, Math.max(0, (chunkSKGJXCAO_cjs.finite(Number(component.value), min) - min) / (max - min)));
|
|
1430
1432
|
const nodes = [
|
|
1431
1433
|
{
|
|
1432
1434
|
id: `widget-${component.id}`,
|
|
1433
1435
|
type: "shader-surface",
|
|
1434
1436
|
order: 1e4 + index,
|
|
1435
|
-
bounds:
|
|
1437
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1436
1438
|
x,
|
|
1437
1439
|
y,
|
|
1438
1440
|
width,
|
|
@@ -1450,14 +1452,14 @@ function buildRuler(component, index) {
|
|
|
1450
1452
|
function buildRulerLabels(component, box) {
|
|
1451
1453
|
const labels = component.labels ?? {};
|
|
1452
1454
|
const horizontal = component.parameters.axis === "horizontal";
|
|
1453
|
-
const ticks2 = Math.max(1,
|
|
1454
|
-
const major = Math.max(1,
|
|
1455
|
-
const inset =
|
|
1456
|
-
const line =
|
|
1455
|
+
const ticks2 = Math.max(1, chunkSKGJXCAO_cjs.finite(Number(component.parameters.ticks), 50));
|
|
1456
|
+
const major = Math.max(1, chunkSKGJXCAO_cjs.finite(Number(component.parameters.major), 5));
|
|
1457
|
+
const inset = chunkSKGJXCAO_cjs.finite(Number(component.parameters.inset), 0.05) > 0 ? chunkSKGJXCAO_cjs.finite(Number(component.parameters.inset), 0.05) : 0.05;
|
|
1458
|
+
const line = chunkSKGJXCAO_cjs.finite(Number(component.parameters.line), 0.7) > 0 ? chunkSKGJXCAO_cjs.finite(Number(component.parameters.line), 0.7) : 0.7;
|
|
1457
1459
|
const across = horizontal ? box.height : box.width;
|
|
1458
|
-
const tickLength = (
|
|
1459
|
-
const edge = line * across - 0.12 * across - tickLength -
|
|
1460
|
-
const fontSize =
|
|
1460
|
+
const tickLength = (chunkSKGJXCAO_cjs.finite(Number(component.parameters.length), 0.1) > 0 ? chunkSKGJXCAO_cjs.finite(Number(component.parameters.length), 0.1) : 0.1) * across * 1.9;
|
|
1461
|
+
const edge = line * across - 0.12 * across - tickLength - chunkSKGJXCAO_cjs.finite(labels.offset, 0.04) * across;
|
|
1462
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(labels.size, 12);
|
|
1461
1463
|
const count = Math.floor(ticks2 / major);
|
|
1462
1464
|
const nodes = [];
|
|
1463
1465
|
for (let step = 0; step <= count; step += 1) {
|
|
@@ -1468,10 +1470,10 @@ function buildRulerLabels(component, box) {
|
|
|
1468
1470
|
id: `widget-${component.id}-label-${step}`,
|
|
1469
1471
|
type: "text",
|
|
1470
1472
|
order: box.order + 0.1,
|
|
1471
|
-
bounds:
|
|
1473
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1472
1474
|
...labelBox,
|
|
1473
1475
|
lines: [String(Math.round((box.min + (box.max - box.min) * fraction) * 10) / 10)],
|
|
1474
|
-
fontFamily: labels.fontFamily ||
|
|
1476
|
+
fontFamily: labels.fontFamily || chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
1475
1477
|
fontSize,
|
|
1476
1478
|
fontWeight: labels.weight ?? "normal",
|
|
1477
1479
|
color: labels.color || "#8f95c4",
|
|
@@ -1487,10 +1489,10 @@ function buildRulerLabels(component, box) {
|
|
|
1487
1489
|
var DISABLED_INK = "#94a3b8";
|
|
1488
1490
|
function controlBox(component, index, fallback) {
|
|
1489
1491
|
return {
|
|
1490
|
-
x:
|
|
1491
|
-
y:
|
|
1492
|
-
width: Math.max(1,
|
|
1493
|
-
height: Math.max(1,
|
|
1492
|
+
x: chunkSKGJXCAO_cjs.finite(component.x, 0),
|
|
1493
|
+
y: chunkSKGJXCAO_cjs.finite(component.y, 0),
|
|
1494
|
+
width: Math.max(1, chunkSKGJXCAO_cjs.finite(component.width, fallback.width)),
|
|
1495
|
+
height: Math.max(1, chunkSKGJXCAO_cjs.finite(component.height, fallback.height)),
|
|
1494
1496
|
order: 1e4 + index
|
|
1495
1497
|
};
|
|
1496
1498
|
}
|
|
@@ -1508,7 +1510,7 @@ function hitArea(component, box, takesClicks = true) {
|
|
|
1508
1510
|
id: `widget-${component.id}`,
|
|
1509
1511
|
type: "rect",
|
|
1510
1512
|
order: box.order,
|
|
1511
|
-
bounds:
|
|
1513
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(box, 0, 0),
|
|
1512
1514
|
x: box.x,
|
|
1513
1515
|
y: box.y,
|
|
1514
1516
|
width: box.width,
|
|
@@ -1521,13 +1523,13 @@ function labelText(component, part, area, label, order) {
|
|
|
1521
1523
|
id: `widget-${component.id}-${part}`,
|
|
1522
1524
|
type: "text",
|
|
1523
1525
|
order,
|
|
1524
|
-
bounds:
|
|
1526
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(area, 0, 0),
|
|
1525
1527
|
x: area.x,
|
|
1526
1528
|
y: area.y,
|
|
1527
1529
|
width: area.width,
|
|
1528
1530
|
height: area.height,
|
|
1529
1531
|
lines: [label.text],
|
|
1530
|
-
fontFamily:
|
|
1532
|
+
fontFamily: chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
1531
1533
|
fontSize: label.fontSize,
|
|
1532
1534
|
fontWeight: "600",
|
|
1533
1535
|
color: label.color,
|
|
@@ -1546,7 +1548,7 @@ function buildButton(component, index) {
|
|
|
1546
1548
|
id: `widget-${component.id}-face`,
|
|
1547
1549
|
type: "rect",
|
|
1548
1550
|
order: box.order + 0.1,
|
|
1549
|
-
bounds:
|
|
1551
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(box, 0, 0),
|
|
1550
1552
|
x: box.x,
|
|
1551
1553
|
y: box.y,
|
|
1552
1554
|
width: box.width,
|
|
@@ -1585,7 +1587,7 @@ function boxNode(component, box, square) {
|
|
|
1585
1587
|
id: `widget-${component.id}-box`,
|
|
1586
1588
|
type: "rect",
|
|
1587
1589
|
order: box.order + 0.1,
|
|
1588
|
-
bounds:
|
|
1590
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(square, 0, 2),
|
|
1589
1591
|
...square,
|
|
1590
1592
|
rx: square.width * CORNER_RATIO,
|
|
1591
1593
|
style: fade(component, {
|
|
@@ -1600,7 +1602,7 @@ function checkNode(component, box, square) {
|
|
|
1600
1602
|
id: `widget-${component.id}-check`,
|
|
1601
1603
|
type: "path",
|
|
1602
1604
|
order: box.order + 0.2,
|
|
1603
|
-
bounds:
|
|
1605
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(square, 0, 0),
|
|
1604
1606
|
d: checkPath(square),
|
|
1605
1607
|
style: fade(component, {
|
|
1606
1608
|
fill: { kind: "none" },
|
|
@@ -1637,7 +1639,7 @@ function buildCheckbox(component, index) {
|
|
|
1637
1639
|
// src/renderScene/artifacts/component/hand.ts
|
|
1638
1640
|
var MIN_TIP = 0.25;
|
|
1639
1641
|
function withAlpha(color, alpha) {
|
|
1640
|
-
const rgb =
|
|
1642
|
+
const rgb = chunkSKGJXCAO_cjs.parseHexRgb(color);
|
|
1641
1643
|
return rgb && alpha < 1 ? `rgba(${rgb[0]}, ${rgb[1]}, ${rgb[2]}, ${Number(alpha.toFixed(3))})` : color;
|
|
1642
1644
|
}
|
|
1643
1645
|
var num = (value) => String(Number(value.toFixed(3)));
|
|
@@ -1727,7 +1729,7 @@ function handLayer(component, box, base, angle, layer, order) {
|
|
|
1727
1729
|
id: `widget-${component.id}-${layer.part}`,
|
|
1728
1730
|
type: "path",
|
|
1729
1731
|
order: box.order + order,
|
|
1730
|
-
bounds:
|
|
1732
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(extent, 0, 0),
|
|
1731
1733
|
d: outline(hand),
|
|
1732
1734
|
rotation: angle,
|
|
1733
1735
|
rotationCenter: { x: hand.cx, y: hand.cy },
|
|
@@ -1834,7 +1836,7 @@ function hubNode(component, box, hand, radius) {
|
|
|
1834
1836
|
id: `widget-${component.id}-hub`,
|
|
1835
1837
|
type: "ellipse",
|
|
1836
1838
|
order: box.order + 0.4,
|
|
1837
|
-
bounds:
|
|
1839
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(
|
|
1838
1840
|
{ x: hand.cx - radius, y: hand.cy - radius, width: radius * 2, height: radius * 2 },
|
|
1839
1841
|
0,
|
|
1840
1842
|
ringWidth
|
|
@@ -1875,7 +1877,7 @@ function pickNodes(component, box, hand, angle) {
|
|
|
1875
1877
|
id: `widget-${component.id}-pick`,
|
|
1876
1878
|
type: "path",
|
|
1877
1879
|
order: box.order + 0.5,
|
|
1878
|
-
bounds:
|
|
1880
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(extent, 0, 0),
|
|
1879
1881
|
d: outline(reach),
|
|
1880
1882
|
rotation: angle,
|
|
1881
1883
|
rotationCenter: { x: reach.cx, y: reach.cy },
|
|
@@ -1931,7 +1933,7 @@ function arcNode(component, box, dial, part, order, color, length, extra = {}) {
|
|
|
1931
1933
|
id: `widget-${component.id}-${part}`,
|
|
1932
1934
|
type: "ellipse",
|
|
1933
1935
|
order: box.order + order,
|
|
1934
|
-
bounds:
|
|
1936
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
1935
1937
|
cx,
|
|
1936
1938
|
cy,
|
|
1937
1939
|
rx: radius,
|
|
@@ -1952,7 +1954,7 @@ function discNode(component, box, part, order, center, radius, fill2) {
|
|
|
1952
1954
|
id: `widget-${component.id}-${part}`,
|
|
1953
1955
|
type: "ellipse",
|
|
1954
1956
|
order: box.order + order,
|
|
1955
|
-
bounds:
|
|
1957
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x: center.x - radius, y: center.y - radius, width: radius * 2, height: radius * 2 }, 0, 0),
|
|
1956
1958
|
cx: center.x,
|
|
1957
1959
|
cy: center.y,
|
|
1958
1960
|
rx: radius,
|
|
@@ -2032,7 +2034,7 @@ function buildRing(component, box, fraction, round2) {
|
|
|
2032
2034
|
id: `widget-${component.id}-${part}`,
|
|
2033
2035
|
type: "ellipse",
|
|
2034
2036
|
order: box.order + order,
|
|
2035
|
-
bounds:
|
|
2037
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
2036
2038
|
cx,
|
|
2037
2039
|
cy,
|
|
2038
2040
|
rx: radius,
|
|
@@ -2058,7 +2060,7 @@ function buildBar(component, box, fraction, round2) {
|
|
|
2058
2060
|
id: `widget-${component.id}-${part}`,
|
|
2059
2061
|
type: "rect",
|
|
2060
2062
|
order: box.order + order,
|
|
2061
|
-
bounds:
|
|
2063
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(shape, 0, 0),
|
|
2062
2064
|
...shape,
|
|
2063
2065
|
rx: radius,
|
|
2064
2066
|
style: fade(component, {
|
|
@@ -2113,7 +2115,7 @@ function buildSegmented(component, index) {
|
|
|
2113
2115
|
id: `widget-${component.id}-track`,
|
|
2114
2116
|
type: "rect",
|
|
2115
2117
|
order: box.order + 0.1,
|
|
2116
|
-
bounds:
|
|
2118
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(box, 0, 0),
|
|
2117
2119
|
x: box.x,
|
|
2118
2120
|
y: box.y,
|
|
2119
2121
|
width: box.width,
|
|
@@ -2125,7 +2127,7 @@ function buildSegmented(component, index) {
|
|
|
2125
2127
|
id: `widget-${component.id}-active`,
|
|
2126
2128
|
type: "rect",
|
|
2127
2129
|
order: box.order + 0.2,
|
|
2128
|
-
bounds:
|
|
2130
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x: box.x + inset + active * cellWidth, width: cellWidth, ...cell }, 0, 0),
|
|
2129
2131
|
x: box.x + inset + active * cellWidth,
|
|
2130
2132
|
y: cell.y,
|
|
2131
2133
|
width: cellWidth,
|
|
@@ -2177,7 +2179,7 @@ var rect = (component, box, part, order, shape, color, extra = {}) => ({
|
|
|
2177
2179
|
id: `widget-${component.id}-${part}`,
|
|
2178
2180
|
type: "rect",
|
|
2179
2181
|
order: box.order + order,
|
|
2180
|
-
bounds:
|
|
2182
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(shape, 0, 0),
|
|
2181
2183
|
...shape,
|
|
2182
2184
|
style: fade(component, { fill: solid(color), stroke: { kind: "none" }, ...extra })
|
|
2183
2185
|
});
|
|
@@ -2233,7 +2235,7 @@ function buildLine(component, box, thumbs, vertical) {
|
|
|
2233
2235
|
id: `widget-${component.id}-${part}`,
|
|
2234
2236
|
type: "ellipse",
|
|
2235
2237
|
order: box.order + order,
|
|
2236
|
-
bounds:
|
|
2238
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, 0),
|
|
2237
2239
|
cx,
|
|
2238
2240
|
cy,
|
|
2239
2241
|
rx: radius,
|
|
@@ -2395,7 +2397,7 @@ function buildSwitch(component, index) {
|
|
|
2395
2397
|
id: `widget-${component.id}-track`,
|
|
2396
2398
|
type: "rect",
|
|
2397
2399
|
order: box.order + 0.1,
|
|
2398
|
-
bounds:
|
|
2400
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(box, 0, 0),
|
|
2399
2401
|
x: box.x,
|
|
2400
2402
|
y: box.y,
|
|
2401
2403
|
width: box.width,
|
|
@@ -2410,7 +2412,7 @@ function buildSwitch(component, index) {
|
|
|
2410
2412
|
id: `widget-${component.id}-thumb`,
|
|
2411
2413
|
type: "ellipse",
|
|
2412
2414
|
order: box.order + 0.2,
|
|
2413
|
-
bounds:
|
|
2415
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(thumb, 0, 0),
|
|
2414
2416
|
cx: centerX,
|
|
2415
2417
|
cy: box.y + box.height / 2,
|
|
2416
2418
|
rx: radius,
|
|
@@ -2434,7 +2436,7 @@ function buildToggleButton(component, index) {
|
|
|
2434
2436
|
id: `widget-${component.id}-face`,
|
|
2435
2437
|
type: "rect",
|
|
2436
2438
|
order: box.order + 0.1,
|
|
2437
|
-
bounds:
|
|
2439
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(box, 0, 2),
|
|
2438
2440
|
x: box.x,
|
|
2439
2441
|
y: box.y,
|
|
2440
2442
|
width: box.width,
|
|
@@ -2490,8 +2492,8 @@ function getComponentBuilder(type) {
|
|
|
2490
2492
|
|
|
2491
2493
|
// src/renderScene/artifacts/component/build.ts
|
|
2492
2494
|
function ariaOf(component) {
|
|
2493
|
-
const role =
|
|
2494
|
-
if (!role || !
|
|
2495
|
+
const role = chunkSKGJXCAO_cjs.getComponentDescriptor(component.type)?.role;
|
|
2496
|
+
if (!role || !chunkSKGJXCAO_cjs.isGenericComponent(component)) {
|
|
2495
2497
|
return void 0;
|
|
2496
2498
|
}
|
|
2497
2499
|
const flag = typeof component.value === "boolean" ? component.value : void 0;
|
|
@@ -2502,12 +2504,12 @@ function ariaOf(component) {
|
|
|
2502
2504
|
};
|
|
2503
2505
|
}
|
|
2504
2506
|
function labelOf(component) {
|
|
2505
|
-
return component.label ?? (
|
|
2507
|
+
return component.label ?? (chunkSKGJXCAO_cjs.isGenericComponent(component) ? component.id : String(component.value));
|
|
2506
2508
|
}
|
|
2507
2509
|
function buildComponents(components) {
|
|
2508
2510
|
return components.flatMap((component, index) => {
|
|
2509
2511
|
const build = getComponentBuilder(component.type) ?? buildPlaceholder;
|
|
2510
|
-
const nodes =
|
|
2512
|
+
const nodes = chunkSKGJXCAO_cjs.tag(
|
|
2511
2513
|
build(component, index),
|
|
2512
2514
|
"widget",
|
|
2513
2515
|
component.id,
|
|
@@ -2547,13 +2549,13 @@ function tabBox(input, thickness, length) {
|
|
|
2547
2549
|
y,
|
|
2548
2550
|
width: length,
|
|
2549
2551
|
height: thickness,
|
|
2550
|
-
path:
|
|
2552
|
+
path: chunkSKGJXCAO_cjs.bottomRoundedRectPath(x, y, length, thickness, TAB_RADIUS)
|
|
2551
2553
|
};
|
|
2552
2554
|
}
|
|
2553
2555
|
case "left": {
|
|
2554
2556
|
const x = input.x - thickness;
|
|
2555
2557
|
const y = input.y - inset;
|
|
2556
|
-
return { x, y, width: thickness, height: length, path:
|
|
2558
|
+
return { x, y, width: thickness, height: length, path: chunkSKGJXCAO_cjs.leftRoundedRectPath(x, y, thickness, length, TAB_RADIUS) };
|
|
2557
2559
|
}
|
|
2558
2560
|
case "right": {
|
|
2559
2561
|
const x = input.x + input.width;
|
|
@@ -2563,13 +2565,13 @@ function tabBox(input, thickness, length) {
|
|
|
2563
2565
|
y,
|
|
2564
2566
|
width: thickness,
|
|
2565
2567
|
height: length,
|
|
2566
|
-
path:
|
|
2568
|
+
path: chunkSKGJXCAO_cjs.rightRoundedRectPath(x, y, thickness, length, TAB_RADIUS)
|
|
2567
2569
|
};
|
|
2568
2570
|
}
|
|
2569
2571
|
default: {
|
|
2570
2572
|
const x = input.x - inset;
|
|
2571
2573
|
const y = input.y - thickness;
|
|
2572
|
-
return { x, y, width: length, height: thickness, path:
|
|
2574
|
+
return { x, y, width: length, height: thickness, path: chunkSKGJXCAO_cjs.topRoundedRectPath(x, y, length, thickness, TAB_RADIUS) };
|
|
2573
2575
|
}
|
|
2574
2576
|
}
|
|
2575
2577
|
}
|
|
@@ -2578,7 +2580,7 @@ function renderTitleTab(input) {
|
|
|
2578
2580
|
const padding = 16;
|
|
2579
2581
|
const length = Math.max(120, input.title.length * input.fontSize * 0.62 + padding * 2);
|
|
2580
2582
|
const box = tabBox(input, thickness, length);
|
|
2581
|
-
const bounds =
|
|
2583
|
+
const bounds = chunkSKGJXCAO_cjs.boxBounds(box, 6);
|
|
2582
2584
|
const vertical = input.labelPosition === "left" || input.labelPosition === "right";
|
|
2583
2585
|
return [
|
|
2584
2586
|
{
|
|
@@ -2606,7 +2608,7 @@ function horizontalTitleText(input, box, padding, bounds) {
|
|
|
2606
2608
|
width: Math.max(0, box.width - padding * 2),
|
|
2607
2609
|
height: box.height,
|
|
2608
2610
|
lines: [input.title],
|
|
2609
|
-
fontFamily: input.fontFamily ??
|
|
2611
|
+
fontFamily: input.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
2610
2612
|
fontSize: input.fontSize,
|
|
2611
2613
|
fontWeight: input.fontWeight,
|
|
2612
2614
|
color: input.textColor,
|
|
@@ -2630,7 +2632,7 @@ function verticalTitleText(input, box, padding, bounds) {
|
|
|
2630
2632
|
width: textLength,
|
|
2631
2633
|
height: textThickness,
|
|
2632
2634
|
lines: [input.title],
|
|
2633
|
-
fontFamily: input.fontFamily ??
|
|
2635
|
+
fontFamily: input.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
2634
2636
|
fontSize: input.fontSize,
|
|
2635
2637
|
fontWeight: input.fontWeight,
|
|
2636
2638
|
color: input.textColor,
|
|
@@ -2651,7 +2653,7 @@ var SQUARED_CORNER_BY_LABEL_POSITION = {
|
|
|
2651
2653
|
};
|
|
2652
2654
|
function frameBoundaryNode(frame, order, hasTab) {
|
|
2653
2655
|
const shadow = frame.shadow ?? true;
|
|
2654
|
-
const bounds =
|
|
2656
|
+
const bounds = chunkSKGJXCAO_cjs.boxBounds(
|
|
2655
2657
|
{ x: frame.x, y: frame.y, width: frame.width, height: frame.height },
|
|
2656
2658
|
frame.strokeWidth + (shadow ? 20 : 4)
|
|
2657
2659
|
);
|
|
@@ -2686,7 +2688,7 @@ function frameBoundaryNode(frame, order, hasTab) {
|
|
|
2686
2688
|
id: `frame-${frame.id}`,
|
|
2687
2689
|
order,
|
|
2688
2690
|
bounds,
|
|
2689
|
-
d:
|
|
2691
|
+
d: chunkSKGJXCAO_cjs.cornersRoundedRectPath(frame.x, frame.y, frame.width, frame.height, radii),
|
|
2690
2692
|
detail: { of: "frameBoundary", cornerRadius: frame.cornerRadius, squareCorner: squared },
|
|
2691
2693
|
style
|
|
2692
2694
|
};
|
|
@@ -2775,7 +2777,7 @@ function labelBase(context, lane, index) {
|
|
|
2775
2777
|
id: `swimlane-label-${context.swimlane.id}-${lane.id}`,
|
|
2776
2778
|
order: context.order + 0.5 + index / 100,
|
|
2777
2779
|
lines: [lane.label],
|
|
2778
|
-
fontFamily: context.swimlane.fontFamily ??
|
|
2780
|
+
fontFamily: context.swimlane.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
2779
2781
|
fontSize: context.swimlane.fontSize,
|
|
2780
2782
|
fontWeight: context.swimlane.fontWeight,
|
|
2781
2783
|
color: context.swimlane.textColor,
|
|
@@ -2791,7 +2793,7 @@ function horizontalLabel(context, lane, index) {
|
|
|
2791
2793
|
const y = centerY - thickness / 2;
|
|
2792
2794
|
return {
|
|
2793
2795
|
...labelBase(context, lane, index),
|
|
2794
|
-
bounds:
|
|
2796
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x, y, width, height: thickness }, -90, 12),
|
|
2795
2797
|
x,
|
|
2796
2798
|
y,
|
|
2797
2799
|
width,
|
|
@@ -2843,7 +2845,7 @@ function createSwimlaneRenderContext(swimlane, index) {
|
|
|
2843
2845
|
return {
|
|
2844
2846
|
swimlane,
|
|
2845
2847
|
order: 5e3 + index,
|
|
2846
|
-
bounds:
|
|
2848
|
+
bounds: chunkSKGJXCAO_cjs.boxBounds(
|
|
2847
2849
|
{ x: swimlane.x, y: swimlane.y, width: swimlane.width, height: swimlane.height },
|
|
2848
2850
|
swimlane.strokeWidth + 4
|
|
2849
2851
|
),
|
|
@@ -2882,9 +2884,9 @@ function buildSwimlane(swimlane, index) {
|
|
|
2882
2884
|
function buildContainers(input) {
|
|
2883
2885
|
return [
|
|
2884
2886
|
...input.frames.flatMap(
|
|
2885
|
-
(frame, index) =>
|
|
2887
|
+
(frame, index) => chunkSKGJXCAO_cjs.tag(buildFrame(frame, index), "frame", frame.id, frame.screen ? "screen" : void 0, frame.title ?? void 0)
|
|
2886
2888
|
),
|
|
2887
|
-
...input.swimlanes.flatMap((swimlane, index) =>
|
|
2889
|
+
...input.swimlanes.flatMap((swimlane, index) => chunkSKGJXCAO_cjs.tag(buildSwimlane(swimlane, index), "swimlane", swimlane.id))
|
|
2888
2890
|
];
|
|
2889
2891
|
}
|
|
2890
2892
|
|
|
@@ -2934,7 +2936,7 @@ var DEFAULT_COLOR = "#475569";
|
|
|
2934
2936
|
var CHAR_WIDTH = 0.6;
|
|
2935
2937
|
var pathData = (segments) => segments.map(([from, to]) => `M ${from.x} ${from.y} L ${to.x} ${to.y}`).join(" ");
|
|
2936
2938
|
function pathNode(dimension, name, order, segments) {
|
|
2937
|
-
const strokeWidth = Math.max(0,
|
|
2939
|
+
const strokeWidth = Math.max(0, chunkSKGJXCAO_cjs.finite(dimension.strokeWidth, 1));
|
|
2938
2940
|
const points = segments.flat();
|
|
2939
2941
|
return {
|
|
2940
2942
|
type: "path",
|
|
@@ -2956,7 +2958,7 @@ function pathNode(dimension, name, order, segments) {
|
|
|
2956
2958
|
};
|
|
2957
2959
|
}
|
|
2958
2960
|
function labelNode2(dimension, order, text, center, angle) {
|
|
2959
|
-
const fontSize =
|
|
2961
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(dimension.fontSize, 11);
|
|
2960
2962
|
const width = Math.max(24, text.length * fontSize * CHAR_WIDTH + 8);
|
|
2961
2963
|
const height = fontSize * 1.3;
|
|
2962
2964
|
return {
|
|
@@ -2974,7 +2976,7 @@ function labelNode2(dimension, order, text, center, angle) {
|
|
|
2974
2976
|
width,
|
|
2975
2977
|
height,
|
|
2976
2978
|
lines: [text],
|
|
2977
|
-
fontFamily:
|
|
2979
|
+
fontFamily: chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
2978
2980
|
fontSize,
|
|
2979
2981
|
fontWeight: "normal",
|
|
2980
2982
|
color: dimension.textColor ?? dimension.strokeColor ?? DEFAULT_COLOR,
|
|
@@ -2999,7 +3001,7 @@ function buildDimension(dimension, index) {
|
|
|
2999
3001
|
}
|
|
3000
3002
|
function buildDimensions(dimensions) {
|
|
3001
3003
|
return dimensions.flatMap(
|
|
3002
|
-
(dimension, index) =>
|
|
3004
|
+
(dimension, index) => chunkSKGJXCAO_cjs.tag(
|
|
3003
3005
|
buildDimension(dimension, index),
|
|
3004
3006
|
"dimension",
|
|
3005
3007
|
dimension.id,
|
|
@@ -3013,9 +3015,9 @@ function buildDimensions(dimensions) {
|
|
|
3013
3015
|
// src/renderScene/artifacts/isometric/context.ts
|
|
3014
3016
|
var FILL_PROP = { prop: "style.fill", propKind: "color", propSolidOnly: true };
|
|
3015
3017
|
function isometricContext(object, index) {
|
|
3016
|
-
const strokeWidth = Math.max(0,
|
|
3017
|
-
const rotation =
|
|
3018
|
-
const box =
|
|
3018
|
+
const strokeWidth = Math.max(0, chunkSKGJXCAO_cjs.finite(object.strokeWidth, 1));
|
|
3019
|
+
const rotation = chunkSKGJXCAO_cjs.finite(object.rotation, 0);
|
|
3020
|
+
const box = chunkSKGJXCAO_cjs.isometricBounds(object);
|
|
3019
3021
|
const rotationCenter = { x: box.x + box.width / 2, y: box.y + box.height / 2 };
|
|
3020
3022
|
return {
|
|
3021
3023
|
object,
|
|
@@ -3027,7 +3029,7 @@ function isometricContext(object, index) {
|
|
|
3027
3029
|
strokeWidth,
|
|
3028
3030
|
common: {
|
|
3029
3031
|
type: "path",
|
|
3030
|
-
bounds:
|
|
3032
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(box, rotation, strokeWidth + 2),
|
|
3031
3033
|
rotation,
|
|
3032
3034
|
rotationCenter,
|
|
3033
3035
|
style: {
|
|
@@ -3043,13 +3045,13 @@ function faceNode(context, name, offset, points, style) {
|
|
|
3043
3045
|
...context.common,
|
|
3044
3046
|
id: `isometric-${context.object.id}-${name}`,
|
|
3045
3047
|
order: context.order + offset,
|
|
3046
|
-
d:
|
|
3048
|
+
d: chunkSKGJXCAO_cjs.roundedPolygonPath([...points], 0),
|
|
3047
3049
|
style,
|
|
3048
3050
|
...FILL_PROP
|
|
3049
3051
|
};
|
|
3050
3052
|
}
|
|
3051
3053
|
function silhouette(object) {
|
|
3052
|
-
const faces =
|
|
3054
|
+
const faces = chunkSKGJXCAO_cjs.isometricFaces(object);
|
|
3053
3055
|
return [faces.top[0], faces.top[1], faces.right[2], faces.front[2], faces.front[3], faces.top[3]];
|
|
3054
3056
|
}
|
|
3055
3057
|
function hullNode(context, hullPath, cornerRadius) {
|
|
@@ -3066,15 +3068,15 @@ function hullNode(context, hullPath, cornerRadius) {
|
|
|
3066
3068
|
depth: Math.max(0, object.depth),
|
|
3067
3069
|
cornerRadius,
|
|
3068
3070
|
bounds: box,
|
|
3069
|
-
labelOffsetX:
|
|
3070
|
-
labelOffsetY:
|
|
3071
|
+
labelOffsetX: chunkSKGJXCAO_cjs.finite(object.labelOffsetX, 0),
|
|
3072
|
+
labelOffsetY: chunkSKGJXCAO_cjs.finite(object.labelOffsetY, 0)
|
|
3071
3073
|
},
|
|
3072
3074
|
style: { ...common.style, fill: { kind: "none" } }
|
|
3073
3075
|
};
|
|
3074
3076
|
}
|
|
3075
3077
|
function unseenHullNode(context) {
|
|
3076
3078
|
return {
|
|
3077
|
-
...hullNode(context,
|
|
3079
|
+
...hullNode(context, chunkSKGJXCAO_cjs.roundedPolygonPath(silhouette(context.object), 0), 0),
|
|
3078
3080
|
style: { ...context.common.style, fill: { kind: "none" }, stroke: { kind: "none" } }
|
|
3079
3081
|
};
|
|
3080
3082
|
}
|
|
@@ -3087,9 +3089,9 @@ var LABEL_PADDING_Y = 3;
|
|
|
3087
3089
|
var LABEL_CHAR_WIDTH = 6.5;
|
|
3088
3090
|
function labelPlacement(context) {
|
|
3089
3091
|
const { object } = context;
|
|
3090
|
-
const anchor =
|
|
3091
|
-
const bottomY = anchor.y - LABEL_GAP +
|
|
3092
|
-
return { anchor, centerX: anchor.x +
|
|
3092
|
+
const anchor = chunkSKGJXCAO_cjs.isometricTopFaceCenter(object);
|
|
3093
|
+
const bottomY = anchor.y - LABEL_GAP + chunkSKGJXCAO_cjs.finite(object.labelOffsetY, 0);
|
|
3094
|
+
return { anchor, centerX: anchor.x + chunkSKGJXCAO_cjs.finite(object.labelOffsetX, 0), topY: bottomY - LABEL_HEIGHT, bottomY };
|
|
3093
3095
|
}
|
|
3094
3096
|
function labelTextNode(context, placement, text) {
|
|
3095
3097
|
const { object, order, rotation, rotationCenter, box } = context;
|
|
@@ -3104,7 +3106,7 @@ function labelTextNode(context, placement, text) {
|
|
|
3104
3106
|
width: box.width,
|
|
3105
3107
|
height: LABEL_HEIGHT,
|
|
3106
3108
|
lines: [text],
|
|
3107
|
-
fontFamily:
|
|
3109
|
+
fontFamily: chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
3108
3110
|
fontSize: 12,
|
|
3109
3111
|
fontWeight: "normal",
|
|
3110
3112
|
color: "#111827",
|
|
@@ -3184,7 +3186,7 @@ function groundShadowNode(context, topOutline) {
|
|
|
3184
3186
|
}
|
|
3185
3187
|
const height = Math.max(0, object.height);
|
|
3186
3188
|
const heightFactor = 0.6 + Math.min(1, height / 150) * 0.7;
|
|
3187
|
-
const shadowDrop = height +
|
|
3189
|
+
const shadowDrop = height + chunkSKGJXCAO_cjs.finite(object.shadowStyle?.distance, 0);
|
|
3188
3190
|
const contactFootprint = topOutline.map((point) => ({ x: point.x, y: point.y + shadowDrop }));
|
|
3189
3191
|
const footprintCenter = {
|
|
3190
3192
|
x: contactFootprint.reduce((sum, point) => sum + point.x, 0) / contactFootprint.length,
|
|
@@ -3207,14 +3209,14 @@ function groundShadowNode(context, topOutline) {
|
|
|
3207
3209
|
maxX: Math.max(...footprintXs),
|
|
3208
3210
|
maxY: Math.max(...footprintYs)
|
|
3209
3211
|
},
|
|
3210
|
-
d:
|
|
3212
|
+
d: chunkSKGJXCAO_cjs.roundedPolygonPath(footprint, 0),
|
|
3211
3213
|
rotation,
|
|
3212
3214
|
rotationCenter,
|
|
3213
3215
|
style: {
|
|
3214
3216
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
3215
3217
|
stroke: { kind: "none" },
|
|
3216
3218
|
opacity: Math.min(1, (object.shadowStyle?.opacity ?? 0.18) * heightFactor),
|
|
3217
|
-
blur:
|
|
3219
|
+
blur: chunkSKGJXCAO_cjs.finite(object.shadowStyle?.blur, 8),
|
|
3218
3220
|
pointerEvents: "none"
|
|
3219
3221
|
}
|
|
3220
3222
|
};
|
|
@@ -3228,7 +3230,7 @@ function sphereShadowNode(context, radius) {
|
|
|
3228
3230
|
const depth = Math.max(0, object.depth);
|
|
3229
3231
|
const center = {
|
|
3230
3232
|
x: box.x + box.width / 2,
|
|
3231
|
-
y: object.y + Math.max(0, object.height) + (width + depth) *
|
|
3233
|
+
y: object.y + Math.max(0, object.height) + (width + depth) * chunkSKGJXCAO_cjs.AXIS_SIN / 2
|
|
3232
3234
|
};
|
|
3233
3235
|
return {
|
|
3234
3236
|
type: "ellipse",
|
|
@@ -3248,7 +3250,7 @@ function sphereShadowNode(context, radius) {
|
|
|
3248
3250
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
3249
3251
|
stroke: { kind: "none" },
|
|
3250
3252
|
opacity: object.shadowStyle?.opacity ?? 0.2,
|
|
3251
|
-
blur:
|
|
3253
|
+
blur: chunkSKGJXCAO_cjs.finite(object.shadowStyle?.blur, 8),
|
|
3252
3254
|
pointerEvents: "none"
|
|
3253
3255
|
}
|
|
3254
3256
|
};
|
|
@@ -3258,7 +3260,7 @@ function sphereShadowNode(context, radius) {
|
|
|
3258
3260
|
function faceNodes(context, faces, hullClip) {
|
|
3259
3261
|
const { object, common } = context;
|
|
3260
3262
|
const noStroke = { ...common.style, stroke: { kind: "none" } };
|
|
3261
|
-
const fills =
|
|
3263
|
+
const fills = chunkSKGJXCAO_cjs.deriveFaceFills(object.fill ?? "#f8fafc");
|
|
3262
3264
|
const face = (name, offset, points, color) => faceNode(context, name, offset, points, { ...noStroke, fill: { kind: "solid", color }, clip: hullClip });
|
|
3263
3265
|
return [
|
|
3264
3266
|
face("top", 0, faces.top, fills.topFill),
|
|
@@ -3284,9 +3286,9 @@ function seamsNode(context, faces, hullClip) {
|
|
|
3284
3286
|
}
|
|
3285
3287
|
function buildBox(object, index) {
|
|
3286
3288
|
const context = isometricContext(object, index);
|
|
3287
|
-
const faces =
|
|
3288
|
-
const cornerRadius = Math.max(0,
|
|
3289
|
-
const hullPath =
|
|
3289
|
+
const faces = chunkSKGJXCAO_cjs.isometricFaces(object);
|
|
3290
|
+
const cornerRadius = Math.max(0, chunkSKGJXCAO_cjs.finite(object.cornerRadius, 8));
|
|
3291
|
+
const hullPath = chunkSKGJXCAO_cjs.roundedPolygonPath(silhouette(object), cornerRadius);
|
|
3290
3292
|
const hullClip = { type: "path", d: hullPath };
|
|
3291
3293
|
const groundShadow = groundShadowNode(context, faces.top);
|
|
3292
3294
|
const seams = object.seams === false ? void 0 : seamsNode(context, faces, hullClip);
|
|
@@ -3298,7 +3300,7 @@ function buildBox(object, index) {
|
|
|
3298
3300
|
|
|
3299
3301
|
// src/renderScene/artifacts/isometric/extruded.ts
|
|
3300
3302
|
function wallNode(context, side, index, fill2) {
|
|
3301
|
-
const color =
|
|
3303
|
+
const color = chunkSKGJXCAO_cjs.shadeFill(fill2, side.light);
|
|
3302
3304
|
return faceNode(context, `side-${index}`, 0.05 + index * 1e-3, side.points, {
|
|
3303
3305
|
...context.common.style,
|
|
3304
3306
|
stroke: { kind: "solid", color },
|
|
@@ -3323,7 +3325,7 @@ function wallEdgesNode(context, side, index) {
|
|
|
3323
3325
|
}
|
|
3324
3326
|
function buildExtruded(object, index, footprint) {
|
|
3325
3327
|
const context = isometricContext(object, index);
|
|
3326
|
-
const { top, sides } =
|
|
3328
|
+
const { top, sides } = chunkSKGJXCAO_cjs.extrudeFootprint(object, footprint, Math.max(0, chunkSKGJXCAO_cjs.finite(object.cornerRadius, 0)));
|
|
3327
3329
|
const fill2 = object.fill ?? "#f8fafc";
|
|
3328
3330
|
const groundShadow = groundShadowNode(context, top);
|
|
3329
3331
|
const topFace = faceNode(context, "top", 0.2, top, { ...context.common.style, fill: { kind: "solid", color: fill2 } });
|
|
@@ -3360,9 +3362,9 @@ function buildSphere(object, index) {
|
|
|
3360
3362
|
kind: "linear-gradient",
|
|
3361
3363
|
angle: 135,
|
|
3362
3364
|
stops: [
|
|
3363
|
-
{ offset: 0, color:
|
|
3365
|
+
{ offset: 0, color: chunkSKGJXCAO_cjs.shadeFill(fill2, 1.22) },
|
|
3364
3366
|
{ offset: 0.5, color: fill2 },
|
|
3365
|
-
{ offset: 1, color:
|
|
3367
|
+
{ offset: 1, color: chunkSKGJXCAO_cjs.shadeFill(fill2, 0.82) }
|
|
3366
3368
|
]
|
|
3367
3369
|
}
|
|
3368
3370
|
},
|
|
@@ -3398,12 +3400,12 @@ function buildIsometricObject(object, index) {
|
|
|
3398
3400
|
if (object.form === "sphere") {
|
|
3399
3401
|
return buildSphere(object, index);
|
|
3400
3402
|
}
|
|
3401
|
-
const footprint =
|
|
3403
|
+
const footprint = chunkSKGJXCAO_cjs.cleanFootprint(object.footprint);
|
|
3402
3404
|
return footprint.length > 0 ? buildExtruded(object, index, footprint) : buildBox(object, index);
|
|
3403
3405
|
}
|
|
3404
3406
|
function buildIsometricObjects(objects) {
|
|
3405
3407
|
return objects.flatMap(
|
|
3406
|
-
(object, index) =>
|
|
3408
|
+
(object, index) => chunkSKGJXCAO_cjs.tag(
|
|
3407
3409
|
buildIsometricObject(object, index),
|
|
3408
3410
|
"isometric",
|
|
3409
3411
|
object.id,
|
|
@@ -3432,7 +3434,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
3432
3434
|
if (!label) {
|
|
3433
3435
|
return [];
|
|
3434
3436
|
}
|
|
3435
|
-
const fontSize =
|
|
3437
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(context.link.style?.fontSize, 10);
|
|
3436
3438
|
const position = endpointLabelPosition(context.points, end);
|
|
3437
3439
|
const width = 90;
|
|
3438
3440
|
return [
|
|
@@ -3446,7 +3448,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
3446
3448
|
width,
|
|
3447
3449
|
height: fontSize * 2,
|
|
3448
3450
|
lines: [label],
|
|
3449
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3451
|
+
fontFamily: context.link.style?.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
3450
3452
|
fontSize,
|
|
3451
3453
|
fontWeight: "normal",
|
|
3452
3454
|
color: context.color,
|
|
@@ -3476,7 +3478,7 @@ function renderMainLabel(context) {
|
|
|
3476
3478
|
width: context.label.width,
|
|
3477
3479
|
height: context.label.fontSize * 2,
|
|
3478
3480
|
lines: context.label.lines,
|
|
3479
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3481
|
+
fontFamily: context.link.style?.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
3480
3482
|
fontSize: context.label.fontSize,
|
|
3481
3483
|
fontWeight: "normal",
|
|
3482
3484
|
color: context.color,
|
|
@@ -3530,10 +3532,10 @@ function linkBounds(points, padding) {
|
|
|
3530
3532
|
}
|
|
3531
3533
|
function labelLayout(link, measureText) {
|
|
3532
3534
|
const visible = Boolean(link.showText && link.text);
|
|
3533
|
-
const fontSize =
|
|
3535
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(link.style?.fontSize, 10);
|
|
3534
3536
|
const width = Math.min(250, Math.max(fontSize * 2, (link.text?.length ?? 0) * fontSize * 0.65 + 10));
|
|
3535
|
-
const metrics = measureText?.(link.style?.fontFamily ??
|
|
3536
|
-
const lines = visible ?
|
|
3537
|
+
const metrics = measureText?.(link.style?.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT, fontSize);
|
|
3538
|
+
const lines = visible ? chunkSKGJXCAO_cjs.wrapText(link.text ?? "", width, fontSize, metrics) : [];
|
|
3537
3539
|
return { visible, fontSize, width, height: lines.length * fontSize * 1.4, lines };
|
|
3538
3540
|
}
|
|
3539
3541
|
function linkStyle(item, strokeWidth, color, dash) {
|
|
@@ -3550,26 +3552,26 @@ function linkStyle(item, strokeWidth, color, dash) {
|
|
|
3550
3552
|
dash,
|
|
3551
3553
|
lineCap: "round",
|
|
3552
3554
|
lineJoin: "round",
|
|
3553
|
-
opacity:
|
|
3555
|
+
opacity: chunkSKGJXCAO_cjs.finite(link.style?.opacity, 1),
|
|
3554
3556
|
shadow: resolveShadow(link.style?.shadow)
|
|
3555
3557
|
};
|
|
3556
3558
|
}
|
|
3557
3559
|
function createLinkRenderContext(item, index, measureText) {
|
|
3558
3560
|
const { link, from, to } = item;
|
|
3559
3561
|
const pathType = link.style?.pathType ?? "orthogonal";
|
|
3560
|
-
const { points, segments } =
|
|
3561
|
-
const strokeWidth =
|
|
3562
|
+
const { points, segments } = chunkSKGJXCAO_cjs.calculateLinkRoute(link, from, to, pathType);
|
|
3563
|
+
const strokeWidth = chunkSKGJXCAO_cjs.finite(link.style?.strokeWidth, 2);
|
|
3562
3564
|
const color = getLinkStrokeColor(link.style?.color) || "#64748b";
|
|
3563
3565
|
const label = labelLayout(link, measureText);
|
|
3564
3566
|
const contentDash = getDashArray(strokeWidth, link.style?.strokeStyle ?? "solid");
|
|
3565
|
-
const gap = label.visible && !contentDash ?
|
|
3567
|
+
const gap = label.visible && !contentDash ? chunkSKGJXCAO_cjs.labelGapDash(points, pathType, label.width, label.height) : null;
|
|
3566
3568
|
const dash = gap ? [gap.dashBefore, gap.gapLength, 1e6] : contentDash;
|
|
3567
3569
|
return {
|
|
3568
3570
|
link,
|
|
3569
3571
|
pathType,
|
|
3570
3572
|
points,
|
|
3571
3573
|
segments,
|
|
3572
|
-
midpoint:
|
|
3574
|
+
midpoint: chunkSKGJXCAO_cjs.getLineMidpoint(points, pathType, from, to),
|
|
3573
3575
|
strokeWidth,
|
|
3574
3576
|
bounds: linkBounds(points, strokeWidth + 14),
|
|
3575
3577
|
color,
|
|
@@ -3615,7 +3617,7 @@ function pathData2(points, pathType, segments, strokeWidth) {
|
|
|
3615
3617
|
return `M ${points[0]} ${points[1]} C ${points[2]} ${points[3]} ${points[4]} ${points[5]} ${points[6]} ${points[7]}`;
|
|
3616
3618
|
}
|
|
3617
3619
|
if (pathType === "orthogonal" && segments.length > 0) {
|
|
3618
|
-
return
|
|
3620
|
+
return chunkSKGJXCAO_cjs.roundedOrthogonalPathData(segments, Math.max(16, strokeWidth * 4));
|
|
3619
3621
|
}
|
|
3620
3622
|
return polylinePathData(points);
|
|
3621
3623
|
}
|
|
@@ -3719,7 +3721,7 @@ function buildLink(item, index, measureText) {
|
|
|
3719
3721
|
}
|
|
3720
3722
|
function buildLinks(links, measureText) {
|
|
3721
3723
|
return links.flatMap(
|
|
3722
|
-
(item, index) =>
|
|
3724
|
+
(item, index) => chunkSKGJXCAO_cjs.tag(
|
|
3723
3725
|
buildLink(item, index, measureText),
|
|
3724
3726
|
"link",
|
|
3725
3727
|
item.link.id,
|
|
@@ -3734,7 +3736,7 @@ function buildFreeformPath(path, index) {
|
|
|
3734
3736
|
if (path.isVisible === false || path.points.length < 2) {
|
|
3735
3737
|
return [];
|
|
3736
3738
|
}
|
|
3737
|
-
const strokeWidth =
|
|
3739
|
+
const strokeWidth = chunkSKGJXCAO_cjs.finite(path.strokeWidth, 2);
|
|
3738
3740
|
const extra = strokeWidth + 12;
|
|
3739
3741
|
const bounds = {
|
|
3740
3742
|
minX: Math.min(...path.points.map((point) => point.x)) - extra,
|
|
@@ -3742,7 +3744,7 @@ function buildFreeformPath(path, index) {
|
|
|
3742
3744
|
maxX: Math.max(...path.points.map((point) => point.x)) + extra,
|
|
3743
3745
|
maxY: Math.max(...path.points.map((point) => point.y)) + extra
|
|
3744
3746
|
};
|
|
3745
|
-
const tension =
|
|
3747
|
+
const tension = chunkSKGJXCAO_cjs.finite(path.tension, 0);
|
|
3746
3748
|
const closed = path.closed === true;
|
|
3747
3749
|
return [
|
|
3748
3750
|
{
|
|
@@ -3750,7 +3752,7 @@ function buildFreeformPath(path, index) {
|
|
|
3750
3752
|
id: `path-${path.id}`,
|
|
3751
3753
|
order: 3e4 + index,
|
|
3752
3754
|
bounds,
|
|
3753
|
-
d:
|
|
3755
|
+
d: chunkSKGJXCAO_cjs.freeformPathData({ points: path.points, tension, closed }),
|
|
3754
3756
|
markerStart: path.startMarker,
|
|
3755
3757
|
markerEnd: path.endMarker,
|
|
3756
3758
|
detail: {
|
|
@@ -3766,13 +3768,13 @@ function buildFreeformPath(path, index) {
|
|
|
3766
3768
|
dash: path.dash?.length ? path.dash : void 0,
|
|
3767
3769
|
lineCap: "round",
|
|
3768
3770
|
lineJoin: "round",
|
|
3769
|
-
opacity:
|
|
3771
|
+
opacity: chunkSKGJXCAO_cjs.finite(path.opacity, 1)
|
|
3770
3772
|
}
|
|
3771
3773
|
}
|
|
3772
3774
|
];
|
|
3773
3775
|
}
|
|
3774
3776
|
function buildFreeformPaths(paths) {
|
|
3775
|
-
return paths.flatMap((path, index) =>
|
|
3777
|
+
return paths.flatMap((path, index) => chunkSKGJXCAO_cjs.tag(buildFreeformPath(path, index), "path", path.id, "path", "Path"));
|
|
3776
3778
|
}
|
|
3777
3779
|
|
|
3778
3780
|
// src/renderScene/artifacts/shape/geometry/base.ts
|
|
@@ -3788,7 +3790,7 @@ function shapeNodeBase(context) {
|
|
|
3788
3790
|
|
|
3789
3791
|
// src/renderScene/artifacts/shape/geometry/simple.ts
|
|
3790
3792
|
function renderPath(context) {
|
|
3791
|
-
const path =
|
|
3793
|
+
const path = chunkSKGJXCAO_cjs.localShapePath(context.shape.shapeType, context.x, context.y, context.width, context.height);
|
|
3792
3794
|
if (!path) {
|
|
3793
3795
|
return [];
|
|
3794
3796
|
}
|
|
@@ -3804,7 +3806,7 @@ function renderBoundedPath(context) {
|
|
|
3804
3806
|
}));
|
|
3805
3807
|
}
|
|
3806
3808
|
function renderRectangle(context) {
|
|
3807
|
-
const rx = context.shape.shapeType === "pill" ?
|
|
3809
|
+
const rx = context.shape.shapeType === "pill" ? chunkSKGJXCAO_cjs.pillCornerRadius(context.width, context.height) : context.shape.shapeType === "rounded_rectangle" ? chunkSKGJXCAO_cjs.finite(context.shape.cornerRadius, 8) : 0;
|
|
3808
3810
|
return [
|
|
3809
3811
|
{
|
|
3810
3812
|
...shapeNodeBase(context),
|
|
@@ -3833,7 +3835,7 @@ function renderSymbol(context) {
|
|
|
3833
3835
|
if (!context.shape.symbol || context.shape.symbol.points.length < 2) {
|
|
3834
3836
|
return renderRectangle(context);
|
|
3835
3837
|
}
|
|
3836
|
-
const tension =
|
|
3838
|
+
const tension = chunkSKGJXCAO_cjs.finite(context.shape.symbol.tension, 0);
|
|
3837
3839
|
const points = context.shape.symbol.points.map(([x, y]) => ({
|
|
3838
3840
|
x: context.x + x * context.width,
|
|
3839
3841
|
y: context.y + y * context.height
|
|
@@ -3842,7 +3844,7 @@ function renderSymbol(context) {
|
|
|
3842
3844
|
{
|
|
3843
3845
|
...shapeNodeBase(context),
|
|
3844
3846
|
type: "path",
|
|
3845
|
-
d:
|
|
3847
|
+
d: chunkSKGJXCAO_cjs.freeformPathData({ points, tension, closed: true }),
|
|
3846
3848
|
rotationCenter: context.rotationCenter,
|
|
3847
3849
|
detail: {
|
|
3848
3850
|
of: "symbolGeometry",
|
|
@@ -3979,7 +3981,7 @@ function renderShapeShaderSurface(context) {
|
|
|
3979
3981
|
id: `${context.id}-shader`,
|
|
3980
3982
|
type: "shader-surface",
|
|
3981
3983
|
order: context.order,
|
|
3982
|
-
bounds:
|
|
3984
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds(surfaceBounds, context.rotation, 0),
|
|
3983
3985
|
...surfaceBounds,
|
|
3984
3986
|
rotation: context.rotation,
|
|
3985
3987
|
shader: context.shape.shader,
|
|
@@ -4049,24 +4051,24 @@ function shapeDash(shape, strokeWidth) {
|
|
|
4049
4051
|
}
|
|
4050
4052
|
function shapeStyle(shape, diagnostics) {
|
|
4051
4053
|
const defaults = shapeDefaults(shape, diagnostics);
|
|
4052
|
-
const strokeWidth =
|
|
4054
|
+
const strokeWidth = chunkSKGJXCAO_cjs.finite(shape.strokeWidth, defaults.strokeWidth);
|
|
4053
4055
|
const shadow = shape.shadowStyle ?? (shape.hasShadow ? { enabled: true, color: "#000000", opacity: 0.25, blur: 10, angle: 45, distance: 5 } : void 0);
|
|
4054
|
-
const angle =
|
|
4056
|
+
const angle = chunkSKGJXCAO_cjs.finite(shadow?.angle, 45) * Math.PI / 180;
|
|
4055
4057
|
return {
|
|
4056
|
-
fill:
|
|
4057
|
-
stroke:
|
|
4058
|
+
fill: chunkSKGJXCAO_cjs.paint(shape.fillColor, diagnostics, shape.id),
|
|
4059
|
+
stroke: chunkSKGJXCAO_cjs.paint(shape.strokeColor, diagnostics, shape.id),
|
|
4058
4060
|
strokeWidth,
|
|
4059
4061
|
dash: shapeDash(shape, strokeWidth),
|
|
4060
4062
|
lineCap: shape.strokeStyle === "dotted" ? "round" : "butt",
|
|
4061
|
-
opacity:
|
|
4063
|
+
opacity: chunkSKGJXCAO_cjs.finite(shape.opacity, defaults.opacity),
|
|
4062
4064
|
blur: shape.blur !== void 0 && shape.blur > 0 ? shape.blur : void 0,
|
|
4063
4065
|
blend: shape.blend,
|
|
4064
4066
|
shadow: shadow?.enabled ? {
|
|
4065
4067
|
color: shadow.color ?? "#000000",
|
|
4066
|
-
opacity:
|
|
4067
|
-
blur:
|
|
4068
|
-
dx: Math.cos(angle) *
|
|
4069
|
-
dy: Math.sin(angle) *
|
|
4068
|
+
opacity: chunkSKGJXCAO_cjs.finite(shadow.opacity, 0.25),
|
|
4069
|
+
blur: chunkSKGJXCAO_cjs.finite(shadow.blur, 10),
|
|
4070
|
+
dx: Math.cos(angle) * chunkSKGJXCAO_cjs.finite(shadow.distance, 5),
|
|
4071
|
+
dy: Math.sin(angle) * chunkSKGJXCAO_cjs.finite(shadow.distance, 5)
|
|
4070
4072
|
} : void 0
|
|
4071
4073
|
};
|
|
4072
4074
|
}
|
|
@@ -4142,11 +4144,11 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
4142
4144
|
if (!shape.text) {
|
|
4143
4145
|
return null;
|
|
4144
4146
|
}
|
|
4145
|
-
const fontSize =
|
|
4147
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(shape.fontSize, shapeDefaults(shape, []).fontSize);
|
|
4146
4148
|
const padding = shape.isText ? 0 : Math.max(8, strokeWidth * 2);
|
|
4147
|
-
const area = shape.shapeType === "person" ?
|
|
4149
|
+
const area = shape.shapeType === "person" ? chunkSKGJXCAO_cjs.personLabelArea(x, y, width, height) : { x, y, width, height };
|
|
4148
4150
|
const textWidth = Math.max(0, area.width - padding * 2);
|
|
4149
|
-
const fontFamily2 = shape.fontFamily ||
|
|
4151
|
+
const fontFamily2 = shape.fontFamily || chunkSKGJXCAO_cjs.DEFAULT_FONT;
|
|
4150
4152
|
const metrics = measureText?.(fontFamily2, fontSize);
|
|
4151
4153
|
const textNode = {
|
|
4152
4154
|
type: "text",
|
|
@@ -4157,7 +4159,7 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
4157
4159
|
y: area.y + padding,
|
|
4158
4160
|
width: textWidth,
|
|
4159
4161
|
height: Math.max(0, area.height - padding * 2),
|
|
4160
|
-
lines:
|
|
4162
|
+
lines: chunkSKGJXCAO_cjs.wrapText(shape.text, textWidth, fontSize, metrics),
|
|
4161
4163
|
fontFamily: fontFamily2,
|
|
4162
4164
|
fontSize,
|
|
4163
4165
|
fontWeight: shape.fontWeight ?? "normal",
|
|
@@ -4165,12 +4167,12 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
4165
4167
|
color: shape.textColor || "#111827",
|
|
4166
4168
|
align: shape.textAlign ?? "center",
|
|
4167
4169
|
verticalAlign: shape.textVerticalAlign ?? "middle",
|
|
4168
|
-
lineHeight:
|
|
4170
|
+
lineHeight: chunkSKGJXCAO_cjs.finite(shape.lineHeight, 1.3),
|
|
4169
4171
|
rotation,
|
|
4170
4172
|
rotationCenter
|
|
4171
4173
|
};
|
|
4172
4174
|
if (hasBoldMarkup(shape.text)) {
|
|
4173
|
-
const { measure, spaceWidth } = metrics ??
|
|
4175
|
+
const { measure, spaceWidth } = metrics ?? chunkSKGJXCAO_cjs.heuristicRichMeasure(fontSize);
|
|
4174
4176
|
textNode.richLines = wrapRichText(shape.text, textWidth, measure, spaceWidth);
|
|
4175
4177
|
}
|
|
4176
4178
|
return textNode;
|
|
@@ -4209,19 +4211,19 @@ function renderDoubleStroke(context, strokeWidth) {
|
|
|
4209
4211
|
return nodes;
|
|
4210
4212
|
}
|
|
4211
4213
|
function createRenderContext(shape, index, diagnostics) {
|
|
4212
|
-
const x =
|
|
4213
|
-
const y =
|
|
4214
|
-
const width = Math.max(0,
|
|
4215
|
-
const height = Math.max(0,
|
|
4216
|
-
const rotation =
|
|
4217
|
-
const strokeWidth =
|
|
4214
|
+
const x = chunkSKGJXCAO_cjs.finite(shape.x, 0);
|
|
4215
|
+
const y = chunkSKGJXCAO_cjs.finite(shape.y, 0);
|
|
4216
|
+
const width = Math.max(0, chunkSKGJXCAO_cjs.finite(shape.width, 100));
|
|
4217
|
+
const height = Math.max(0, chunkSKGJXCAO_cjs.finite(shape.height, 100));
|
|
4218
|
+
const rotation = chunkSKGJXCAO_cjs.finite(shape.rotation, 0);
|
|
4219
|
+
const strokeWidth = chunkSKGJXCAO_cjs.finite(shape.strokeWidth, 2);
|
|
4218
4220
|
return {
|
|
4219
4221
|
strokeWidth,
|
|
4220
4222
|
context: {
|
|
4221
4223
|
shape,
|
|
4222
4224
|
id: `shape-${shape.id}`,
|
|
4223
4225
|
order: 1e4 + index,
|
|
4224
|
-
bounds:
|
|
4226
|
+
bounds: chunkSKGJXCAO_cjs.rotatedBounds({ x, y, width, height }, rotation, strokeWidth + (shape.hasShadow ? 20 : 2)),
|
|
4225
4227
|
rotation,
|
|
4226
4228
|
rotationCenter: { x: x + width / 2, y: y + height / 2 },
|
|
4227
4229
|
style: shapeStyle(shape, diagnostics),
|
|
@@ -4271,7 +4273,7 @@ function buildShape(shape, index, diagnostics, measureText) {
|
|
|
4271
4273
|
}
|
|
4272
4274
|
function buildShapes(shapes, diagnostics, measureText) {
|
|
4273
4275
|
return shapes.flatMap(
|
|
4274
|
-
(shape, index) =>
|
|
4276
|
+
(shape, index) => chunkSKGJXCAO_cjs.tag(
|
|
4275
4277
|
buildShape(shape, index, diagnostics, measureText),
|
|
4276
4278
|
"shape",
|
|
4277
4279
|
shape.id,
|
|
@@ -4288,7 +4290,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
4288
4290
|
return null;
|
|
4289
4291
|
}
|
|
4290
4292
|
return {
|
|
4291
|
-
...
|
|
4293
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4292
4294
|
role: "axis",
|
|
4293
4295
|
id: `chart-x-label-${chart.id}`,
|
|
4294
4296
|
order,
|
|
@@ -4298,7 +4300,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
4298
4300
|
chart,
|
|
4299
4301
|
align: "center"
|
|
4300
4302
|
}),
|
|
4301
|
-
prop:
|
|
4303
|
+
prop: chunkSKGJXCAO_cjs.axisLabelProp("x")
|
|
4302
4304
|
};
|
|
4303
4305
|
}
|
|
4304
4306
|
function buildYAxisLabel(chart, layout, order) {
|
|
@@ -4306,7 +4308,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
4306
4308
|
return null;
|
|
4307
4309
|
}
|
|
4308
4310
|
return {
|
|
4309
|
-
...
|
|
4311
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4310
4312
|
role: "axis",
|
|
4311
4313
|
id: `chart-y-label-${chart.id}`,
|
|
4312
4314
|
order,
|
|
@@ -4322,7 +4324,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
4322
4324
|
align: "center",
|
|
4323
4325
|
rotation: -90
|
|
4324
4326
|
}),
|
|
4325
|
-
prop:
|
|
4327
|
+
prop: chunkSKGJXCAO_cjs.axisLabelProp("y")
|
|
4326
4328
|
};
|
|
4327
4329
|
}
|
|
4328
4330
|
function buildAxisLabels(chart, layout, order) {
|
|
@@ -4345,7 +4347,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
4345
4347
|
return chart.series.map((series, index) => {
|
|
4346
4348
|
const centerY = layout.plot.y + (index + 0.5) * slotWidth;
|
|
4347
4349
|
return {
|
|
4348
|
-
...
|
|
4350
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4349
4351
|
role: "axis",
|
|
4350
4352
|
id: `chart-y-tick-${chart.id}-${index}`,
|
|
4351
4353
|
order: order + index,
|
|
@@ -4355,7 +4357,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
4355
4357
|
chart,
|
|
4356
4358
|
align: "right"
|
|
4357
4359
|
}),
|
|
4358
|
-
prop:
|
|
4360
|
+
prop: chunkSKGJXCAO_cjs.seriesLabelProp(series.id)
|
|
4359
4361
|
};
|
|
4360
4362
|
});
|
|
4361
4363
|
}
|
|
@@ -4381,7 +4383,7 @@ function isStackedLegendPosition(position) {
|
|
|
4381
4383
|
return position === "bottomLeft" || position === "bottomRight";
|
|
4382
4384
|
}
|
|
4383
4385
|
function legendItemWidths(chart) {
|
|
4384
|
-
return legendSeries(chart).map((item) => Math.max(42, item.label.length *
|
|
4386
|
+
return legendSeries(chart).map((item) => Math.max(42, item.label.length * chunkSKGJXCAO_cjs.finite(chart.fontSize, 12) * 0.58 + 22));
|
|
4385
4387
|
}
|
|
4386
4388
|
function stackedLegendColumnWidth(chart) {
|
|
4387
4389
|
const widths = legendItemWidths(chart);
|
|
@@ -4434,9 +4436,9 @@ function renderLegendItem(render2, item) {
|
|
|
4434
4436
|
}
|
|
4435
4437
|
function createLegendSwatch(render2, item) {
|
|
4436
4438
|
const { chart, bounds, diagnostics } = render2;
|
|
4437
|
-
const fallback =
|
|
4439
|
+
const fallback = chunkSKGJXCAO_cjs.CHART_COLORS[item.seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
4438
4440
|
const solidOnly = chart.chartType === "line";
|
|
4439
|
-
const color = solidOnly ?
|
|
4441
|
+
const color = solidOnly ? chunkSKGJXCAO_cjs.representativeColor(item.series.color, fallback) : item.series.color ?? fallback;
|
|
4440
4442
|
return {
|
|
4441
4443
|
type: "rect",
|
|
4442
4444
|
id: `chart-legend-swatch-${chart.id}-${item.series.id}`,
|
|
@@ -4447,16 +4449,16 @@ function createLegendSwatch(render2, item) {
|
|
|
4447
4449
|
width: 10,
|
|
4448
4450
|
height: 10,
|
|
4449
4451
|
rx: 3,
|
|
4450
|
-
prop:
|
|
4452
|
+
prop: chunkSKGJXCAO_cjs.seriesColorProp(item.series.id),
|
|
4451
4453
|
propKind: "color",
|
|
4452
4454
|
propSolidOnly: solidOnly,
|
|
4453
|
-
style: { fill:
|
|
4455
|
+
style: { fill: chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id) }
|
|
4454
4456
|
};
|
|
4455
4457
|
}
|
|
4456
4458
|
function createLegendLabel(render2, item) {
|
|
4457
4459
|
const { chart, bounds } = render2;
|
|
4458
4460
|
return {
|
|
4459
|
-
...
|
|
4461
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4460
4462
|
role: "legend",
|
|
4461
4463
|
id: `chart-legend-${chart.id}-${item.series.id}`,
|
|
4462
4464
|
order: item.order + 1,
|
|
@@ -4465,7 +4467,7 @@ function createLegendLabel(render2, item) {
|
|
|
4465
4467
|
text: item.series.label,
|
|
4466
4468
|
chart
|
|
4467
4469
|
}),
|
|
4468
|
-
prop:
|
|
4470
|
+
prop: chunkSKGJXCAO_cjs.seriesLabelProp(item.series.id)
|
|
4469
4471
|
};
|
|
4470
4472
|
}
|
|
4471
4473
|
|
|
@@ -4484,19 +4486,19 @@ function hasCartesianDecorations(chart) {
|
|
|
4484
4486
|
return !CHARTS_WITHOUT_CARTESIAN_DECORATIONS.has(chart.chartType);
|
|
4485
4487
|
}
|
|
4486
4488
|
function tickOffset(chart) {
|
|
4487
|
-
return hasCartesianDecorations(chart) ? Math.max(0,
|
|
4489
|
+
return hasCartesianDecorations(chart) ? Math.max(0, chunkSKGJXCAO_cjs.finite(chart.tickLength, 0)) : 0;
|
|
4488
4490
|
}
|
|
4489
4491
|
function xLabelOffset(chart) {
|
|
4490
|
-
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0,
|
|
4492
|
+
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0, chunkSKGJXCAO_cjs.finite(chart.xLabelGap, 0)) : 0);
|
|
4491
4493
|
}
|
|
4492
4494
|
function yLabelOffset(chart) {
|
|
4493
|
-
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0,
|
|
4495
|
+
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0, chunkSKGJXCAO_cjs.finite(chart.yLabelGap, 0)) : 0);
|
|
4494
4496
|
}
|
|
4495
4497
|
function isHorizontalBoxplot(chart) {
|
|
4496
4498
|
return chart.chartType === "boxplot" && chart.config?.orientation === "horizontal";
|
|
4497
4499
|
}
|
|
4498
4500
|
function boxplotCategoryLabelWidth(chart) {
|
|
4499
|
-
const fontSize =
|
|
4501
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(chart.fontSize, 12);
|
|
4500
4502
|
const longest = Math.max(0, ...chart.series.map((series) => (series.label || series.id).length));
|
|
4501
4503
|
return longest * fontSize * 0.58 + 16;
|
|
4502
4504
|
}
|
|
@@ -4508,18 +4510,18 @@ function treemapSideLegendSide(chart, showLegend) {
|
|
|
4508
4510
|
return chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : null;
|
|
4509
4511
|
}
|
|
4510
4512
|
function barCategoryLabelWidth(chart) {
|
|
4511
|
-
const fontSize =
|
|
4513
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(chart.axisFontSize ?? chart.fontSize, 12);
|
|
4512
4514
|
const categories = chart.config?.categories ?? [];
|
|
4513
4515
|
return Math.max(0, ...categories.map((category) => category.length)) * fontSize * 0.58 + 16;
|
|
4514
4516
|
}
|
|
4515
4517
|
function leftLabelWidth(chart) {
|
|
4516
|
-
if (chart.axisLabelSpace && chart.axisLabelSpace > 0 && (isHorizontalBoxplot(chart) ||
|
|
4518
|
+
if (chart.axisLabelSpace && chart.axisLabelSpace > 0 && (isHorizontalBoxplot(chart) || chunkSKGJXCAO_cjs.isHorizontalBar(chart))) {
|
|
4517
4519
|
return chart.axisLabelSpace;
|
|
4518
4520
|
}
|
|
4519
4521
|
if (isHorizontalBoxplot(chart)) {
|
|
4520
4522
|
return boxplotCategoryLabelWidth(chart);
|
|
4521
4523
|
}
|
|
4522
|
-
if (
|
|
4524
|
+
if (chunkSKGJXCAO_cjs.isHorizontalBar(chart)) {
|
|
4523
4525
|
return chart.categoryAlign === "left" || chart.categoryAlign === "inside" ? 20 : barCategoryLabelWidth(chart);
|
|
4524
4526
|
}
|
|
4525
4527
|
if (chart.showValueAxis === false) {
|
|
@@ -4528,12 +4530,12 @@ function leftLabelWidth(chart) {
|
|
|
4528
4530
|
return chart.axisY.label ? 60 : 46;
|
|
4529
4531
|
}
|
|
4530
4532
|
function tiltedBottomRoom(chart) {
|
|
4531
|
-
const tilt =
|
|
4533
|
+
const tilt = chunkSKGJXCAO_cjs.labelTilt(chart);
|
|
4532
4534
|
if (tilt <= 0) {
|
|
4533
4535
|
return 0;
|
|
4534
4536
|
}
|
|
4535
|
-
const labels = chart.chartType === "bar" && !
|
|
4536
|
-
return labels.length > 0 ? Math.max(0,
|
|
4537
|
+
const labels = chart.chartType === "bar" && !chunkSKGJXCAO_cjs.isHorizontalBar(chart) ? chart.config?.categories ?? [] : chart.chartType === "boxplot" && !isHorizontalBoxplot(chart) ? chart.series.map((series) => series.label || series.id) : [];
|
|
4538
|
+
return labels.length > 0 ? Math.max(0, chunkSKGJXCAO_cjs.tiltedLabelRoom(chart, labels, tilt) - 18) : 0;
|
|
4537
4539
|
}
|
|
4538
4540
|
function legendPlaceOf(chart) {
|
|
4539
4541
|
const showLegend = chart.showLegend !== false;
|
|
@@ -4558,14 +4560,14 @@ function padRightOf(legend) {
|
|
|
4558
4560
|
}
|
|
4559
4561
|
function padBottomOf(chart, showLabels, legend) {
|
|
4560
4562
|
const valueRow = chart.chartType === "bar" && chart.config?.showBarLabels === true && chart.config.barLabelPosition === "axis";
|
|
4561
|
-
const horizontalValueAxis =
|
|
4562
|
-
const base = showLabels ?
|
|
4563
|
+
const horizontalValueAxis = chunkSKGJXCAO_cjs.isHorizontalBar(chart) && chart.showValueAxis !== false;
|
|
4564
|
+
const base = showLabels ? chunkSKGJXCAO_cjs.isHorizontalBar(chart) ? horizontalValueAxis ? 34 : 12 : (chart.axisX.label ? 52 : 34) + (valueRow ? 18 : 0) : 12;
|
|
4563
4565
|
const hasColorBar = chart.chartType === "field" && legend.showLegend && Boolean(chart.config?.scale?.stops.length);
|
|
4564
4566
|
const legendInRow = legend.hasItems && !legend.atTop && !legend.stacked;
|
|
4565
4567
|
return xLabelOffset(chart) + base + (showLabels ? tiltedBottomRoom(chart) : 0) + (hasColorBar ? 44 : 0) + (legendInRow ? 16 + LEGEND_ROW_HEIGHT : 0);
|
|
4566
4568
|
}
|
|
4567
4569
|
function padTopOf(chart, legend) {
|
|
4568
|
-
const titleHeight = chart.title ? Math.max(44, 20 +
|
|
4570
|
+
const titleHeight = chart.title ? Math.max(44, 20 + chunkSKGJXCAO_cjs.finite(chart.titleSize, 14) * 1.6) : 0;
|
|
4569
4571
|
return titleHeight || (legend.atTop && legend.hasItems ? 44 : 24);
|
|
4570
4572
|
}
|
|
4571
4573
|
function decorations(chart) {
|
|
@@ -4576,9 +4578,9 @@ function decorations(chart) {
|
|
|
4576
4578
|
const padBottom = padBottomOf(chart, showLabels, legend);
|
|
4577
4579
|
const padTop = padTopOf(chart, legend);
|
|
4578
4580
|
return {
|
|
4579
|
-
bounds:
|
|
4581
|
+
bounds: chunkSKGJXCAO_cjs.boxBounds(
|
|
4580
4582
|
{ x: chart.x, y: chart.y, width: chart.width, height: chart.height },
|
|
4581
|
-
|
|
4583
|
+
chunkSKGJXCAO_cjs.finite(chart.strokeWidth, 1) + 2
|
|
4582
4584
|
),
|
|
4583
4585
|
plot: {
|
|
4584
4586
|
x: chart.x + padLeft,
|
|
@@ -4600,26 +4602,26 @@ function categoryLabels(chart, count) {
|
|
|
4600
4602
|
return Array.from({ length: count }, (_value, index) => String(index + 1));
|
|
4601
4603
|
}
|
|
4602
4604
|
function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
4603
|
-
const count =
|
|
4605
|
+
const count = chunkSKGJXCAO_cjs.barCategoryCount(chart);
|
|
4604
4606
|
const slotWidth = layout.plot.width / count;
|
|
4605
4607
|
const labels = categoryLabels(chart, count);
|
|
4606
4608
|
const editable = Boolean(chart.config?.categories?.length);
|
|
4607
|
-
const tilt =
|
|
4609
|
+
const tilt = chunkSKGJXCAO_cjs.labelTilt(chart);
|
|
4608
4610
|
const left = chart.categoryAlign === "left";
|
|
4609
4611
|
const groupGap = left ? Math.min(
|
|
4610
|
-
Math.max(0,
|
|
4612
|
+
Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.barGroupGap, 8)),
|
|
4611
4613
|
Math.max(0, slotWidth - 1)
|
|
4612
4614
|
) : 0;
|
|
4613
4615
|
return Array.from({ length: count }, (_value, index) => {
|
|
4614
4616
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
4615
4617
|
if (tilt > 0) {
|
|
4616
4618
|
const text = labels[index] ?? String(index + 1);
|
|
4617
|
-
const { frame, rotation } =
|
|
4619
|
+
const { frame, rotation } = chunkSKGJXCAO_cjs.labelBelowFrame(chart, text, tilt, {
|
|
4618
4620
|
x: centerX,
|
|
4619
4621
|
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart)
|
|
4620
4622
|
});
|
|
4621
4623
|
return {
|
|
4622
|
-
...
|
|
4624
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4623
4625
|
role: "axis",
|
|
4624
4626
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4625
4627
|
order: order + index,
|
|
@@ -4630,11 +4632,11 @@ function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
|
4630
4632
|
align: "right",
|
|
4631
4633
|
rotation
|
|
4632
4634
|
}),
|
|
4633
|
-
prop: editable ?
|
|
4635
|
+
prop: editable ? chunkSKGJXCAO_cjs.categoryProp(index) : void 0
|
|
4634
4636
|
};
|
|
4635
4637
|
}
|
|
4636
4638
|
return {
|
|
4637
|
-
...
|
|
4639
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4638
4640
|
role: "axis",
|
|
4639
4641
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4640
4642
|
order: order + index,
|
|
@@ -4649,24 +4651,24 @@ function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
|
4649
4651
|
chart,
|
|
4650
4652
|
align: left ? "left" : "center"
|
|
4651
4653
|
}),
|
|
4652
|
-
prop: editable ?
|
|
4654
|
+
prop: editable ? chunkSKGJXCAO_cjs.categoryProp(index) : void 0
|
|
4653
4655
|
};
|
|
4654
4656
|
});
|
|
4655
4657
|
}
|
|
4656
4658
|
function buildSeriesXAxisTicks(chart, layout, order) {
|
|
4657
4659
|
const count = Math.max(1, chart.series.length);
|
|
4658
4660
|
const slotWidth = layout.plot.width / count;
|
|
4659
|
-
const tilt =
|
|
4661
|
+
const tilt = chunkSKGJXCAO_cjs.labelTilt(chart);
|
|
4660
4662
|
return chart.series.map((series, index) => {
|
|
4661
4663
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
4662
4664
|
if (tilt > 0) {
|
|
4663
4665
|
const text = series.label || series.id;
|
|
4664
|
-
const { frame, rotation } =
|
|
4666
|
+
const { frame, rotation } = chunkSKGJXCAO_cjs.labelBelowFrame(chart, text, tilt, {
|
|
4665
4667
|
x: centerX,
|
|
4666
4668
|
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart)
|
|
4667
4669
|
});
|
|
4668
4670
|
return {
|
|
4669
|
-
...
|
|
4671
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4670
4672
|
role: "axis",
|
|
4671
4673
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4672
4674
|
order: order + index,
|
|
@@ -4677,11 +4679,11 @@ function buildSeriesXAxisTicks(chart, layout, order) {
|
|
|
4677
4679
|
align: "right",
|
|
4678
4680
|
rotation
|
|
4679
4681
|
}),
|
|
4680
|
-
prop:
|
|
4682
|
+
prop: chunkSKGJXCAO_cjs.seriesLabelProp(series.id)
|
|
4681
4683
|
};
|
|
4682
4684
|
}
|
|
4683
4685
|
return {
|
|
4684
|
-
...
|
|
4686
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4685
4687
|
role: "axis",
|
|
4686
4688
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4687
4689
|
order: order + index,
|
|
@@ -4696,16 +4698,16 @@ function buildSeriesXAxisTicks(chart, layout, order) {
|
|
|
4696
4698
|
chart,
|
|
4697
4699
|
align: "center"
|
|
4698
4700
|
}),
|
|
4699
|
-
prop:
|
|
4701
|
+
prop: chunkSKGJXCAO_cjs.seriesLabelProp(series.id)
|
|
4700
4702
|
};
|
|
4701
4703
|
});
|
|
4702
4704
|
}
|
|
4703
4705
|
|
|
4704
4706
|
// src/renderScene/charts/decorations/numericXAxis.ts
|
|
4705
4707
|
function buildNumericXAxisTicks(chart, layout, order) {
|
|
4706
|
-
return
|
|
4707
|
-
const x = layout.plot.x +
|
|
4708
|
-
return
|
|
4708
|
+
return chunkSKGJXCAO_cjs.chartTicks(chart.axisX).map((tick, index) => {
|
|
4709
|
+
const x = layout.plot.x + chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisX, layout.plot.width);
|
|
4710
|
+
return chunkSKGJXCAO_cjs.chartText({
|
|
4709
4711
|
role: "axis",
|
|
4710
4712
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
4711
4713
|
order: order + index,
|
|
@@ -4720,9 +4722,9 @@ function buildNumericXAxisTicks(chart, layout, order) {
|
|
|
4720
4722
|
|
|
4721
4723
|
// src/renderScene/charts/decorations/numericYAxis.ts
|
|
4722
4724
|
function buildNumericYAxisTicks(chart, layout, order) {
|
|
4723
|
-
return
|
|
4724
|
-
const y = layout.plot.y + layout.plot.height -
|
|
4725
|
-
return
|
|
4725
|
+
return chunkSKGJXCAO_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
4726
|
+
const y = layout.plot.y + layout.plot.height - chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisY, layout.plot.height);
|
|
4727
|
+
return chunkSKGJXCAO_cjs.chartText({
|
|
4726
4728
|
role: "axis",
|
|
4727
4729
|
id: `chart-y-tick-${chart.id}-${tick}`,
|
|
4728
4730
|
order: order + index,
|
|
@@ -4757,10 +4759,10 @@ function buildYAxisTicks(chart, layout, order) {
|
|
|
4757
4759
|
function xTickPositions(chart, layout) {
|
|
4758
4760
|
const { plot } = layout;
|
|
4759
4761
|
if (chart.chartType === "bar") {
|
|
4760
|
-
const count =
|
|
4762
|
+
const count = chunkSKGJXCAO_cjs.barCategoryCount(chart);
|
|
4761
4763
|
return Array.from({ length: count }, (_value, index) => plot.x + (index + 0.5) * plot.width / count);
|
|
4762
4764
|
}
|
|
4763
|
-
return
|
|
4765
|
+
return chunkSKGJXCAO_cjs.chartTicks(chart.axisX).map((tick) => plot.x + chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisX, plot.width));
|
|
4764
4766
|
}
|
|
4765
4767
|
function axisLineDash(chart, width) {
|
|
4766
4768
|
if (chart.axisLineStyle === "dashed") {
|
|
@@ -4769,8 +4771,8 @@ function axisLineDash(chart, width) {
|
|
|
4769
4771
|
return chart.axisLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : {};
|
|
4770
4772
|
}
|
|
4771
4773
|
function buildAxisLines(chart, layout, order) {
|
|
4772
|
-
const lineWidth =
|
|
4773
|
-
const tickLength =
|
|
4774
|
+
const lineWidth = chunkSKGJXCAO_cjs.finite(chart.axisLineWidth, 0);
|
|
4775
|
+
const tickLength = chunkSKGJXCAO_cjs.finite(chart.tickLength, 0);
|
|
4774
4776
|
if (lineWidth <= 0 && tickLength <= 0) {
|
|
4775
4777
|
return [];
|
|
4776
4778
|
}
|
|
@@ -4791,20 +4793,20 @@ function buildAxisLines(chart, layout, order) {
|
|
|
4791
4793
|
}
|
|
4792
4794
|
add("line-x", `M ${plot.x} ${bottom} L ${plot.x + plot.width} ${bottom}`);
|
|
4793
4795
|
}
|
|
4794
|
-
if (tickLength > 0 &&
|
|
4795
|
-
|
|
4796
|
-
const x = plot.x +
|
|
4796
|
+
if (tickLength > 0 && chunkSKGJXCAO_cjs.isHorizontalBar(chart)) {
|
|
4797
|
+
chunkSKGJXCAO_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4798
|
+
const x = plot.x + chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4797
4799
|
add(`tick-v-${tick}`, `M ${x} ${bottom} L ${x} ${bottom + tickLength}`);
|
|
4798
4800
|
});
|
|
4799
|
-
const rows =
|
|
4801
|
+
const rows = chunkSKGJXCAO_cjs.horizontalRows(chart, plot);
|
|
4800
4802
|
for (let index = 0; index < rows.count; index++) {
|
|
4801
|
-
const y =
|
|
4803
|
+
const y = chunkSKGJXCAO_cjs.rowTop(rows, plot, index) + rows.labelRow + rows.barsHeight / 2;
|
|
4802
4804
|
add(`tick-c-${index}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
4803
4805
|
}
|
|
4804
4806
|
}
|
|
4805
|
-
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !
|
|
4806
|
-
|
|
4807
|
-
const y = bottom -
|
|
4807
|
+
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !chunkSKGJXCAO_cjs.isHorizontalBar(chart)) {
|
|
4808
|
+
chunkSKGJXCAO_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4809
|
+
const y = bottom - chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
4808
4810
|
add(`tick-y-${tick}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
4809
4811
|
});
|
|
4810
4812
|
xTickPositions(chart, layout).forEach((x, index) => {
|
|
@@ -4819,14 +4821,14 @@ function categoryNames(chart, count) {
|
|
|
4819
4821
|
}
|
|
4820
4822
|
function buildHorizontalBarAxes(chart, layout, order) {
|
|
4821
4823
|
const { plot, bounds } = layout;
|
|
4822
|
-
const rows =
|
|
4824
|
+
const rows = chunkSKGJXCAO_cjs.horizontalRows(chart, plot);
|
|
4823
4825
|
const above = chart.categoryAlign === "left";
|
|
4824
4826
|
const inside = chart.categoryAlign === "inside";
|
|
4825
4827
|
const editable = Boolean(chart.config?.categories?.length);
|
|
4826
4828
|
const nodes = categoryNames(chart, rows.count).map((name, index) => {
|
|
4827
|
-
const top =
|
|
4829
|
+
const top = chunkSKGJXCAO_cjs.rowTop(rows, plot, index);
|
|
4828
4830
|
return {
|
|
4829
|
-
...
|
|
4831
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
4830
4832
|
role: "axis",
|
|
4831
4833
|
id: `chart-y-category-${chart.id}-${index}`,
|
|
4832
4834
|
order: order + index,
|
|
@@ -4836,19 +4838,19 @@ function buildHorizontalBarAxes(chart, layout, order) {
|
|
|
4836
4838
|
chart,
|
|
4837
4839
|
align: above || inside ? "left" : "right"
|
|
4838
4840
|
}),
|
|
4839
|
-
prop: editable ?
|
|
4841
|
+
prop: editable ? chunkSKGJXCAO_cjs.categoryProp(index) : void 0
|
|
4840
4842
|
};
|
|
4841
4843
|
});
|
|
4842
4844
|
if (chart.showValueAxis !== false) {
|
|
4843
|
-
|
|
4844
|
-
const x = plot.x +
|
|
4845
|
+
chunkSKGJXCAO_cjs.chartTicks(chart.axisY).forEach((tick, index) => {
|
|
4846
|
+
const x = plot.x + chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4845
4847
|
nodes.push(
|
|
4846
|
-
|
|
4848
|
+
chunkSKGJXCAO_cjs.chartText({
|
|
4847
4849
|
role: "axis",
|
|
4848
4850
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
4849
4851
|
order: order + rows.count + index,
|
|
4850
4852
|
bounds,
|
|
4851
|
-
frame: { x: x - 20, y: plot.y + plot.height + 4 +
|
|
4853
|
+
frame: { x: x - 20, y: plot.y + plot.height + 4 + chunkSKGJXCAO_cjs.finite(chart.tickLength, 0), width: 40, height: 18 },
|
|
4852
4854
|
text: String(tick),
|
|
4853
4855
|
chart,
|
|
4854
4856
|
align: "center"
|
|
@@ -4867,7 +4869,7 @@ function buildChartAxes(chart, layout, order) {
|
|
|
4867
4869
|
return lines;
|
|
4868
4870
|
}
|
|
4869
4871
|
order += lines.length;
|
|
4870
|
-
if (
|
|
4872
|
+
if (chunkSKGJXCAO_cjs.isHorizontalBar(chart)) {
|
|
4871
4873
|
return [...lines, ...buildHorizontalBarAxes(chart, layout, order)];
|
|
4872
4874
|
}
|
|
4873
4875
|
const xTicks = buildXAxisTicks(chart, layout, order);
|
|
@@ -4945,7 +4947,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4945
4947
|
const centerX = plot.x + plot.width / 2;
|
|
4946
4948
|
const centerY = plot.y + plot.height / 2;
|
|
4947
4949
|
const radius = Math.max(0, Math.min(plot.width, plot.height) / 2);
|
|
4948
|
-
const width =
|
|
4950
|
+
const width = chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1);
|
|
4949
4951
|
if (chart.gridLineStyle === "dotted") {
|
|
4950
4952
|
return buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width);
|
|
4951
4953
|
}
|
|
@@ -4956,7 +4958,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4956
4958
|
...gridLineDashStyle(chart, width)
|
|
4957
4959
|
};
|
|
4958
4960
|
const nodes = [];
|
|
4959
|
-
|
|
4961
|
+
chunkSKGJXCAO_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min).forEach((tick) => {
|
|
4960
4962
|
const ringRadius = radius * ringRatio(chart, tick);
|
|
4961
4963
|
nodes.push({
|
|
4962
4964
|
type: "ellipse",
|
|
@@ -4970,8 +4972,8 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4970
4972
|
style
|
|
4971
4973
|
});
|
|
4972
4974
|
});
|
|
4973
|
-
|
|
4974
|
-
const angle =
|
|
4975
|
+
chunkSKGJXCAO_cjs.chartTicks(chart.axisX).forEach((tick) => {
|
|
4976
|
+
const angle = chunkSKGJXCAO_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, tick);
|
|
4975
4977
|
const edgeX = centerX + Math.cos(angle) * radius;
|
|
4976
4978
|
const edgeY = centerY + Math.sin(angle) * radius;
|
|
4977
4979
|
nodes.push({
|
|
@@ -4986,13 +4988,13 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4986
4988
|
return nodes;
|
|
4987
4989
|
}
|
|
4988
4990
|
function buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width) {
|
|
4989
|
-
const yTicks =
|
|
4990
|
-
const xTicks =
|
|
4991
|
+
const yTicks = chunkSKGJXCAO_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min);
|
|
4992
|
+
const xTicks = chunkSKGJXCAO_cjs.chartTicks(chart.axisX);
|
|
4991
4993
|
const nodes = [];
|
|
4992
4994
|
yTicks.forEach((yTick) => {
|
|
4993
4995
|
const ringRadius = radius * ringRatio(chart, yTick);
|
|
4994
4996
|
xTicks.forEach((xTick) => {
|
|
4995
|
-
const angle =
|
|
4997
|
+
const angle = chunkSKGJXCAO_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, xTick);
|
|
4996
4998
|
const x = centerX + Math.cos(angle) * ringRadius;
|
|
4997
4999
|
const y = centerY + Math.sin(angle) * ringRadius;
|
|
4998
5000
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
@@ -5014,8 +5016,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
5014
5016
|
if (chart.gridShape === "circle" && CIRCULAR_GRID_CHART_TYPES.has(chart.chartType)) {
|
|
5015
5017
|
return buildCircularChartGrid(chart, plot, bounds, order);
|
|
5016
5018
|
}
|
|
5017
|
-
const width =
|
|
5018
|
-
if (
|
|
5019
|
+
const width = chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1);
|
|
5020
|
+
if (chunkSKGJXCAO_cjs.isHorizontalBar(chart)) {
|
|
5019
5021
|
return buildHorizontalBarGrid(chart, plot, bounds, order, width);
|
|
5020
5022
|
}
|
|
5021
5023
|
const clip = chart.chartType === "field" ? fieldSurfaceClip(chart, plot) : void 0;
|
|
@@ -5030,8 +5032,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
5030
5032
|
clip
|
|
5031
5033
|
};
|
|
5032
5034
|
const nodes = [];
|
|
5033
|
-
(chart.gridAxes === "y" ? [] :
|
|
5034
|
-
const x = plot.x +
|
|
5035
|
+
(chart.gridAxes === "y" ? [] : chunkSKGJXCAO_cjs.chartTicks(chart.axisX)).forEach((tick) => {
|
|
5036
|
+
const x = plot.x + chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisX, plot.width);
|
|
5035
5037
|
nodes.push({
|
|
5036
5038
|
type: "path",
|
|
5037
5039
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -5041,8 +5043,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
5041
5043
|
style
|
|
5042
5044
|
});
|
|
5043
5045
|
});
|
|
5044
|
-
(chart.gridAxes === "x" ? [] :
|
|
5045
|
-
const y = plot.y + plot.height -
|
|
5046
|
+
(chart.gridAxes === "x" ? [] : chunkSKGJXCAO_cjs.chartTicks(chart.axisY)).forEach((tick) => {
|
|
5047
|
+
const y = plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
5046
5048
|
nodes.push({
|
|
5047
5049
|
type: "path",
|
|
5048
5050
|
id: `chart-grid-y-${chart.id}-${tick}`,
|
|
@@ -5064,8 +5066,8 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
5064
5066
|
strokeWidth: width,
|
|
5065
5067
|
...chart.gridLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : gridLineDashStyle(chart, width)
|
|
5066
5068
|
};
|
|
5067
|
-
return
|
|
5068
|
-
const x = plot.x +
|
|
5069
|
+
return chunkSKGJXCAO_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
5070
|
+
const x = plot.x + chunkSKGJXCAO_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
5069
5071
|
return {
|
|
5070
5072
|
type: "path",
|
|
5071
5073
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -5077,13 +5079,13 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
5077
5079
|
});
|
|
5078
5080
|
}
|
|
5079
5081
|
function buildDottedRectGrid(chart, plot, bounds, order, width, clip) {
|
|
5080
|
-
const xTicks =
|
|
5081
|
-
const yTicks =
|
|
5082
|
+
const xTicks = chunkSKGJXCAO_cjs.chartTicks(chart.axisX);
|
|
5083
|
+
const yTicks = chunkSKGJXCAO_cjs.chartTicks(chart.axisY);
|
|
5082
5084
|
const nodes = [];
|
|
5083
5085
|
xTicks.forEach((xTick) => {
|
|
5084
|
-
const x = plot.x +
|
|
5086
|
+
const x = plot.x + chunkSKGJXCAO_cjs.mapChartValue(xTick, chart.axisX, plot.width);
|
|
5085
5087
|
yTicks.forEach((yTick) => {
|
|
5086
|
-
const y = plot.y + plot.height -
|
|
5088
|
+
const y = plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(yTick, chart.axisY, plot.height);
|
|
5087
5089
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
5088
5090
|
nodes.push(createGridDot(chart, id, order + nodes.length, bounds, x, y, width, clip));
|
|
5089
5091
|
});
|
|
@@ -5106,7 +5108,7 @@ function createChartRuleMarks(render2) {
|
|
|
5106
5108
|
return {
|
|
5107
5109
|
rule,
|
|
5108
5110
|
color: rule.color || render2.chart.strokeColor || "#475569",
|
|
5109
|
-
y: render2.plot.y + render2.plot.height -
|
|
5111
|
+
y: render2.plot.y + render2.plot.height - chunkSKGJXCAO_cjs.mapChartValue(rule.at, render2.chart.axisY, render2.plot.height),
|
|
5110
5112
|
lineOrder,
|
|
5111
5113
|
labelOrder
|
|
5112
5114
|
};
|
|
@@ -5126,7 +5128,7 @@ function createChartRuleLine(render2, mark) {
|
|
|
5126
5128
|
order: mark.lineOrder,
|
|
5127
5129
|
bounds: render2.bounds,
|
|
5128
5130
|
d: `M ${render2.plot.x} ${mark.y} L ${render2.plot.x + render2.plot.width} ${mark.y}`,
|
|
5129
|
-
prop:
|
|
5131
|
+
prop: chunkSKGJXCAO_cjs.ruleAtProp(mark.rule.id),
|
|
5130
5132
|
propKind: "value",
|
|
5131
5133
|
style: {
|
|
5132
5134
|
fill: { kind: "none" },
|
|
@@ -5137,9 +5139,9 @@ function createChartRuleLine(render2, mark) {
|
|
|
5137
5139
|
};
|
|
5138
5140
|
}
|
|
5139
5141
|
function createChartRuleLabel(render2, mark) {
|
|
5140
|
-
const fontSize = Math.max(9,
|
|
5142
|
+
const fontSize = Math.max(9, chunkSKGJXCAO_cjs.finite(render2.chart.fontSize, 12) - 2);
|
|
5141
5143
|
return {
|
|
5142
|
-
...
|
|
5144
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
5143
5145
|
id: `chart-rule-label-${render2.chart.id}-${mark.rule.id}`,
|
|
5144
5146
|
order: mark.labelOrder ?? mark.lineOrder + 1,
|
|
5145
5147
|
bounds: render2.bounds,
|
|
@@ -5148,19 +5150,19 @@ function createChartRuleLabel(render2, mark) {
|
|
|
5148
5150
|
chart: render2.chart
|
|
5149
5151
|
}),
|
|
5150
5152
|
color: mark.color,
|
|
5151
|
-
prop:
|
|
5153
|
+
prop: chunkSKGJXCAO_cjs.ruleTextProp(mark.rule.id)
|
|
5152
5154
|
};
|
|
5153
5155
|
}
|
|
5154
5156
|
|
|
5155
5157
|
// src/renderScene/charts/chartBackdrop.ts
|
|
5156
5158
|
function chartImageRect(chart) {
|
|
5157
|
-
const inset =
|
|
5159
|
+
const inset = chunkSKGJXCAO_cjs.finite(chart.strokeWidth, 1) / 2;
|
|
5158
5160
|
return {
|
|
5159
5161
|
x: chart.x + inset,
|
|
5160
5162
|
y: chart.y + inset,
|
|
5161
5163
|
width: Math.max(1, chart.width - inset * 2),
|
|
5162
5164
|
height: Math.max(1, chart.height - inset * 2),
|
|
5163
|
-
rx: Math.max(0,
|
|
5165
|
+
rx: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.cornerRadius, 12) - inset)
|
|
5164
5166
|
};
|
|
5165
5167
|
}
|
|
5166
5168
|
function buildChartBackdrop(chart, bounds, order) {
|
|
@@ -5202,7 +5204,7 @@ function buildChartBackdrop(chart, bounds, order) {
|
|
|
5202
5204
|
// src/renderScene/charts/renderers/bar/glass.ts
|
|
5203
5205
|
function createGlassBackdropNodes(context, id, d) {
|
|
5204
5206
|
const { chart, bounds, nextOrder } = context;
|
|
5205
|
-
const blur =
|
|
5207
|
+
const blur = chunkSKGJXCAO_cjs.finite(chart.config?.barGlassBlur, 0);
|
|
5206
5208
|
if (blur <= 0 || !chart.fillImage) {
|
|
5207
5209
|
return [];
|
|
5208
5210
|
}
|
|
@@ -5220,7 +5222,7 @@ function createGlassBackdropNodes(context, id, d) {
|
|
|
5220
5222
|
href: chart.fillImage.url,
|
|
5221
5223
|
style: {
|
|
5222
5224
|
blur,
|
|
5223
|
-
saturate:
|
|
5225
|
+
saturate: chunkSKGJXCAO_cjs.finite(chart.config?.barGlassSaturation, 1),
|
|
5224
5226
|
clip: { type: "path", d },
|
|
5225
5227
|
pointerEvents: "none"
|
|
5226
5228
|
}
|
|
@@ -5271,8 +5273,8 @@ function createBarGlowNode(context, id, d, color, glow, bounds = context.bounds)
|
|
|
5271
5273
|
bounds,
|
|
5272
5274
|
d,
|
|
5273
5275
|
style: {
|
|
5274
|
-
fill:
|
|
5275
|
-
shadow: { color:
|
|
5276
|
+
fill: chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id),
|
|
5277
|
+
shadow: { color: chunkSKGJXCAO_cjs.representativeColor(color, "#ffffff"), opacity: 0.9, blur: glow, dx: 0, dy: 0 },
|
|
5276
5278
|
pointerEvents: "none"
|
|
5277
5279
|
}
|
|
5278
5280
|
};
|
|
@@ -5283,14 +5285,14 @@ function barLabelsEnabled(context) {
|
|
|
5283
5285
|
return context.chart.config?.showBarLabels === true;
|
|
5284
5286
|
}
|
|
5285
5287
|
function resolvePlacement(target, size) {
|
|
5286
|
-
const fits = target.frame.height >= size.height +
|
|
5288
|
+
const fits = target.frame.height >= size.height + chunkSKGJXCAO_cjs.BAR_LABEL.gap * 2;
|
|
5287
5289
|
return target.placement !== "outside" && !fits ? "outside" : target.placement;
|
|
5288
5290
|
}
|
|
5289
5291
|
function labelTop(placement, frame, height) {
|
|
5290
5292
|
if (placement === "outside") {
|
|
5291
|
-
return frame.y - height -
|
|
5293
|
+
return frame.y - height - chunkSKGJXCAO_cjs.BAR_LABEL.gap;
|
|
5292
5294
|
}
|
|
5293
|
-
return placement === "inside" ? frame.y +
|
|
5295
|
+
return placement === "inside" ? frame.y + chunkSKGJXCAO_cjs.BAR_LABEL.gap : frame.y + frame.height / 2 - height / 2;
|
|
5294
5296
|
}
|
|
5295
5297
|
function createPillNode(context, id, box, color) {
|
|
5296
5298
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
@@ -5300,11 +5302,11 @@ function createPillNode(context, id, box, color) {
|
|
|
5300
5302
|
id: `${id}-pill`,
|
|
5301
5303
|
order: nextOrder(),
|
|
5302
5304
|
bounds,
|
|
5303
|
-
d:
|
|
5305
|
+
d: chunkSKGJXCAO_cjs.pillPath(box.left, box.top, box.width, box.height),
|
|
5304
5306
|
style: {
|
|
5305
|
-
fill: config?.barLabelPillColor ?
|
|
5306
|
-
stroke:
|
|
5307
|
-
strokeWidth:
|
|
5307
|
+
fill: config?.barLabelPillColor ? chunkSKGJXCAO_cjs.paint(config.barLabelPillColor, diagnostics, chart.id) : { kind: "none" },
|
|
5308
|
+
stroke: chunkSKGJXCAO_cjs.paint(config?.barLabelBorderColor ?? color, diagnostics, chart.id),
|
|
5309
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(config?.barLabelBorderWidth, 1),
|
|
5308
5310
|
pointerEvents: "none"
|
|
5309
5311
|
}
|
|
5310
5312
|
};
|
|
@@ -5313,7 +5315,7 @@ function createTextNode(context, id, box, text, placement, fontSize, color) {
|
|
|
5313
5315
|
const { chart, bounds, nextOrder } = context;
|
|
5314
5316
|
const config = chart.config;
|
|
5315
5317
|
return {
|
|
5316
|
-
...
|
|
5318
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
5317
5319
|
id,
|
|
5318
5320
|
order: nextOrder(),
|
|
5319
5321
|
bounds,
|
|
@@ -5334,7 +5336,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
5334
5336
|
const config = chart.config;
|
|
5335
5337
|
const top = plot.y + plot.height + 4 + 16 + Math.max(0, chart.tickLength ?? 0);
|
|
5336
5338
|
return {
|
|
5337
|
-
...
|
|
5339
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
5338
5340
|
id: target.id,
|
|
5339
5341
|
order: nextOrder(),
|
|
5340
5342
|
bounds,
|
|
@@ -5343,7 +5345,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
5343
5345
|
y: target.frame.y + target.frame.height / 2 - fontSize * 0.6,
|
|
5344
5346
|
width: plot.width - 14,
|
|
5345
5347
|
height: fontSize * 1.2
|
|
5346
|
-
} : { x: plot.x, y: target.frame.y -
|
|
5348
|
+
} : { x: plot.x, y: target.frame.y - chunkSKGJXCAO_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 },
|
|
5347
5349
|
text,
|
|
5348
5350
|
chart,
|
|
5349
5351
|
align: target.horizontal ? "right" : chart.categoryAlign === "left" ? "left" : "center"
|
|
@@ -5357,24 +5359,24 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
5357
5359
|
}
|
|
5358
5360
|
function horizontalPlacement(target, size) {
|
|
5359
5361
|
const requested = target.placement === "axis" ? "outside" : target.placement;
|
|
5360
|
-
const fits = target.frame.width >= size.width +
|
|
5362
|
+
const fits = target.frame.width >= size.width + chunkSKGJXCAO_cjs.BAR_LABEL.gap * 2;
|
|
5361
5363
|
return requested !== "outside" && !fits ? "outside" : requested;
|
|
5362
5364
|
}
|
|
5363
5365
|
function horizontalBox(target, size, placement) {
|
|
5364
5366
|
const { frame } = target;
|
|
5365
|
-
const left = placement === "outside" ? frame.x + frame.width +
|
|
5367
|
+
const left = placement === "outside" ? frame.x + frame.width + chunkSKGJXCAO_cjs.BAR_LABEL.gap : placement === "inside" ? frame.x + frame.width - size.width - chunkSKGJXCAO_cjs.BAR_LABEL.gap : frame.x + frame.width / 2 - size.width / 2;
|
|
5366
5368
|
return { ...size, left, top: frame.y + frame.height / 2 - size.height / 2 };
|
|
5367
5369
|
}
|
|
5368
5370
|
function createBarLabelNodes(context, target) {
|
|
5369
5371
|
const { chart } = context;
|
|
5370
5372
|
const config = chart.config;
|
|
5371
|
-
const fontSize = Math.max(8,
|
|
5372
|
-
const text =
|
|
5373
|
+
const fontSize = Math.max(8, chunkSKGJXCAO_cjs.finite(config?.barLabelFontSize, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12)));
|
|
5374
|
+
const text = chunkSKGJXCAO_cjs.formatBarLabel(target.value, config?.barLabelFormat);
|
|
5373
5375
|
if (target.placement === "axis") {
|
|
5374
5376
|
return [createAxisValueNode(context, target, text, fontSize)];
|
|
5375
5377
|
}
|
|
5376
5378
|
const pill = config?.barLabelPill === true;
|
|
5377
|
-
const size =
|
|
5379
|
+
const size = chunkSKGJXCAO_cjs.barLabelSize(text, fontSize, pill);
|
|
5378
5380
|
const placement = target.horizontal ? horizontalPlacement(target, size) : resolvePlacement(target, size);
|
|
5379
5381
|
const box = target.horizontal ? horizontalBox(target, size, placement) : {
|
|
5380
5382
|
...size,
|
|
@@ -5415,7 +5417,7 @@ function barTrackClip(context, frame) {
|
|
|
5415
5417
|
}
|
|
5416
5418
|
return {
|
|
5417
5419
|
type: "path",
|
|
5418
|
-
d:
|
|
5420
|
+
d: chunkSKGJXCAO_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, context.chart.config?.barCornerRadius ?? 2)
|
|
5419
5421
|
};
|
|
5420
5422
|
}
|
|
5421
5423
|
function barTrackEnabled(context) {
|
|
@@ -5425,8 +5427,8 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
5425
5427
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
5426
5428
|
const config = chart.config;
|
|
5427
5429
|
const radius = config?.barCornerRadius ?? 2;
|
|
5428
|
-
const segments =
|
|
5429
|
-
const d = segments > 0 ?
|
|
5430
|
+
const segments = chunkSKGJXCAO_cjs.finite(config?.barSegments, 0);
|
|
5431
|
+
const d = segments > 0 ? chunkSKGJXCAO_cjs.segmentedBarPath(frame, orientation, segments, chunkSKGJXCAO_cjs.finite(config?.barSegmentGap, 4), radius, 1, true) : chunkSKGJXCAO_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, radius);
|
|
5430
5432
|
const nodes = [
|
|
5431
5433
|
{
|
|
5432
5434
|
type: "path",
|
|
@@ -5435,7 +5437,7 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
5435
5437
|
bounds,
|
|
5436
5438
|
d,
|
|
5437
5439
|
style: {
|
|
5438
|
-
fill:
|
|
5440
|
+
fill: chunkSKGJXCAO_cjs.paint(config?.barTrackColor ?? chart.gridColor ?? "#e2e8f0", diagnostics, chart.id),
|
|
5439
5441
|
pointerEvents: "none"
|
|
5440
5442
|
}
|
|
5441
5443
|
}
|
|
@@ -5451,13 +5453,13 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
5451
5453
|
frame.y,
|
|
5452
5454
|
frame.width,
|
|
5453
5455
|
frame.height,
|
|
5454
|
-
|
|
5455
|
-
Math.max(MIN_HATCH_SPACING,
|
|
5456
|
+
chunkSKGJXCAO_cjs.finite(config.barTrackHatchAngle, DEFAULT_HATCH.angle),
|
|
5457
|
+
Math.max(MIN_HATCH_SPACING, chunkSKGJXCAO_cjs.finite(config.barTrackHatchSpacing, DEFAULT_HATCH.spacing))
|
|
5456
5458
|
),
|
|
5457
5459
|
style: {
|
|
5458
5460
|
fill: { kind: "none" },
|
|
5459
|
-
stroke:
|
|
5460
|
-
strokeWidth:
|
|
5461
|
+
stroke: chunkSKGJXCAO_cjs.paint(config.barTrackHatchColor ?? chart.gridColor ?? "#cbd5e1", diagnostics, chart.id),
|
|
5462
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(config.barTrackHatchWidth, DEFAULT_HATCH.width),
|
|
5461
5463
|
pointerEvents: "none",
|
|
5462
5464
|
clip: { type: "path", d }
|
|
5463
5465
|
}
|
|
@@ -5504,23 +5506,23 @@ function groupedShape(context, frame) {
|
|
|
5504
5506
|
const { chart, plot } = context;
|
|
5505
5507
|
const config = chart.config;
|
|
5506
5508
|
const radius = config?.barCornerRadius ?? 2;
|
|
5507
|
-
const segments =
|
|
5509
|
+
const segments = chunkSKGJXCAO_cjs.finite(config?.barSegments, 0);
|
|
5508
5510
|
if (segments > 0) {
|
|
5509
|
-
return
|
|
5511
|
+
return chunkSKGJXCAO_cjs.segmentedBarPath(
|
|
5510
5512
|
{ x: frame.x, y: plot.y, width: frame.width, height: plot.height },
|
|
5511
5513
|
"vertical",
|
|
5512
5514
|
segments,
|
|
5513
|
-
|
|
5515
|
+
chunkSKGJXCAO_cjs.finite(config?.barSegmentGap, 4),
|
|
5514
5516
|
radius,
|
|
5515
5517
|
frame.height / plot.height,
|
|
5516
5518
|
config?.barSegmentSnap !== false
|
|
5517
5519
|
);
|
|
5518
5520
|
}
|
|
5519
|
-
return
|
|
5521
|
+
return chunkSKGJXCAO_cjs.barPath(frame.x, frame.y, frame.width, frame.height, radius, config?.barRoundedBottom === true);
|
|
5520
5522
|
}
|
|
5521
5523
|
function createGroupedGlow(context, mark) {
|
|
5522
5524
|
const { chart } = context;
|
|
5523
|
-
const glow =
|
|
5525
|
+
const glow = chunkSKGJXCAO_cjs.finite(chart.config?.barGlow, 0);
|
|
5524
5526
|
if (glow <= 0 || mark.frame.height <= 0) {
|
|
5525
5527
|
return [];
|
|
5526
5528
|
}
|
|
@@ -5531,10 +5533,10 @@ function createGroupedGlow(context, mark) {
|
|
|
5531
5533
|
}
|
|
5532
5534
|
function createGroupedBarLayout(context) {
|
|
5533
5535
|
const { chart, plot } = context;
|
|
5534
|
-
const valueCount =
|
|
5536
|
+
const valueCount = chunkSKGJXCAO_cjs.barCategoryCount(chart);
|
|
5535
5537
|
const slotWidth = plot.width / valueCount;
|
|
5536
|
-
const groupGap = Math.min(Math.max(0,
|
|
5537
|
-
const barGap = Math.max(0,
|
|
5538
|
+
const groupGap = Math.min(Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
5539
|
+
const barGap = Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.barGap, 2));
|
|
5538
5540
|
return {
|
|
5539
5541
|
slotWidth,
|
|
5540
5542
|
seriesWidth: Math.max(1, (slotWidth - groupGap) / Math.max(1, chart.series.length)),
|
|
@@ -5544,10 +5546,10 @@ function createGroupedBarLayout(context) {
|
|
|
5544
5546
|
}
|
|
5545
5547
|
function createSeriesBarMarks(context, layout, series, seriesIndex) {
|
|
5546
5548
|
const { chart, plot } = context;
|
|
5547
|
-
const seriesColor2 = series.color ??
|
|
5549
|
+
const seriesColor2 = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
5548
5550
|
return series.values.map((value, valueIndex) => {
|
|
5549
5551
|
const numericValue = Array.isArray(value) ? value[1] : value;
|
|
5550
|
-
const height = Math.max(0,
|
|
5552
|
+
const height = Math.max(0, chunkSKGJXCAO_cjs.mapChartValue(numericValue, chart.axisY, plot.height));
|
|
5551
5553
|
return {
|
|
5552
5554
|
seriesId: series.id,
|
|
5553
5555
|
valueIndex,
|
|
@@ -5581,10 +5583,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
5581
5583
|
const radius = chart.config?.barCornerRadius ?? 2;
|
|
5582
5584
|
const { x, width } = mark.frame;
|
|
5583
5585
|
const path = groupedShape(context, mark.frame);
|
|
5584
|
-
const fill2 =
|
|
5585
|
-
const stroke =
|
|
5586
|
-
const strokeWidth =
|
|
5587
|
-
const shadow =
|
|
5586
|
+
const fill2 = chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5587
|
+
const stroke = chunkSKGJXCAO_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5588
|
+
const strokeWidth = chunkSKGJXCAO_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5589
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5588
5590
|
const shadowCaster = shadow ? {
|
|
5589
5591
|
type: "path",
|
|
5590
5592
|
id: `chart-bar-shadow-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
@@ -5614,10 +5616,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
5614
5616
|
valueIndex: mark.valueIndex,
|
|
5615
5617
|
mark: "bar",
|
|
5616
5618
|
radius,
|
|
5617
|
-
colorProp:
|
|
5619
|
+
colorProp: chunkSKGJXCAO_cjs.seriesValueColorProp(mark.seriesId, mark.valueIndex),
|
|
5618
5620
|
hasColorOverride: mark.hasColorOverride
|
|
5619
5621
|
},
|
|
5620
|
-
prop:
|
|
5622
|
+
prop: chunkSKGJXCAO_cjs.seriesValueProp(mark.seriesId, mark.valueIndex),
|
|
5621
5623
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
5622
5624
|
};
|
|
5623
5625
|
const glass = createGlassBackdropNodes(context, `${mark.seriesId}-${mark.valueIndex}`, path);
|
|
@@ -5628,15 +5630,15 @@ function createGroupedBarError(context, mark) {
|
|
|
5628
5630
|
return null;
|
|
5629
5631
|
}
|
|
5630
5632
|
const { chart, plot, bounds, nextOrder } = context;
|
|
5631
|
-
const [lower, upper] =
|
|
5632
|
-
return
|
|
5633
|
+
const [lower, upper] = chunkSKGJXCAO_cjs.errorBarRange(mark.value, mark.error);
|
|
5634
|
+
return chunkSKGJXCAO_cjs.createVerticalErrorWhiskerNode({
|
|
5633
5635
|
id: `chart-bar-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
5634
5636
|
order: nextOrder(),
|
|
5635
5637
|
bounds,
|
|
5636
5638
|
geometry: {
|
|
5637
5639
|
centerX: mark.frame.x + mark.frame.width / 2,
|
|
5638
|
-
startY: plot.y + plot.height -
|
|
5639
|
-
endY: plot.y + plot.height -
|
|
5640
|
+
startY: plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
5641
|
+
endY: plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
5640
5642
|
},
|
|
5641
5643
|
color: chart.textColor ?? "#0f172a",
|
|
5642
5644
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -5646,9 +5648,9 @@ function createGroupedBarError(context, mark) {
|
|
|
5646
5648
|
// src/renderScene/charts/renderers/bar/horizontal.ts
|
|
5647
5649
|
function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
5648
5650
|
const { chart, plot } = context;
|
|
5649
|
-
const top =
|
|
5651
|
+
const top = chunkSKGJXCAO_cjs.rowTop(rows, plot, valueIndex) + rows.labelRow;
|
|
5650
5652
|
if (context.stackedMode) {
|
|
5651
|
-
const segment =
|
|
5653
|
+
const segment = chunkSKGJXCAO_cjs.stackedSegment(chart, context.stackedMode, valueIndex, seriesIndex, plot.width);
|
|
5652
5654
|
const start = Math.min(segment.pixelStart, segment.pixelEnd);
|
|
5653
5655
|
return {
|
|
5654
5656
|
x: plot.x + start,
|
|
@@ -5657,27 +5659,27 @@ function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
|
5657
5659
|
height: rows.barsHeight
|
|
5658
5660
|
};
|
|
5659
5661
|
}
|
|
5660
|
-
const barGap = Math.max(0,
|
|
5662
|
+
const barGap = Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.barGap, 2));
|
|
5661
5663
|
const seriesHeight = rows.barsHeight / Math.max(1, chart.series.length);
|
|
5662
|
-
const width = Math.max(0,
|
|
5664
|
+
const width = Math.max(0, chunkSKGJXCAO_cjs.mapChartValue(value, chart.axisY, plot.width));
|
|
5663
5665
|
return { x: plot.x, y: top + seriesIndex * seriesHeight, width, height: Math.max(1, seriesHeight - barGap) };
|
|
5664
5666
|
}
|
|
5665
5667
|
function barPath2(context, frame) {
|
|
5666
5668
|
const { chart, plot } = context;
|
|
5667
5669
|
const config = chart.config;
|
|
5668
|
-
const segments = context.stackedMode && chart.series.length > 1 ? 0 :
|
|
5670
|
+
const segments = context.stackedMode && chart.series.length > 1 ? 0 : chunkSKGJXCAO_cjs.finite(config?.barSegments, 0);
|
|
5669
5671
|
if (segments > 0) {
|
|
5670
|
-
return
|
|
5672
|
+
return chunkSKGJXCAO_cjs.segmentedBarPath(
|
|
5671
5673
|
{ x: plot.x, y: frame.y, width: plot.width, height: frame.height },
|
|
5672
5674
|
"horizontal",
|
|
5673
5675
|
segments,
|
|
5674
|
-
|
|
5676
|
+
chunkSKGJXCAO_cjs.finite(config?.barSegmentGap, 4),
|
|
5675
5677
|
config?.barCornerRadius ?? 2,
|
|
5676
5678
|
frame.width / plot.width,
|
|
5677
5679
|
config?.barSegmentSnap !== false
|
|
5678
5680
|
);
|
|
5679
5681
|
}
|
|
5680
|
-
return
|
|
5682
|
+
return chunkSKGJXCAO_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, config?.barCornerRadius ?? 2);
|
|
5681
5683
|
}
|
|
5682
5684
|
function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
5683
5685
|
const { plot } = context;
|
|
@@ -5697,16 +5699,16 @@ function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
|
5697
5699
|
maxY: frame.y + frame.height
|
|
5698
5700
|
},
|
|
5699
5701
|
path: barPath2(context, frame),
|
|
5700
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5702
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length]
|
|
5701
5703
|
};
|
|
5702
5704
|
}
|
|
5703
5705
|
function barNodes(context, mark) {
|
|
5704
5706
|
const { chart, diagnostics, nextOrder } = context;
|
|
5705
5707
|
const config = chart.config;
|
|
5706
|
-
const stroke =
|
|
5707
|
-
const strokeWidth =
|
|
5708
|
-
const shadow =
|
|
5709
|
-
const fill2 =
|
|
5708
|
+
const stroke = chunkSKGJXCAO_cjs.paint(config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5709
|
+
const strokeWidth = chunkSKGJXCAO_cjs.finite(config?.barBorderWidth, 0);
|
|
5710
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5711
|
+
const fill2 = chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5710
5712
|
const nodes = [...createGlassBackdropNodes(context, mark.id, mark.path)];
|
|
5711
5713
|
if (shadow) {
|
|
5712
5714
|
nodes.push({
|
|
@@ -5730,7 +5732,7 @@ function barNodes(context, mark) {
|
|
|
5730
5732
|
valueIndex: mark.valueIndex,
|
|
5731
5733
|
mark: "bar",
|
|
5732
5734
|
radius: config?.barCornerRadius ?? 2,
|
|
5733
|
-
colorProp:
|
|
5735
|
+
colorProp: chunkSKGJXCAO_cjs.seriesValueColorProp(mark.series.id, mark.valueIndex),
|
|
5734
5736
|
hasColorOverride: mark.series.colors?.[mark.valueIndex] != null
|
|
5735
5737
|
},
|
|
5736
5738
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
@@ -5760,7 +5762,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
5760
5762
|
layers.tracks.push(...createBarTrackNodes(context, mark.id, mark.trackFrame, "horizontal"));
|
|
5761
5763
|
}
|
|
5762
5764
|
layers.bars.push(...barNodes(context, mark));
|
|
5763
|
-
const glow =
|
|
5765
|
+
const glow = chunkSKGJXCAO_cjs.finite(chart.config?.barGlow, 0);
|
|
5764
5766
|
if (glow > 0 && mark.frame.width > 0) {
|
|
5765
5767
|
layers.glows.push(
|
|
5766
5768
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${mark.id}`, mark.path, mark.color, glow, mark.bounds)
|
|
@@ -5769,7 +5771,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
5769
5771
|
layers.labels.push(...labelNodes2(context, mark, highest));
|
|
5770
5772
|
}
|
|
5771
5773
|
function renderHorizontalBars(context) {
|
|
5772
|
-
const rows =
|
|
5774
|
+
const rows = chunkSKGJXCAO_cjs.horizontalRows(context.chart, context.plot);
|
|
5773
5775
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
5774
5776
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
5775
5777
|
const numeric = series.values.map((value) => typeof value === "number" ? value : value[1]);
|
|
@@ -5784,8 +5786,8 @@ function renderHorizontalBars(context) {
|
|
|
5784
5786
|
// src/renderScene/charts/renderers/bar/stacked.ts
|
|
5785
5787
|
function slotOf(context, mode) {
|
|
5786
5788
|
const { chart, plot } = context;
|
|
5787
|
-
const slotWidth = plot.width /
|
|
5788
|
-
const groupGap = Math.min(Math.max(0,
|
|
5789
|
+
const slotWidth = plot.width / chunkSKGJXCAO_cjs.barCategoryCount(chart);
|
|
5790
|
+
const groupGap = Math.min(Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
5789
5791
|
return {
|
|
5790
5792
|
slotWidth,
|
|
5791
5793
|
groupGap,
|
|
@@ -5796,19 +5798,19 @@ function slotOf(context, mode) {
|
|
|
5796
5798
|
}
|
|
5797
5799
|
function pathOf(context, x, y, height, slot, radius) {
|
|
5798
5800
|
const { chart, plot } = context;
|
|
5799
|
-
const segments = chart.series.length === 1 ?
|
|
5801
|
+
const segments = chart.series.length === 1 ? chunkSKGJXCAO_cjs.finite(chart.config?.barSegments, 0) : 0;
|
|
5800
5802
|
if (segments > 0) {
|
|
5801
|
-
return
|
|
5803
|
+
return chunkSKGJXCAO_cjs.segmentedBarPath(
|
|
5802
5804
|
{ x, y: plot.y, width: slot.barWidth, height: plot.height },
|
|
5803
5805
|
"vertical",
|
|
5804
5806
|
segments,
|
|
5805
|
-
|
|
5807
|
+
chunkSKGJXCAO_cjs.finite(chart.config?.barSegmentGap, 4),
|
|
5806
5808
|
radius,
|
|
5807
5809
|
height / plot.height,
|
|
5808
5810
|
chart.config?.barSegmentSnap !== false
|
|
5809
5811
|
);
|
|
5810
5812
|
}
|
|
5811
|
-
return
|
|
5813
|
+
return chunkSKGJXCAO_cjs.barPath(x, y, slot.barWidth, height, radius, chart.config?.barRoundedBottom === true);
|
|
5812
5814
|
}
|
|
5813
5815
|
function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame) {
|
|
5814
5816
|
const { chart } = context;
|
|
@@ -5830,7 +5832,7 @@ function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame
|
|
|
5830
5832
|
}
|
|
5831
5833
|
function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
5832
5834
|
const { chart, plot } = context;
|
|
5833
|
-
const segment =
|
|
5835
|
+
const segment = chunkSKGJXCAO_cjs.stackedSegment(chart, mode, valueIndex, seriesIndex, plot.height);
|
|
5834
5836
|
const radius = slot.outerSeriesIndex === null || seriesIndex === slot.outerSeriesIndex ? slot.cornerRadius : 0;
|
|
5835
5837
|
const x = plot.x + valueIndex * slot.slotWidth + slot.groupGap / 2;
|
|
5836
5838
|
const y = plot.y + plot.height - Math.max(segment.pixelStart, segment.pixelEnd);
|
|
@@ -5839,7 +5841,7 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
5839
5841
|
series,
|
|
5840
5842
|
valueIndex,
|
|
5841
5843
|
radius,
|
|
5842
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5844
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length],
|
|
5843
5845
|
x,
|
|
5844
5846
|
y,
|
|
5845
5847
|
height,
|
|
@@ -5850,10 +5852,10 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
5850
5852
|
function segmentNodes(context, mark) {
|
|
5851
5853
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
5852
5854
|
const { series, valueIndex, path } = mark;
|
|
5853
|
-
const fill2 =
|
|
5854
|
-
const stroke =
|
|
5855
|
-
const strokeWidth =
|
|
5856
|
-
const shadow =
|
|
5855
|
+
const fill2 = chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5856
|
+
const stroke = chunkSKGJXCAO_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5857
|
+
const strokeWidth = chunkSKGJXCAO_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5858
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5857
5859
|
const nodes = [];
|
|
5858
5860
|
if (shadow) {
|
|
5859
5861
|
const plotClip = `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z`;
|
|
@@ -5885,10 +5887,10 @@ function segmentNodes(context, mark) {
|
|
|
5885
5887
|
valueIndex,
|
|
5886
5888
|
mark: "bar",
|
|
5887
5889
|
radius: mark.radius,
|
|
5888
|
-
colorProp:
|
|
5890
|
+
colorProp: chunkSKGJXCAO_cjs.seriesValueColorProp(series.id, valueIndex),
|
|
5889
5891
|
hasColorOverride: series.colors?.[valueIndex] != null
|
|
5890
5892
|
},
|
|
5891
|
-
prop:
|
|
5893
|
+
prop: chunkSKGJXCAO_cjs.seriesValueProp(series.id, valueIndex),
|
|
5892
5894
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
5893
5895
|
});
|
|
5894
5896
|
return nodes;
|
|
@@ -5902,7 +5904,7 @@ function pushSegment(context, mode, layers, slot, series, seriesIndex, valueInde
|
|
|
5902
5904
|
layers.bars.push(...segmentNodes(context, mark));
|
|
5903
5905
|
const frame = { x: mark.x, y: mark.y, width: slot.barWidth, height: mark.height };
|
|
5904
5906
|
pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame);
|
|
5905
|
-
const glow =
|
|
5907
|
+
const glow = chunkSKGJXCAO_cjs.finite(chart.config?.barGlow, 0);
|
|
5906
5908
|
if (glow > 0) {
|
|
5907
5909
|
layers.glows.push(
|
|
5908
5910
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${series.id}-${valueIndex}`, mark.path, mark.color, glow)
|
|
@@ -5913,7 +5915,7 @@ function renderStackedBars(context, mode) {
|
|
|
5913
5915
|
const { chart } = context;
|
|
5914
5916
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
5915
5917
|
const slot = slotOf(context, mode);
|
|
5916
|
-
const valueCount =
|
|
5918
|
+
const valueCount = chunkSKGJXCAO_cjs.barCategoryCount(chart);
|
|
5917
5919
|
for (let valueIndex = 0; valueIndex < valueCount; valueIndex++) {
|
|
5918
5920
|
chart.series.forEach((series, seriesIndex) => {
|
|
5919
5921
|
pushSegment(context, mode, layers, slot, series, seriesIndex, valueIndex);
|
|
@@ -5928,7 +5930,7 @@ function isSeriesMax2(values, index) {
|
|
|
5928
5930
|
|
|
5929
5931
|
// src/renderScene/charts/renderers/bar.ts
|
|
5930
5932
|
function renderBar(context) {
|
|
5931
|
-
if (
|
|
5933
|
+
if (chunkSKGJXCAO_cjs.isHorizontalBar(context.chart)) {
|
|
5932
5934
|
return renderHorizontalBars(context);
|
|
5933
5935
|
}
|
|
5934
5936
|
if (context.stackedMode) {
|
|
@@ -5943,7 +5945,7 @@ function createBoxplotLayout(context) {
|
|
|
5943
5945
|
const orientation = chart.config?.orientation ?? "vertical";
|
|
5944
5946
|
const boxCount = Math.max(1, chart.series.length);
|
|
5945
5947
|
const slotWidth = (orientation === "horizontal" ? plot.height : plot.width) / boxCount;
|
|
5946
|
-
const borderColor =
|
|
5948
|
+
const borderColor = chunkSKGJXCAO_cjs.representativeColor(chart.config?.barBorderColor, "#000000");
|
|
5947
5949
|
const widthFraction = Math.min(1, Math.max(0.05, chart.config?.boxWidth ?? 0.6));
|
|
5948
5950
|
return {
|
|
5949
5951
|
orientation,
|
|
@@ -5952,15 +5954,15 @@ function createBoxplotLayout(context) {
|
|
|
5952
5954
|
cornerRadius: chart.config?.barCornerRadius ?? 2,
|
|
5953
5955
|
showPoints: chart.config?.showBoxplotPoints ?? true,
|
|
5954
5956
|
borderColor,
|
|
5955
|
-
borderWidth:
|
|
5956
|
-
whiskerWidth: Math.max(0,
|
|
5957
|
-
medianWidth: Math.max(0,
|
|
5957
|
+
borderWidth: chunkSKGJXCAO_cjs.finite(chart.config?.barBorderWidth, 1),
|
|
5958
|
+
whiskerWidth: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.boxWhiskerWidth, 1)),
|
|
5959
|
+
medianWidth: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.boxMedianWidth, 2)),
|
|
5958
5960
|
medianColor: chart.config?.boxMedianColor ?? borderColor,
|
|
5959
5961
|
whiskerColor: chart.config?.boxWhiskerColor,
|
|
5960
|
-
capSize: Math.max(0,
|
|
5961
|
-
pointSize: Math.max(0,
|
|
5962
|
-
pointOpacity: Math.min(1, Math.max(0,
|
|
5963
|
-
jitter: Math.max(0,
|
|
5962
|
+
capSize: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.boxCapSize, 0.4)),
|
|
5963
|
+
pointSize: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.boxPointSize, 3)),
|
|
5964
|
+
pointOpacity: Math.min(1, Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.boxPointOpacity, 0.7))),
|
|
5965
|
+
jitter: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.boxJitter, 1))
|
|
5964
5966
|
};
|
|
5965
5967
|
}
|
|
5966
5968
|
|
|
@@ -5971,7 +5973,7 @@ function boxplotPoint(orientation, center, value) {
|
|
|
5971
5973
|
function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
5972
5974
|
const { chart, plot } = context;
|
|
5973
5975
|
const { orientation } = layout;
|
|
5974
|
-
const valueAt = (value) => orientation === "horizontal" ? plot.x +
|
|
5976
|
+
const valueAt = (value) => orientation === "horizontal" ? plot.x + chunkSKGJXCAO_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
5975
5977
|
const center = plot[orientation === "horizontal" ? "y" : "x"] + seriesIndex * layout.slotWidth + layout.slotWidth / 2;
|
|
5976
5978
|
return {
|
|
5977
5979
|
center,
|
|
@@ -5986,7 +5988,7 @@ function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
|
5986
5988
|
// src/renderScene/charts/renderers/boxplot/points.ts
|
|
5987
5989
|
function renderSamplePoints(context, layout, mark) {
|
|
5988
5990
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
5989
|
-
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x +
|
|
5991
|
+
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x + chunkSKGJXCAO_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
5990
5992
|
if (layout.pointSize <= 0) {
|
|
5991
5993
|
return [];
|
|
5992
5994
|
}
|
|
@@ -6002,7 +6004,7 @@ function renderSamplePoints(context, layout, mark) {
|
|
|
6002
6004
|
cy: y,
|
|
6003
6005
|
rx: layout.pointSize,
|
|
6004
6006
|
ry: layout.pointSize,
|
|
6005
|
-
style: { fill:
|
|
6007
|
+
style: { fill: chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id), opacity: layout.pointOpacity }
|
|
6006
6008
|
};
|
|
6007
6009
|
});
|
|
6008
6010
|
}
|
|
@@ -6026,7 +6028,7 @@ function renderBoxAndWhiskers(context, layout, mark) {
|
|
|
6026
6028
|
}
|
|
6027
6029
|
function whiskerColor(layout, mark) {
|
|
6028
6030
|
if (layout.whiskerColor === "series") {
|
|
6029
|
-
return
|
|
6031
|
+
return chunkSKGJXCAO_cjs.representativeColor(mark.color, layout.borderColor);
|
|
6030
6032
|
}
|
|
6031
6033
|
return layout.whiskerColor;
|
|
6032
6034
|
}
|
|
@@ -6108,7 +6110,7 @@ function createBoxNode(context, layout, mark) {
|
|
|
6108
6110
|
height,
|
|
6109
6111
|
rx: layout.cornerRadius,
|
|
6110
6112
|
style: {
|
|
6111
|
-
fill:
|
|
6113
|
+
fill: chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id),
|
|
6112
6114
|
stroke: { kind: "solid", color: layout.borderColor },
|
|
6113
6115
|
strokeWidth: layout.borderWidth
|
|
6114
6116
|
}
|
|
@@ -6117,12 +6119,12 @@ function createBoxNode(context, layout, mark) {
|
|
|
6117
6119
|
|
|
6118
6120
|
// src/renderScene/charts/renderers/boxplot/series.ts
|
|
6119
6121
|
function renderBoxplotSeries(context, layout, series, seriesIndex) {
|
|
6120
|
-
const stats =
|
|
6122
|
+
const stats = chunkSKGJXCAO_cjs.computeBoxplotStats(series.values);
|
|
6121
6123
|
if (!stats) {
|
|
6122
6124
|
return [];
|
|
6123
6125
|
}
|
|
6124
6126
|
const geometry = createBoxplotGeometry(context, layout, seriesIndex, stats);
|
|
6125
|
-
const color = series.color ??
|
|
6127
|
+
const color = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
6126
6128
|
const mark = {
|
|
6127
6129
|
id: `${context.chart.id}-${series.id}`,
|
|
6128
6130
|
series,
|
|
@@ -6184,21 +6186,21 @@ function metricComponent(chart, point) {
|
|
|
6184
6186
|
}
|
|
6185
6187
|
function customPointPosition(context, value) {
|
|
6186
6188
|
return {
|
|
6187
|
-
x: context.plot.x +
|
|
6188
|
-
y: context.plot.y + context.plot.height -
|
|
6189
|
+
x: context.plot.x + chunkSKGJXCAO_cjs.mapChartValue(value[0], context.chart.axisX, context.plot.width),
|
|
6190
|
+
y: context.plot.y + context.plot.height - chunkSKGJXCAO_cjs.mapChartValue(value[1], context.chart.axisY, context.plot.height)
|
|
6189
6191
|
};
|
|
6190
6192
|
}
|
|
6191
6193
|
function customSeriesStyle(context, series, seriesIndex) {
|
|
6192
|
-
const color = series.color ??
|
|
6194
|
+
const color = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
6193
6195
|
return {
|
|
6194
|
-
fill:
|
|
6196
|
+
fill: chunkSKGJXCAO_cjs.paint(color, context.diagnostics, context.chart.id),
|
|
6195
6197
|
stroke: series.stroke ? { kind: "solid", color: series.stroke } : void 0,
|
|
6196
|
-
strokeWidth: series.stroke ?
|
|
6198
|
+
strokeWidth: series.stroke ? chunkSKGJXCAO_cjs.finite(series.strokeWidth, 1) : void 0
|
|
6197
6199
|
};
|
|
6198
6200
|
}
|
|
6199
6201
|
function createCustomSymbolMark(context, mark) {
|
|
6200
6202
|
const symbol = mark.series.symbol;
|
|
6201
|
-
const size =
|
|
6203
|
+
const size = chunkSKGJXCAO_cjs.finite(mark.series.size, 3);
|
|
6202
6204
|
const scale = symbol?.normalized ? size * 2 : 1;
|
|
6203
6205
|
const offset = symbol?.normalized ? 0.5 : 0;
|
|
6204
6206
|
const points = (symbol?.points ?? []).map(([x, y]) => ({
|
|
@@ -6210,12 +6212,12 @@ function createCustomSymbolMark(context, mark) {
|
|
|
6210
6212
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
6211
6213
|
order: context.nextOrder(),
|
|
6212
6214
|
bounds: context.bounds,
|
|
6213
|
-
d:
|
|
6215
|
+
d: chunkSKGJXCAO_cjs.freeformPathData({ points, tension: chunkSKGJXCAO_cjs.finite(symbol?.tension, 0), closed: true }),
|
|
6214
6216
|
style: mark.style
|
|
6215
6217
|
};
|
|
6216
6218
|
}
|
|
6217
6219
|
function createCustomPointMark(context, mark) {
|
|
6218
|
-
const radius =
|
|
6220
|
+
const radius = chunkSKGJXCAO_cjs.finite(mark.series.size, 3);
|
|
6219
6221
|
return {
|
|
6220
6222
|
type: "ellipse",
|
|
6221
6223
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
@@ -6239,7 +6241,7 @@ function renderConnectedPairs(context) {
|
|
|
6239
6241
|
const zones = chart.config?.zones ?? [];
|
|
6240
6242
|
const betterColor = zones[0]?.color ?? "#10b981";
|
|
6241
6243
|
const worseColor = zones[1]?.color ?? "#ec4899";
|
|
6242
|
-
const tieColor = zones[2]?.color ??
|
|
6244
|
+
const tieColor = zones[2]?.color ?? chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL;
|
|
6243
6245
|
const reverse = Boolean(chart.config?.reverseComparison);
|
|
6244
6246
|
const count = Math.min(beforeValues.length, afterValues.length);
|
|
6245
6247
|
const categories = chart.config?.categories ?? [];
|
|
@@ -6254,7 +6256,7 @@ function renderConnectedPairs(context) {
|
|
|
6254
6256
|
const better = reverse ? afterMetric < beforeMetric : afterMetric > beforeMetric;
|
|
6255
6257
|
const worse = reverse ? afterMetric > beforeMetric : afterMetric < beforeMetric;
|
|
6256
6258
|
const comparisonColor = better ? betterColor : worse ? worseColor : tieColor;
|
|
6257
|
-
const radius =
|
|
6259
|
+
const radius = chunkSKGJXCAO_cjs.finite(afterSeries.size, 3);
|
|
6258
6260
|
nodes.push(createConnectorLine(context, index, beforePoint, afterPoint, comparisonColor));
|
|
6259
6261
|
nodes.push(
|
|
6260
6262
|
createCustomPointMark(context, {
|
|
@@ -6262,9 +6264,9 @@ function renderConnectedPairs(context) {
|
|
|
6262
6264
|
valueIndex: index,
|
|
6263
6265
|
point: beforePoint,
|
|
6264
6266
|
style: {
|
|
6265
|
-
fill:
|
|
6267
|
+
fill: chunkSKGJXCAO_cjs.paint(chart.config?.customBeforeFill ?? chart.gridColor ?? "#e2e8f0", context.diagnostics, chart.id),
|
|
6266
6268
|
stroke: { kind: "solid", color: chart.config?.customBeforeStroke ?? HOLLOW_POINT_STROKE },
|
|
6267
|
-
strokeWidth:
|
|
6269
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.config?.customBeforeStrokeWidth, 1.5)
|
|
6268
6270
|
}
|
|
6269
6271
|
})
|
|
6270
6272
|
);
|
|
@@ -6274,7 +6276,7 @@ function renderConnectedPairs(context) {
|
|
|
6274
6276
|
valueIndex: index,
|
|
6275
6277
|
point: afterPoint,
|
|
6276
6278
|
style: {
|
|
6277
|
-
fill:
|
|
6279
|
+
fill: chunkSKGJXCAO_cjs.paint(comparisonColor, context.diagnostics, chart.id),
|
|
6278
6280
|
stroke: void 0,
|
|
6279
6281
|
strokeWidth: void 0
|
|
6280
6282
|
}
|
|
@@ -6301,7 +6303,7 @@ function createConnectorLine(context, index, from, to, color) {
|
|
|
6301
6303
|
style: {
|
|
6302
6304
|
fill: { kind: "none" },
|
|
6303
6305
|
stroke: { kind: "solid", color },
|
|
6304
|
-
strokeWidth:
|
|
6306
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.config?.customConnectorWidth, 2),
|
|
6305
6307
|
opacity: chart.config?.customConnectorOpacity,
|
|
6306
6308
|
dash: connectorDash(chart.config?.customConnectorDash)
|
|
6307
6309
|
}
|
|
@@ -6322,7 +6324,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
6322
6324
|
height: 16
|
|
6323
6325
|
};
|
|
6324
6326
|
return {
|
|
6325
|
-
...
|
|
6327
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
6326
6328
|
id: `chart-custom-label-${chart.id}-${index}`,
|
|
6327
6329
|
order: nextOrder(),
|
|
6328
6330
|
bounds,
|
|
@@ -6331,7 +6333,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
6331
6333
|
chart,
|
|
6332
6334
|
align: horizontal ? "left" : "center"
|
|
6333
6335
|
}),
|
|
6334
|
-
fontSize: Math.max(6,
|
|
6336
|
+
fontSize: Math.max(6, chunkSKGJXCAO_cjs.finite(chart.config?.customLabelSize, Math.max(9, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
6335
6337
|
...chart.config?.customLabelColor ? { color: chart.config.customLabelColor } : {}
|
|
6336
6338
|
};
|
|
6337
6339
|
}
|
|
@@ -6343,8 +6345,8 @@ function classifyFieldData(context) {
|
|
|
6343
6345
|
const vectorSeries = chart.series.filter((series) => tupleSize(series.values[0]) === 4);
|
|
6344
6346
|
const scalarSamples = scalarSeries.flatMap(
|
|
6345
6347
|
(series) => series.values.map(([x, y, value]) => ({
|
|
6346
|
-
x:
|
|
6347
|
-
y: plot.height -
|
|
6348
|
+
x: chunkSKGJXCAO_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
6349
|
+
y: plot.height - chunkSKGJXCAO_cjs.mapChartValue(y, chart.axisY, plot.height),
|
|
6348
6350
|
value
|
|
6349
6351
|
}))
|
|
6350
6352
|
);
|
|
@@ -6408,20 +6410,20 @@ function createLegendLabels(context, minimum, maximum, geometry) {
|
|
|
6408
6410
|
const { chart, bounds, nextOrder } = context;
|
|
6409
6411
|
const y = geometry.y + geometry.height + 3;
|
|
6410
6412
|
return [
|
|
6411
|
-
|
|
6413
|
+
chunkSKGJXCAO_cjs.chartText({
|
|
6412
6414
|
id: `chart-field-colorbar-min-${chart.id}`,
|
|
6413
6415
|
order: nextOrder(),
|
|
6414
6416
|
bounds,
|
|
6415
6417
|
frame: { x: geometry.x, y, width: 80, height: 16 },
|
|
6416
|
-
text:
|
|
6418
|
+
text: chunkSKGJXCAO_cjs.formatFieldValue(minimum),
|
|
6417
6419
|
chart
|
|
6418
6420
|
}),
|
|
6419
|
-
|
|
6421
|
+
chunkSKGJXCAO_cjs.chartText({
|
|
6420
6422
|
id: `chart-field-colorbar-max-${chart.id}`,
|
|
6421
6423
|
order: nextOrder(),
|
|
6422
6424
|
bounds,
|
|
6423
6425
|
frame: { x: geometry.x + geometry.width - 80, y, width: 80, height: 16 },
|
|
6424
|
-
text:
|
|
6426
|
+
text: chunkSKGJXCAO_cjs.formatFieldValue(maximum),
|
|
6425
6427
|
chart,
|
|
6426
6428
|
align: "right"
|
|
6427
6429
|
})
|
|
@@ -6434,7 +6436,7 @@ function colorAtRamp(ramp, value) {
|
|
|
6434
6436
|
if (!ramp?.stops.length) {
|
|
6435
6437
|
return RAMP_FALLBACK_COLOR;
|
|
6436
6438
|
}
|
|
6437
|
-
return
|
|
6439
|
+
return chunkSKGJXCAO_cjs.interpolateHexColorStops(ramp.stops, value);
|
|
6438
6440
|
}
|
|
6439
6441
|
|
|
6440
6442
|
// src/renderScene/charts/field/isolines.ts
|
|
@@ -6644,7 +6646,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
6644
6646
|
}
|
|
6645
6647
|
const chains = stitchIsolineSegments(segments);
|
|
6646
6648
|
const path = chains.map(
|
|
6647
|
-
(chain) =>
|
|
6649
|
+
(chain) => chunkSKGJXCAO_cjs.linePathData(
|
|
6648
6650
|
chain.map(([x, y]) => ({ x: plot.x + x, y: plot.y + y })),
|
|
6649
6651
|
ISOLINE_TENSION
|
|
6650
6652
|
)
|
|
@@ -6668,7 +6670,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
6668
6670
|
function renderVectorField(context, seriesList) {
|
|
6669
6671
|
const nodes = [];
|
|
6670
6672
|
seriesList.forEach((series, seriesIndex) => {
|
|
6671
|
-
const color = series.color ??
|
|
6673
|
+
const color = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
6672
6674
|
series.values.forEach((vector, vectorIndex) => {
|
|
6673
6675
|
nodes.push(createVectorNode(context, series.id, vector, vectorIndex, color));
|
|
6674
6676
|
});
|
|
@@ -6678,10 +6680,10 @@ function renderVectorField(context, seriesList) {
|
|
|
6678
6680
|
function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
6679
6681
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
6680
6682
|
const [x, y, angle, magnitude] = vector;
|
|
6681
|
-
const startX = plot.x +
|
|
6682
|
-
const startY = plot.y + plot.height -
|
|
6683
|
-
const endX = plot.x +
|
|
6684
|
-
const endY = plot.y + plot.height -
|
|
6683
|
+
const startX = plot.x + chunkSKGJXCAO_cjs.mapChartValue(x, chart.axisX, plot.width);
|
|
6684
|
+
const startY = plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(y, chart.axisY, plot.height);
|
|
6685
|
+
const endX = plot.x + chunkSKGJXCAO_cjs.mapChartValue(x + Math.cos(angle) * magnitude, chart.axisX, plot.width);
|
|
6686
|
+
const endY = plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(y + Math.sin(angle) * magnitude, chart.axisY, plot.height);
|
|
6685
6687
|
return {
|
|
6686
6688
|
type: "path",
|
|
6687
6689
|
id: `chart-field-vector-${chart.id}-${seriesId}-${vectorIndex}`,
|
|
@@ -6691,7 +6693,7 @@ function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
|
6691
6693
|
markerEnd: "filled_arrow",
|
|
6692
6694
|
style: {
|
|
6693
6695
|
fill: { kind: "none" },
|
|
6694
|
-
stroke:
|
|
6696
|
+
stroke: chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id),
|
|
6695
6697
|
strokeWidth: 2
|
|
6696
6698
|
}
|
|
6697
6699
|
};
|
|
@@ -6738,7 +6740,7 @@ function createHeatmapCell(layout, series, rowIndex, columnIndex) {
|
|
|
6738
6740
|
};
|
|
6739
6741
|
}
|
|
6740
6742
|
function colorForValue(value, layout) {
|
|
6741
|
-
return
|
|
6743
|
+
return chunkSKGJXCAO_cjs.zoneColorAtValue(value, layout.bands, layout.zones);
|
|
6742
6744
|
}
|
|
6743
6745
|
function renderHeatmapCell(context, layout, cell) {
|
|
6744
6746
|
const background = createCellBackground(context, layout, cell);
|
|
@@ -6753,7 +6755,7 @@ function createCellBackground(context, layout, cell) {
|
|
|
6753
6755
|
const style = {
|
|
6754
6756
|
fill: { kind: "solid", color: cell.color },
|
|
6755
6757
|
stroke: { kind: "solid", color: chart.config?.cellStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
6756
|
-
strokeWidth:
|
|
6758
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.config?.cellStrokeWidth, chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1))
|
|
6757
6759
|
};
|
|
6758
6760
|
if (chart.config?.cellShape === "circle") {
|
|
6759
6761
|
return {
|
|
@@ -6780,9 +6782,9 @@ function createCellBackground(context, layout, cell) {
|
|
|
6780
6782
|
}
|
|
6781
6783
|
function createCellValueLabel(context, layout, cell) {
|
|
6782
6784
|
const { chart, bounds, nextOrder } = context;
|
|
6783
|
-
const size = Math.max(6,
|
|
6785
|
+
const size = Math.max(6, chunkSKGJXCAO_cjs.finite(chart.config?.cellValueSize, layout.fontSize));
|
|
6784
6786
|
return {
|
|
6785
|
-
...
|
|
6787
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
6786
6788
|
id: `chart-heatmap-value-${chart.id}-${cell.seriesId}-${cell.columnIndex}`,
|
|
6787
6789
|
order: nextOrder(),
|
|
6788
6790
|
bounds,
|
|
@@ -6797,7 +6799,7 @@ function createCellValueLabel(context, layout, cell) {
|
|
|
6797
6799
|
align: "center"
|
|
6798
6800
|
}),
|
|
6799
6801
|
...chart.config?.cellValueSize === void 0 ? {} : { fontSize: size },
|
|
6800
|
-
color: chart.config?.cellValueColor ??
|
|
6802
|
+
color: chart.config?.cellValueColor ?? chunkSKGJXCAO_cjs.contrastTextColor(cell.color)
|
|
6801
6803
|
};
|
|
6802
6804
|
}
|
|
6803
6805
|
|
|
@@ -6810,9 +6812,9 @@ function createHeatmapLayout(context) {
|
|
|
6810
6812
|
return {
|
|
6811
6813
|
rows: chart.series,
|
|
6812
6814
|
columns,
|
|
6813
|
-
bands:
|
|
6814
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
6815
|
-
fontSize: Math.max(9,
|
|
6815
|
+
bands: chunkSKGJXCAO_cjs.axisBands(chart.axisY),
|
|
6816
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkSKGJXCAO_cjs.DEFAULT_HEATMAP_ZONES,
|
|
6817
|
+
fontSize: Math.max(9, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12)),
|
|
6816
6818
|
headerFontSize: headerFontSize(chart),
|
|
6817
6819
|
legendGap: legendGap(chart),
|
|
6818
6820
|
sides,
|
|
@@ -6820,10 +6822,10 @@ function createHeatmapLayout(context) {
|
|
|
6820
6822
|
grid: createHeatmapGrid(context, reservedSpace, sides, columns.length)
|
|
6821
6823
|
};
|
|
6822
6824
|
}
|
|
6823
|
-
var headerFontSize = (chart) => Math.max(9,
|
|
6824
|
-
var rowGap = (chart) => Math.min(120, Math.max(0,
|
|
6825
|
-
var columnGap = (chart) => Math.min(120, Math.max(0,
|
|
6826
|
-
var legendGap = (chart) => Math.min(80, Math.max(0,
|
|
6825
|
+
var headerFontSize = (chart) => Math.max(9, chunkSKGJXCAO_cjs.finite(chart.axisFontSize ?? chart.fontSize, 12));
|
|
6826
|
+
var rowGap = (chart) => Math.min(120, Math.max(0, chunkSKGJXCAO_cjs.finite(chart.yLabelGap, 6)));
|
|
6827
|
+
var columnGap = (chart) => Math.min(120, Math.max(0, chunkSKGJXCAO_cjs.finite(chart.xLabelGap, 4)));
|
|
6828
|
+
var legendGap = (chart) => Math.min(80, Math.max(0, chunkSKGJXCAO_cjs.finite(chart.legendGap, 6)));
|
|
6827
6829
|
function heatmapSides(context) {
|
|
6828
6830
|
const { chart } = context;
|
|
6829
6831
|
return {
|
|
@@ -6842,7 +6844,7 @@ function heatmapReservedSpace(context, sides) {
|
|
|
6842
6844
|
const { chart } = context;
|
|
6843
6845
|
const fontSize = headerFontSize(chart);
|
|
6844
6846
|
const longestLabel = chart.series.reduce(
|
|
6845
|
-
(max, series) => Math.max(max,
|
|
6847
|
+
(max, series) => Math.max(max, chunkSKGJXCAO_cjs.estimateTextWidth(series.label ?? "", fontSize, false)),
|
|
6846
6848
|
0
|
|
6847
6849
|
);
|
|
6848
6850
|
const vertical = sides.legend === "left" || sides.legend === "right";
|
|
@@ -6858,8 +6860,8 @@ function heatmapReservedSpace(context, sides) {
|
|
|
6858
6860
|
}
|
|
6859
6861
|
function columnHeaderRoom(context) {
|
|
6860
6862
|
const { chart } = context;
|
|
6861
|
-
const tilt =
|
|
6862
|
-
return tilt > 0 ? Math.min(context.plot.height * 0.4,
|
|
6863
|
+
const tilt = chunkSKGJXCAO_cjs.labelTilt(chart);
|
|
6864
|
+
return tilt > 0 ? Math.min(context.plot.height * 0.4, chunkSKGJXCAO_cjs.tiltedLabelRoom(chart, heatmapColumns(context), tilt) + columnGap(chart) + 4) : headerFontSize(chart) + 2 + columnGap(chart) + 6;
|
|
6863
6865
|
}
|
|
6864
6866
|
function createHeatmapGrid(context, reservedSpace, sides, columnCount) {
|
|
6865
6867
|
const { chart } = context;
|
|
@@ -6870,7 +6872,7 @@ function createHeatmapGrid(context, reservedSpace, sides, columnCount) {
|
|
|
6870
6872
|
const width = Math.max(1, context.plot.width - left - right);
|
|
6871
6873
|
const height = Math.max(1, context.plot.height - top - bottom);
|
|
6872
6874
|
const rowCount = chart.series.length;
|
|
6873
|
-
const cellGap = Math.max(0,
|
|
6875
|
+
const cellGap = Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.cellGap, 0));
|
|
6874
6876
|
let cellWidth = columnCount ? width / columnCount : width;
|
|
6875
6877
|
let cellHeight = rowCount ? height / rowCount : height;
|
|
6876
6878
|
let gridWidth = width;
|
|
@@ -6890,7 +6892,7 @@ function createHeatmapGrid(context, reservedSpace, sides, columnCount) {
|
|
|
6890
6892
|
cellWidth,
|
|
6891
6893
|
cellHeight,
|
|
6892
6894
|
cellGap,
|
|
6893
|
-
cellRadius: Math.max(0,
|
|
6895
|
+
cellRadius: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.barCornerRadius, cellGap))
|
|
6894
6896
|
};
|
|
6895
6897
|
}
|
|
6896
6898
|
|
|
@@ -6909,7 +6911,7 @@ function createRowHeader(context, layout, series, rowIndex) {
|
|
|
6909
6911
|
const room = layout.reservedSpace.rowHeaders;
|
|
6910
6912
|
const gap = rowGap(chart);
|
|
6911
6913
|
const x = layout.sides.rows === "left" ? layout.grid.x - room : layout.grid.x + layout.grid.width + gap;
|
|
6912
|
-
return
|
|
6914
|
+
return chunkSKGJXCAO_cjs.chartText({
|
|
6913
6915
|
id: `chart-heatmap-row-${chart.id}-${series.id}`,
|
|
6914
6916
|
order: nextOrder(),
|
|
6915
6917
|
bounds,
|
|
@@ -6935,12 +6937,12 @@ function createColumnHeader(context, layout, label, columnIndex) {
|
|
|
6935
6937
|
const { chart, bounds, nextOrder } = context;
|
|
6936
6938
|
const above = layout.sides.columns === "top";
|
|
6937
6939
|
const centerX = layout.grid.x + (columnIndex + 0.5) * layout.grid.cellWidth;
|
|
6938
|
-
const tilt =
|
|
6940
|
+
const tilt = chunkSKGJXCAO_cjs.labelTilt(chart);
|
|
6939
6941
|
const gap = columnGap(chart);
|
|
6940
6942
|
const id = `chart-heatmap-col-${chart.id}-${columnIndex}`;
|
|
6941
6943
|
if (tilt > 0) {
|
|
6942
|
-
const { frame, rotation } = above ?
|
|
6943
|
-
return
|
|
6944
|
+
const { frame, rotation } = above ? chunkSKGJXCAO_cjs.labelAboveFrame(chart, label, tilt, { x: centerX, y: layout.grid.y - gap }) : chunkSKGJXCAO_cjs.labelBelowFrame(chart, label, tilt, { x: centerX, y: layout.grid.y + layout.grid.height + gap });
|
|
6945
|
+
return chunkSKGJXCAO_cjs.chartText({
|
|
6944
6946
|
id,
|
|
6945
6947
|
order: nextOrder(),
|
|
6946
6948
|
bounds,
|
|
@@ -6952,7 +6954,7 @@ function createColumnHeader(context, layout, label, columnIndex) {
|
|
|
6952
6954
|
role: "axis"
|
|
6953
6955
|
});
|
|
6954
6956
|
}
|
|
6955
|
-
return
|
|
6957
|
+
return chunkSKGJXCAO_cjs.chartText({
|
|
6956
6958
|
id,
|
|
6957
6959
|
order: nextOrder(),
|
|
6958
6960
|
bounds,
|
|
@@ -7030,7 +7032,7 @@ function renderHeatmapLegend(context, layout) {
|
|
|
7030
7032
|
return [];
|
|
7031
7033
|
}
|
|
7032
7034
|
const place = barPlace(layout);
|
|
7033
|
-
const barBounds =
|
|
7035
|
+
const barBounds = chunkSKGJXCAO_cjs.boxBounds({ x: place.x, y: place.y, width: place.width, height: place.height });
|
|
7034
7036
|
return [createGradientBar(context, layout, place, barBounds), ...createBoundaryTicks(context, layout, place)];
|
|
7035
7037
|
}
|
|
7036
7038
|
function bandRatio(layout, value) {
|
|
@@ -7044,7 +7046,7 @@ function createGradientBar(context, layout, place, barBounds) {
|
|
|
7044
7046
|
const zones = layout.zones.slice(0, bandCount);
|
|
7045
7047
|
const stops = zones.map((zone, index) => ({
|
|
7046
7048
|
offset: bandRatio(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
7047
|
-
color: zone.color ??
|
|
7049
|
+
color: zone.color ?? chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL
|
|
7048
7050
|
}));
|
|
7049
7051
|
return {
|
|
7050
7052
|
type: "rect",
|
|
@@ -7059,7 +7061,7 @@ function createGradientBar(context, layout, place, barBounds) {
|
|
|
7059
7061
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
7060
7062
|
style: {
|
|
7061
7063
|
// Across the grid it runs from the lowest value on the left; beside it from the lowest at the bottom.
|
|
7062
|
-
fill: stops.length ? { kind: "linear-gradient", angle: place.vertical ? 270 : 0, stops } : { kind: "solid", color:
|
|
7064
|
+
fill: stops.length ? { kind: "linear-gradient", angle: place.vertical ? 270 : 0, stops } : { kind: "solid", color: chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL },
|
|
7063
7065
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
7064
7066
|
strokeWidth: 1
|
|
7065
7067
|
}
|
|
@@ -7085,12 +7087,12 @@ function createBoundaryTicks(context, layout, place) {
|
|
|
7085
7087
|
strokeWidth: 1
|
|
7086
7088
|
}
|
|
7087
7089
|
};
|
|
7088
|
-
const label =
|
|
7090
|
+
const label = chunkSKGJXCAO_cjs.chartText({
|
|
7089
7091
|
id: `chart-heatmap-legend-tick-label-${chart.id}-${index}`,
|
|
7090
7092
|
order: nextOrder(),
|
|
7091
7093
|
bounds,
|
|
7092
7094
|
...labelAt(place, at, index === 0, index === lastIndex, labelHeight),
|
|
7093
|
-
text:
|
|
7095
|
+
text: chunkSKGJXCAO_cjs.formatFieldValue(value),
|
|
7094
7096
|
chart
|
|
7095
7097
|
});
|
|
7096
7098
|
return [tick, label];
|
|
@@ -7457,22 +7459,22 @@ function renderHexbin(context) {
|
|
|
7457
7459
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
7458
7460
|
const nodes = [];
|
|
7459
7461
|
const config = chart.config;
|
|
7460
|
-
const hexRadius = Math.max(1, config?.hexRadius ??
|
|
7462
|
+
const hexRadius = Math.max(1, config?.hexRadius ?? chunkSKGJXCAO_cjs.DEFAULT_HEX_RADIUS);
|
|
7461
7463
|
const drawRadius = Math.max(0.5, hexRadius - Math.max(0, config?.hexGap ?? 0) * GAP_TO_RADIUS);
|
|
7462
7464
|
const strokeWidth = config?.hexStrokeWidth ?? 0;
|
|
7463
7465
|
const minOpacity = Math.min(1, Math.max(0, config?.hexMinOpacity ?? DEFAULT_MIN_OPACITY));
|
|
7464
|
-
const shadow =
|
|
7466
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7465
7467
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
7466
7468
|
chart.series.forEach((series, seriesIndex) => {
|
|
7467
7469
|
const explicit = series.values.length > 0 && Array.isArray(series.values[0]);
|
|
7468
7470
|
const pairs = explicit ? series.values : series.values.map((y, i) => [chart.axisX.min + i * chart.axisX.step, y]);
|
|
7469
7471
|
const pixelPoints2 = pairs.map(([vx, vy]) => ({
|
|
7470
|
-
x:
|
|
7471
|
-
y: plot.height -
|
|
7472
|
+
x: chunkSKGJXCAO_cjs.mapChartValue(vx, chart.axisX, plot.width),
|
|
7473
|
+
y: plot.height - chunkSKGJXCAO_cjs.mapChartValue(vy, chart.axisY, plot.height)
|
|
7472
7474
|
}));
|
|
7473
7475
|
const bins = computeHexBins(pixelPoints2, hexRadius);
|
|
7474
7476
|
const maxCount = Math.max(1, ...bins.map((bin) => bin.count));
|
|
7475
|
-
const color = series.color ??
|
|
7477
|
+
const color = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
7476
7478
|
const ramp = config?.scale;
|
|
7477
7479
|
bins.forEach((bin, i) => {
|
|
7478
7480
|
const share = bin.count / maxCount;
|
|
@@ -7484,8 +7486,8 @@ function renderHexbin(context) {
|
|
|
7484
7486
|
bounds,
|
|
7485
7487
|
d: hexPath(plot.x + bin.cx, plot.y + bin.cy, drawRadius),
|
|
7486
7488
|
style: {
|
|
7487
|
-
fill:
|
|
7488
|
-
stroke: strokeWidth > 0 ?
|
|
7489
|
+
fill: chunkSKGJXCAO_cjs.paint(fill2, diagnostics, chart.id),
|
|
7490
|
+
stroke: strokeWidth > 0 ? chunkSKGJXCAO_cjs.paint(config?.hexStrokeColor ?? fill2, diagnostics, chart.id) : void 0,
|
|
7489
7491
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
7490
7492
|
opacity: ramp ? void 0 : Math.max(minOpacity, share),
|
|
7491
7493
|
shadow,
|
|
@@ -7507,8 +7509,8 @@ function seriesValuePairs(chart, series) {
|
|
|
7507
7509
|
function pixelPoints(context, pairs) {
|
|
7508
7510
|
const { chart, plot } = context;
|
|
7509
7511
|
return pairs.map(([x, y]) => ({
|
|
7510
|
-
x: plot.x +
|
|
7511
|
-
y: plot.y + plot.height -
|
|
7512
|
+
x: plot.x + chunkSKGJXCAO_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
7513
|
+
y: plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(y, chart.axisY, plot.height)
|
|
7512
7514
|
}));
|
|
7513
7515
|
}
|
|
7514
7516
|
|
|
@@ -7518,7 +7520,7 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
7518
7520
|
const baselineY = plot.y + plot.height;
|
|
7519
7521
|
const first = points[0];
|
|
7520
7522
|
const last = points[points.length - 1];
|
|
7521
|
-
const d = `${
|
|
7523
|
+
const d = `${chunkSKGJXCAO_cjs.linePathData(points, tension)} L ${last.x} ${baselineY} L ${first.x} ${baselineY} Z`;
|
|
7522
7524
|
const top = Math.min(...points.map((point) => point.y));
|
|
7523
7525
|
const centerX = (Math.min(...points.map((point) => point.x)) + Math.max(...points.map((point) => point.x))) / 2;
|
|
7524
7526
|
const halfHeight = (baselineY - top) / 2;
|
|
@@ -7540,8 +7542,8 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
7540
7542
|
kind: "linear-gradient",
|
|
7541
7543
|
angle: 90,
|
|
7542
7544
|
stops: [
|
|
7543
|
-
{ offset: 0, color:
|
|
7544
|
-
{ offset: 100, color:
|
|
7545
|
+
{ offset: 0, color: chunkSKGJXCAO_cjs.colorWithAlpha(color, areaOpacity) },
|
|
7546
|
+
{ offset: 100, color: chunkSKGJXCAO_cjs.colorWithAlpha(color, 0) }
|
|
7545
7547
|
]
|
|
7546
7548
|
},
|
|
7547
7549
|
stroke: { kind: "none" },
|
|
@@ -7564,7 +7566,7 @@ function guideNode(context, mark) {
|
|
|
7564
7566
|
d: `M ${mark.point.x} ${mark.point.y} V ${plot.y + plot.height}`,
|
|
7565
7567
|
style: {
|
|
7566
7568
|
fill: { kind: "none" },
|
|
7567
|
-
stroke:
|
|
7569
|
+
stroke: chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id),
|
|
7568
7570
|
strokeWidth: 1,
|
|
7569
7571
|
dash: [3, 4],
|
|
7570
7572
|
opacity: 0.55,
|
|
@@ -7585,7 +7587,7 @@ function dotNode(context, mark) {
|
|
|
7585
7587
|
rx: mark.radius,
|
|
7586
7588
|
ry: mark.radius,
|
|
7587
7589
|
style: {
|
|
7588
|
-
fill:
|
|
7590
|
+
fill: chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id),
|
|
7589
7591
|
shadow: glow ? { color: mark.color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : void 0,
|
|
7590
7592
|
pointerEvents: "none"
|
|
7591
7593
|
}
|
|
@@ -7598,7 +7600,7 @@ function labelNode3(context, mark, value) {
|
|
|
7598
7600
|
const text = formatHighlight(config?.highlightLabelFormat, config?.categories?.[mark.index] ?? "", value);
|
|
7599
7601
|
const width = Math.max(48, text.length * fontSize * 0.62);
|
|
7600
7602
|
return {
|
|
7601
|
-
...
|
|
7603
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
7602
7604
|
id: `chart-highlight-label-${mark.key}`,
|
|
7603
7605
|
order: nextOrder(),
|
|
7604
7606
|
bounds,
|
|
@@ -7678,15 +7680,15 @@ function createLineError(context, mark) {
|
|
|
7678
7680
|
return null;
|
|
7679
7681
|
}
|
|
7680
7682
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7681
|
-
const [lower, upper] =
|
|
7682
|
-
return
|
|
7683
|
+
const [lower, upper] = chunkSKGJXCAO_cjs.errorBarRange(mark.value, mark.error);
|
|
7684
|
+
return chunkSKGJXCAO_cjs.createVerticalErrorWhiskerNode({
|
|
7683
7685
|
id: `chart-line-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
7684
7686
|
order: nextOrder(),
|
|
7685
7687
|
bounds,
|
|
7686
7688
|
geometry: {
|
|
7687
7689
|
centerX: mark.position.x,
|
|
7688
|
-
startY: plot.y + plot.height -
|
|
7689
|
-
endY: plot.y + plot.height -
|
|
7690
|
+
startY: plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
7691
|
+
endY: plot.y + plot.height - chunkSKGJXCAO_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
7690
7692
|
},
|
|
7691
7693
|
color: mark.color,
|
|
7692
7694
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -7710,8 +7712,8 @@ function createLinePoint(context, mark) {
|
|
|
7710
7712
|
ry: visible ? radius : 6,
|
|
7711
7713
|
detail: { of: "chartValue", series: mark.seriesId, valueIndex: mark.valueIndex },
|
|
7712
7714
|
style: {
|
|
7713
|
-
fill: visible ?
|
|
7714
|
-
stroke: visible && strokeWidth > 0 ?
|
|
7715
|
+
fill: visible ? chunkSKGJXCAO_cjs.paint(fill2, diagnostics, chart.id) : { kind: "none" },
|
|
7716
|
+
stroke: visible && strokeWidth > 0 ? chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id) : void 0,
|
|
7715
7717
|
strokeWidth: visible && strokeWidth > 0 ? strokeWidth : void 0,
|
|
7716
7718
|
pointerEvents: visible ? void 0 : "all"
|
|
7717
7719
|
}
|
|
@@ -7731,22 +7733,22 @@ function createLinePath(context, series, points, color, tension) {
|
|
|
7731
7733
|
order: nextOrder(),
|
|
7732
7734
|
bounds: gradient ? { minX: plot.x, maxX: plot.x + plot.width, minY: plot.y, maxY: plot.y + plot.height } : bounds,
|
|
7733
7735
|
detail: { of: "chartSeries", series: series.id, lineTension: tension || void 0 },
|
|
7734
|
-
d:
|
|
7736
|
+
d: chunkSKGJXCAO_cjs.linePathData(points, tension),
|
|
7735
7737
|
style: {
|
|
7736
7738
|
fill: { kind: "none" },
|
|
7737
|
-
stroke:
|
|
7739
|
+
stroke: chunkSKGJXCAO_cjs.paint(gradient ?? color, diagnostics, chart.id),
|
|
7738
7740
|
strokeWidth: series.strokeWidth ?? config?.lineWidth ?? 2,
|
|
7739
7741
|
dash: series.dash,
|
|
7740
7742
|
lineCap: config?.lineWidth === void 0 ? void 0 : "round",
|
|
7741
7743
|
lineJoin: "round",
|
|
7742
|
-
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } :
|
|
7744
|
+
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle)
|
|
7743
7745
|
}
|
|
7744
7746
|
};
|
|
7745
7747
|
}
|
|
7746
7748
|
|
|
7747
7749
|
// src/renderScene/charts/renderers/line/series.ts
|
|
7748
7750
|
function seriesColor(series, seriesIndex) {
|
|
7749
|
-
return
|
|
7751
|
+
return chunkSKGJXCAO_cjs.representativeColor(series.color, chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length]);
|
|
7750
7752
|
}
|
|
7751
7753
|
function renderLineSeriesArea(context, series, seriesIndex) {
|
|
7752
7754
|
const areaOpacity = context.chart.config?.areaOpacity;
|
|
@@ -7810,7 +7812,7 @@ function renderGridLines(context, layout) {
|
|
|
7810
7812
|
style: {
|
|
7811
7813
|
fill: { kind: "none" },
|
|
7812
7814
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
7813
|
-
strokeWidth:
|
|
7815
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1)
|
|
7814
7816
|
}
|
|
7815
7817
|
};
|
|
7816
7818
|
});
|
|
@@ -7818,7 +7820,7 @@ function renderGridLines(context, layout) {
|
|
|
7818
7820
|
function renderPercentageLabels(context, layout) {
|
|
7819
7821
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7820
7822
|
return PERCENT_TICKS.map((percent) => ({
|
|
7821
|
-
...
|
|
7823
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
7822
7824
|
id: `chart-mekko-pct-${chart.id}-${percent}`,
|
|
7823
7825
|
order: nextOrder(),
|
|
7824
7826
|
bounds,
|
|
@@ -7850,7 +7852,7 @@ function renderMekkoColumnLabels(context, layout, columnIndex, column) {
|
|
|
7850
7852
|
function createTotalLabel(context, layout, columnIndex, column) {
|
|
7851
7853
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7852
7854
|
return {
|
|
7853
|
-
...
|
|
7855
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
7854
7856
|
id: `chart-mekko-total-${chart.id}-${columnIndex}`,
|
|
7855
7857
|
order: nextOrder(),
|
|
7856
7858
|
bounds,
|
|
@@ -7871,7 +7873,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
7871
7873
|
const { chart, bounds, nextOrder } = context;
|
|
7872
7874
|
const { label, width } = column;
|
|
7873
7875
|
return {
|
|
7874
|
-
...
|
|
7876
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
7875
7877
|
id: `chart-mekko-col-label-${chart.id}-${columnIndex}`,
|
|
7876
7878
|
order: nextOrder(),
|
|
7877
7879
|
bounds,
|
|
@@ -7885,7 +7887,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
7885
7887
|
chart,
|
|
7886
7888
|
align: "center"
|
|
7887
7889
|
}),
|
|
7888
|
-
lines:
|
|
7890
|
+
lines: chunkSKGJXCAO_cjs.wrapText(label, width, layout.smallFontSize),
|
|
7889
7891
|
fontSize: layout.smallFontSize
|
|
7890
7892
|
};
|
|
7891
7893
|
}
|
|
@@ -7895,8 +7897,8 @@ function createMekkoLayout(context) {
|
|
|
7895
7897
|
const labels = mekkoColumnLabels(context);
|
|
7896
7898
|
const labelGutterWidth = context.showLabels ? 30 : 0;
|
|
7897
7899
|
const grid = createMekkoGrid(context, labelGutterWidth);
|
|
7898
|
-
const fontSize = Math.max(9,
|
|
7899
|
-
const columnGap2 = Math.max(0,
|
|
7900
|
+
const fontSize = Math.max(9, chunkSKGJXCAO_cjs.finite(context.chart.fontSize, 12));
|
|
7901
|
+
const columnGap2 = Math.max(0, chunkSKGJXCAO_cjs.finite(context.chart.config?.mekkoColumnGap, 4));
|
|
7900
7902
|
const smallFontSize = Math.max(8, fontSize - 1);
|
|
7901
7903
|
return {
|
|
7902
7904
|
columns: createMekkoColumns(context, grid, labels, columnGap2),
|
|
@@ -7904,8 +7906,8 @@ function createMekkoLayout(context) {
|
|
|
7904
7906
|
smallFontSize,
|
|
7905
7907
|
labelGutterWidth,
|
|
7906
7908
|
columnGap: columnGap2,
|
|
7907
|
-
labelSize: Math.max(6,
|
|
7908
|
-
valueSize: Math.max(6,
|
|
7909
|
+
labelSize: Math.max(6, chunkSKGJXCAO_cjs.finite(context.chart.config?.mekkoLabelSize, smallFontSize)),
|
|
7910
|
+
valueSize: Math.max(6, chunkSKGJXCAO_cjs.finite(context.chart.config?.mekkoValueSize, smallFontSize)),
|
|
7909
7911
|
grid
|
|
7910
7912
|
};
|
|
7911
7913
|
}
|
|
@@ -7962,12 +7964,12 @@ function createColumnBackdrop(context, layout, columnIndex) {
|
|
|
7962
7964
|
id: `chart-mekko-column-backdrop-${chart.id}-${columnIndex}`,
|
|
7963
7965
|
order: nextOrder(),
|
|
7964
7966
|
bounds,
|
|
7965
|
-
d:
|
|
7966
|
-
style: { fill:
|
|
7967
|
+
d: chunkSKGJXCAO_cjs.barShapePath(column.x, layout.grid.y, column.width, layout.grid.height, cornerRadius),
|
|
7968
|
+
style: { fill: chunkSKGJXCAO_cjs.paint(chart.gridColor ?? "#e2e8f0", diagnostics, chart.id), opacity: BACKDROP_OPACITY }
|
|
7967
7969
|
};
|
|
7968
7970
|
}
|
|
7969
7971
|
function mekkoCornerRadius(context) {
|
|
7970
|
-
return Math.max(0,
|
|
7972
|
+
return Math.max(0, chunkSKGJXCAO_cjs.finite(context.chart.config?.barCornerRadius, 2));
|
|
7971
7973
|
}
|
|
7972
7974
|
function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
7973
7975
|
const segments = [];
|
|
@@ -7978,7 +7980,7 @@ function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
|
7978
7980
|
const height = (column.total > 0 ? value / column.total : 0) * column.height;
|
|
7979
7981
|
const y = column.y + cumulativeHeight;
|
|
7980
7982
|
cumulativeHeight += height;
|
|
7981
|
-
const color = series.color ??
|
|
7983
|
+
const color = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
7982
7984
|
segments.push({
|
|
7983
7985
|
columnIndex,
|
|
7984
7986
|
seriesId: series.id,
|
|
@@ -8001,12 +8003,12 @@ function renderSegment(context, layout, segment, nextColor) {
|
|
|
8001
8003
|
}
|
|
8002
8004
|
function createSegmentNode(context, segment, nextColor) {
|
|
8003
8005
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
8004
|
-
const shadow =
|
|
8006
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8005
8007
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
8006
8008
|
const config = chart.config;
|
|
8007
8009
|
const radius = segment.isTop || config?.mekkoRoundAll ? mekkoCornerRadius(context) : 0;
|
|
8008
8010
|
const { x, y, width, height } = segment.frame;
|
|
8009
|
-
const segmentGap = Math.max(0,
|
|
8011
|
+
const segmentGap = Math.max(0, chunkSKGJXCAO_cjs.finite(config?.mekkoSegmentGap, 0));
|
|
8010
8012
|
const fallback = "#94a3b8";
|
|
8011
8013
|
const gradientBounds = {
|
|
8012
8014
|
minX: x + width / 2 - height / 2,
|
|
@@ -8018,20 +8020,20 @@ function createSegmentNode(context, segment, nextColor) {
|
|
|
8018
8020
|
kind: "linear-gradient",
|
|
8019
8021
|
angle: 90,
|
|
8020
8022
|
stops: [
|
|
8021
|
-
{ offset: 0, color:
|
|
8022
|
-
{ offset: 100, color:
|
|
8023
|
+
{ offset: 0, color: chunkSKGJXCAO_cjs.representativeColor(segment.color, fallback) },
|
|
8024
|
+
{ offset: 100, color: chunkSKGJXCAO_cjs.representativeColor(nextColor, fallback) }
|
|
8023
8025
|
]
|
|
8024
|
-
} :
|
|
8026
|
+
} : chunkSKGJXCAO_cjs.paint(segment.color, diagnostics, chart.id);
|
|
8025
8027
|
return {
|
|
8026
8028
|
type: "path",
|
|
8027
8029
|
id: `chart-mekko-seg-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
8028
8030
|
order: nextOrder(),
|
|
8029
8031
|
bounds: nextColor ? gradientBounds : bounds,
|
|
8030
|
-
d:
|
|
8032
|
+
d: chunkSKGJXCAO_cjs.barPath(x, y + segmentGap / 2, width, Math.max(0, height - segmentGap), radius, Boolean(config?.mekkoRoundAll)),
|
|
8031
8033
|
style: {
|
|
8032
8034
|
fill: fill2,
|
|
8033
8035
|
stroke: { kind: "solid", color: config?.mekkoSegmentStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
8034
|
-
strokeWidth:
|
|
8036
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(config?.mekkoSegmentStrokeWidth, chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1)),
|
|
8035
8037
|
shadow,
|
|
8036
8038
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
8037
8039
|
}
|
|
@@ -8047,17 +8049,17 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
8047
8049
|
const innerHeight = Math.max(1, height - 6);
|
|
8048
8050
|
const lineHeight = layout.labelSize * 1.2;
|
|
8049
8051
|
const valueHeight = layout.valueSize * 1.2;
|
|
8050
|
-
const labelLines =
|
|
8051
|
-
(line) =>
|
|
8052
|
+
const labelLines = chunkSKGJXCAO_cjs.wrapText(segment.seriesLabel, innerWidth, layout.labelSize).map(
|
|
8053
|
+
(line) => chunkSKGJXCAO_cjs.ellipsizeToWidth(line, innerWidth, layout.labelSize, true)
|
|
8052
8054
|
);
|
|
8053
8055
|
if (labelLines.length * lineHeight + valueHeight > innerHeight) {
|
|
8054
8056
|
return [];
|
|
8055
8057
|
}
|
|
8056
|
-
const textColor = chart.config?.mekkoTextColor ??
|
|
8058
|
+
const textColor = chart.config?.mekkoTextColor ?? chunkSKGJXCAO_cjs.contrastTextColor(chunkSKGJXCAO_cjs.representativeColor(segment.color, "#ffffff"));
|
|
8057
8059
|
const columnTotal = layout.columns[segment.columnIndex]?.total ?? 0;
|
|
8058
8060
|
const valueText = chart.config?.mekkoValueFormat === "percent" ? `${columnTotal > 0 ? Math.round(segment.value / columnTotal * 100) : 0}%` : String(segment.value);
|
|
8059
8061
|
const label = {
|
|
8060
|
-
...
|
|
8062
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
8061
8063
|
id: `chart-mekko-seg-label-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
8062
8064
|
order: nextOrder(),
|
|
8063
8065
|
bounds,
|
|
@@ -8071,7 +8073,7 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
8071
8073
|
color: textColor
|
|
8072
8074
|
};
|
|
8073
8075
|
const valueNode = {
|
|
8074
|
-
...
|
|
8076
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
8075
8077
|
id: `chart-mekko-seg-value-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
8076
8078
|
order: nextOrder(),
|
|
8077
8079
|
bounds,
|
|
@@ -8104,7 +8106,7 @@ function renderMekko(context) {
|
|
|
8104
8106
|
|
|
8105
8107
|
// src/renderScene/charts/renderers/pie/center.ts
|
|
8106
8108
|
function fill(template, chart) {
|
|
8107
|
-
const values = chart.series.map((series) => Math.max(0,
|
|
8109
|
+
const values = chart.series.map((series) => Math.max(0, chunkSKGJXCAO_cjs.finite(series.values[0], 0)));
|
|
8108
8110
|
const total = values.reduce((sum, value) => sum + value, 0);
|
|
8109
8111
|
const first = values[0] ?? 0;
|
|
8110
8112
|
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 ?? "");
|
|
@@ -8116,7 +8118,7 @@ function renderPieCenter(context, geometry) {
|
|
|
8116
8118
|
return [];
|
|
8117
8119
|
}
|
|
8118
8120
|
const lines = fill(template, chart).split(/\\n|\n/);
|
|
8119
|
-
const fontSize =
|
|
8121
|
+
const fontSize = chunkSKGJXCAO_cjs.finite(chart.config?.pieCenterSize, Math.max(14, Math.min(40, geometry.outerRadius * 0.3)));
|
|
8120
8122
|
const lineHeight = fontSize * 1.2;
|
|
8121
8123
|
const width = Math.max(40, (geometry.innerRadius > 0 ? geometry.innerRadius : geometry.outerRadius * 0.6) * 2);
|
|
8122
8124
|
const text = {
|
|
@@ -8129,7 +8131,7 @@ function renderPieCenter(context, geometry) {
|
|
|
8129
8131
|
width,
|
|
8130
8132
|
height: lineHeight * lines.length,
|
|
8131
8133
|
lines,
|
|
8132
|
-
fontFamily: chart.fontFamily ??
|
|
8134
|
+
fontFamily: chart.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
8133
8135
|
fontSize,
|
|
8134
8136
|
fontWeight: "bold",
|
|
8135
8137
|
align: "center",
|
|
@@ -8149,14 +8151,14 @@ var radians = (degrees) => degrees * Math.PI / 180;
|
|
|
8149
8151
|
function renderPieSlices(context, geometry) {
|
|
8150
8152
|
const config = context.chart.config;
|
|
8151
8153
|
const marks = createPieSliceMarks(context.chart.series, geometry.total, {
|
|
8152
|
-
start: TOP + radians(
|
|
8153
|
-
sweep: Math.min(FULL, Math.max(radians(1), radians(
|
|
8154
|
-
explode: Math.max(0,
|
|
8154
|
+
start: TOP + radians(chunkSKGJXCAO_cjs.finite(config?.pieStartAngle, 0)),
|
|
8155
|
+
sweep: Math.min(FULL, Math.max(radians(1), radians(chunkSKGJXCAO_cjs.finite(config?.pieSweep, 360)))),
|
|
8156
|
+
explode: Math.max(0, chunkSKGJXCAO_cjs.finite(config?.pieExplode, 0))
|
|
8155
8157
|
});
|
|
8156
8158
|
const gapPx = config?.pieSliceGap ?? 0;
|
|
8157
8159
|
return [
|
|
8158
8160
|
...marks.flatMap((mark) => createSliceNodes(context, shiftGeometry(geometry, mark), mark, gapPx)),
|
|
8159
|
-
...
|
|
8161
|
+
...chunkSKGJXCAO_cjs.renderPieLabels(
|
|
8160
8162
|
context,
|
|
8161
8163
|
geometry,
|
|
8162
8164
|
marks.map((mark) => ({
|
|
@@ -8188,20 +8190,20 @@ function createPieSliceMarks(seriesList, total, layout) {
|
|
|
8188
8190
|
const marks = [];
|
|
8189
8191
|
let angle = layout.start;
|
|
8190
8192
|
seriesList.forEach((series, seriesIndex) => {
|
|
8191
|
-
const value = Math.max(0,
|
|
8193
|
+
const value = Math.max(0, chunkSKGJXCAO_cjs.finite(series.values[0], 0));
|
|
8192
8194
|
const sweep = value / total * layout.sweep;
|
|
8193
8195
|
marks.push({
|
|
8194
8196
|
seriesId: series.id,
|
|
8195
8197
|
label: series.label,
|
|
8196
|
-
color: series.color ??
|
|
8198
|
+
color: series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length],
|
|
8197
8199
|
stroke: series.stroke,
|
|
8198
8200
|
strokeWidth: series.strokeWidth,
|
|
8199
8201
|
value,
|
|
8200
8202
|
share: value / total,
|
|
8201
8203
|
angles: { start: angle, end: angle + Math.min(sweep, layout.sweep >= FULL ? MAXIMUM_SWEEP : layout.sweep) },
|
|
8202
|
-
explode: Math.max(0,
|
|
8203
|
-
labelOffsetX:
|
|
8204
|
-
labelOffsetY:
|
|
8204
|
+
explode: Math.max(0, chunkSKGJXCAO_cjs.finite(series.offset, layout.explode)),
|
|
8205
|
+
labelOffsetX: chunkSKGJXCAO_cjs.finite(series.labelOffsetX, 0),
|
|
8206
|
+
labelOffsetY: chunkSKGJXCAO_cjs.finite(series.labelOffsetY, 0)
|
|
8205
8207
|
});
|
|
8206
8208
|
angle += sweep;
|
|
8207
8209
|
});
|
|
@@ -8224,14 +8226,14 @@ function pieOuterShadow(shadow, gapPx) {
|
|
|
8224
8226
|
function sliceCornerRadius(geometry, mark, gapPx) {
|
|
8225
8227
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
8226
8228
|
const rawSweep = mark.angles.end - mark.angles.start;
|
|
8227
|
-
const usesInnerArc =
|
|
8228
|
-
const gapSweep = 2 *
|
|
8229
|
+
const usesInnerArc = chunkSKGJXCAO_cjs.pieUsesInnerArc(geometry, mark.angles, gapPx);
|
|
8230
|
+
const gapSweep = 2 * chunkSKGJXCAO_cjs.gapInsetAngle(halfGap, geometry.outerRadius);
|
|
8229
8231
|
const availableSweep = Math.max(0, rawSweep - gapSweep);
|
|
8230
8232
|
return Math.min(
|
|
8231
8233
|
geometry.cornerRadius,
|
|
8232
|
-
usesInnerArc ?
|
|
8234
|
+
usesInnerArc ? chunkSKGJXCAO_cjs.maxPieCornerRadius(geometry.outerRadius, geometry.innerRadius, availableSweep) : chunkSKGJXCAO_cjs.maxApexCornerRadius(
|
|
8233
8235
|
geometry.outerRadius,
|
|
8234
|
-
|
|
8236
|
+
chunkSKGJXCAO_cjs.pieApexRadius(halfGap, rawSweep, geometry.outerRadius),
|
|
8235
8237
|
availableSweep
|
|
8236
8238
|
)
|
|
8237
8239
|
);
|
|
@@ -8244,14 +8246,14 @@ function sliceStroke(context, mark) {
|
|
|
8244
8246
|
}
|
|
8245
8247
|
return {
|
|
8246
8248
|
stroke: { kind: "solid", color: strokeColor },
|
|
8247
|
-
strokeWidth:
|
|
8249
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(mark.strokeWidth, chunkSKGJXCAO_cjs.finite(config?.pieStrokeWidth, 1))
|
|
8248
8250
|
};
|
|
8249
8251
|
}
|
|
8250
8252
|
function createSliceNodes(context, geometry, mark, gapPx) {
|
|
8251
8253
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
8252
|
-
const fill2 =
|
|
8253
|
-
const slicePath =
|
|
8254
|
-
const shadow =
|
|
8254
|
+
const fill2 = chunkSKGJXCAO_cjs.paint(mark.color, diagnostics, chart.id);
|
|
8255
|
+
const slicePath = chunkSKGJXCAO_cjs.createPieSlicePath(geometry, mark.angles, sliceCornerRadius(geometry, mark, gapPx), gapPx);
|
|
8256
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8255
8257
|
const strokeStyle = sliceStroke(context, mark);
|
|
8256
8258
|
const glow = chart.config?.pieGlow;
|
|
8257
8259
|
const shadowCaster = shadow ? {
|
|
@@ -8282,12 +8284,12 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
8282
8284
|
pieEnd: mark.angles.end,
|
|
8283
8285
|
pieValue: mark.value
|
|
8284
8286
|
},
|
|
8285
|
-
prop:
|
|
8287
|
+
prop: chunkSKGJXCAO_cjs.seriesValueProp(mark.seriesId, 0),
|
|
8286
8288
|
style: {
|
|
8287
8289
|
fill: fill2,
|
|
8288
8290
|
...strokeStyle,
|
|
8289
8291
|
innerShadow: shadow,
|
|
8290
|
-
shadow: glow ? { color:
|
|
8292
|
+
shadow: glow ? { color: chunkSKGJXCAO_cjs.representativeColor(mark.color, "#ffffff"), opacity: 0.85, blur: glow, dx: 0, dy: 0 } : void 0
|
|
8291
8293
|
}
|
|
8292
8294
|
};
|
|
8293
8295
|
return shadowCaster ? [shadowCaster, slice] : [slice];
|
|
@@ -8295,7 +8297,7 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
8295
8297
|
|
|
8296
8298
|
// src/renderScene/charts/renderers/pie.ts
|
|
8297
8299
|
function renderPie(context) {
|
|
8298
|
-
const geometry =
|
|
8300
|
+
const geometry = chunkSKGJXCAO_cjs.createPieGeometry(context);
|
|
8299
8301
|
return [...renderPieSlices(context, geometry), ...renderPieCenter(context, geometry)];
|
|
8300
8302
|
}
|
|
8301
8303
|
|
|
@@ -8312,18 +8314,18 @@ var OUTSIDE_FALLBACK_COLOR = "#334155";
|
|
|
8312
8314
|
function layoutOf(context) {
|
|
8313
8315
|
const { chart, plot } = context;
|
|
8314
8316
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
8315
|
-
const axisMin =
|
|
8317
|
+
const axisMin = chunkSKGJXCAO_cjs.finite(chart.axisY.min, 0);
|
|
8316
8318
|
return {
|
|
8317
8319
|
centerX: plot.x + plot.width / 2,
|
|
8318
8320
|
centerY: plot.y + plot.height / 2,
|
|
8319
8321
|
maxRadius,
|
|
8320
|
-
innerRadius: Math.max(0, Math.min(
|
|
8321
|
-
cornerRadius: Math.max(0,
|
|
8322
|
-
gapPx: Math.max(0,
|
|
8322
|
+
innerRadius: Math.max(0, Math.min(chunkSKGJXCAO_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1)),
|
|
8323
|
+
cornerRadius: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.pieCornerRadius, 0)),
|
|
8324
|
+
gapPx: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.pieSliceGap, 0)),
|
|
8323
8325
|
axisMin,
|
|
8324
|
-
range:
|
|
8326
|
+
range: chunkSKGJXCAO_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
8325
8327
|
sweep: chart.series.length > 0 ? Math.PI * 2 / chart.series.length : 0,
|
|
8326
|
-
start: TOP2 +
|
|
8328
|
+
start: TOP2 + chunkSKGJXCAO_cjs.finite(chart.config?.pieStartAngle, 0) * Math.PI / 180
|
|
8327
8329
|
};
|
|
8328
8330
|
}
|
|
8329
8331
|
function clampedCorner(layout, outerRadius, angles) {
|
|
@@ -8331,19 +8333,19 @@ function clampedCorner(layout, outerRadius, angles) {
|
|
|
8331
8333
|
const geometry = { centerX, centerY, outerRadius, innerRadius };
|
|
8332
8334
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
8333
8335
|
const rawSweep = angles.end - angles.start;
|
|
8334
|
-
const availableSweep = Math.max(0, rawSweep - 2 *
|
|
8335
|
-
if (
|
|
8336
|
-
return Math.min(cornerRadius,
|
|
8336
|
+
const availableSweep = Math.max(0, rawSweep - 2 * chunkSKGJXCAO_cjs.gapInsetAngle(halfGap, outerRadius));
|
|
8337
|
+
if (chunkSKGJXCAO_cjs.pieUsesInnerArc(geometry, angles, gapPx)) {
|
|
8338
|
+
return Math.min(cornerRadius, chunkSKGJXCAO_cjs.maxPieCornerRadius(outerRadius, innerRadius, availableSweep));
|
|
8337
8339
|
}
|
|
8338
|
-
const apexRadius =
|
|
8339
|
-
return Math.min(cornerRadius,
|
|
8340
|
+
const apexRadius = chunkSKGJXCAO_cjs.pieApexRadius(halfGap, rawSweep, outerRadius);
|
|
8341
|
+
return Math.min(cornerRadius, chunkSKGJXCAO_cjs.maxApexCornerRadius(outerRadius, apexRadius, availableSweep));
|
|
8340
8342
|
}
|
|
8341
8343
|
function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor) {
|
|
8342
8344
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
8343
8345
|
const { centerX, centerY, innerRadius, maxRadius, gapPx } = layout;
|
|
8344
|
-
const color =
|
|
8345
|
-
const shadow =
|
|
8346
|
-
const trackPath =
|
|
8346
|
+
const color = chunkSKGJXCAO_cjs.paint(rawColor, diagnostics, chart.id);
|
|
8347
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8348
|
+
const trackPath = chunkSKGJXCAO_cjs.createPieSlicePath(
|
|
8347
8349
|
{ centerX, centerY, outerRadius: maxRadius, innerRadius },
|
|
8348
8350
|
angles,
|
|
8349
8351
|
clampedCorner(layout, maxRadius, angles),
|
|
@@ -8356,12 +8358,12 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
8356
8358
|
bounds,
|
|
8357
8359
|
d: trackPath,
|
|
8358
8360
|
style: {
|
|
8359
|
-
fill:
|
|
8361
|
+
fill: chunkSKGJXCAO_cjs.paint(chart.gridColor ?? TRACK_COLOR_FALLBACK, diagnostics, chart.id),
|
|
8360
8362
|
opacity: chart.config?.polarTrackOpacity,
|
|
8361
8363
|
...trackStroke(context)
|
|
8362
8364
|
}
|
|
8363
8365
|
};
|
|
8364
|
-
const wedgePath =
|
|
8366
|
+
const wedgePath = chunkSKGJXCAO_cjs.createPieSlicePath(
|
|
8365
8367
|
{ centerX, centerY, outerRadius, innerRadius },
|
|
8366
8368
|
angles,
|
|
8367
8369
|
clampedCorner(layout, outerRadius, angles),
|
|
@@ -8390,7 +8392,7 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
8390
8392
|
pieEnd: angles.end,
|
|
8391
8393
|
pieValue: value
|
|
8392
8394
|
},
|
|
8393
|
-
prop:
|
|
8395
|
+
prop: chunkSKGJXCAO_cjs.seriesValueProp(series.id, 0),
|
|
8394
8396
|
style: { fill: color, innerShadow: shadow, ...wedgeStroke(context) }
|
|
8395
8397
|
};
|
|
8396
8398
|
return shadowCaster ? [track, shadowCaster, wedge] : [track, wedge];
|
|
@@ -8403,7 +8405,7 @@ function trackStroke(context) {
|
|
|
8403
8405
|
const dash = (config.polarTrackDash ?? "").split(/[ ,]+/).map(Number).filter((part) => Number.isFinite(part) && part > 0);
|
|
8404
8406
|
return {
|
|
8405
8407
|
stroke: { kind: "solid", color: config.polarTrackStroke },
|
|
8406
|
-
strokeWidth:
|
|
8408
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(config.polarTrackStrokeWidth, 1),
|
|
8407
8409
|
dash: dash.length > 0 ? dash : void 0
|
|
8408
8410
|
};
|
|
8409
8411
|
}
|
|
@@ -8414,7 +8416,7 @@ function wedgeStroke(context) {
|
|
|
8414
8416
|
}
|
|
8415
8417
|
return {
|
|
8416
8418
|
stroke: { kind: "solid", color: config.pieStroke },
|
|
8417
|
-
strokeWidth:
|
|
8419
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(config.pieStrokeWidth, 1)
|
|
8418
8420
|
};
|
|
8419
8421
|
}
|
|
8420
8422
|
function ringNodes(context, layout) {
|
|
@@ -8422,7 +8424,7 @@ function ringNodes(context, layout) {
|
|
|
8422
8424
|
if (!chart.config?.polarRings || layout.range <= 0) {
|
|
8423
8425
|
return [];
|
|
8424
8426
|
}
|
|
8425
|
-
return
|
|
8427
|
+
return chunkSKGJXCAO_cjs.chartTicks(chart.axisY).filter((tick) => tick > layout.axisMin && tick < layout.axisMin + layout.range).map((tick) => {
|
|
8426
8428
|
const radius = layout.innerRadius + (layout.maxRadius - layout.innerRadius) * (tick - layout.axisMin) / layout.range;
|
|
8427
8429
|
return {
|
|
8428
8430
|
type: "ellipse",
|
|
@@ -8436,7 +8438,7 @@ function ringNodes(context, layout) {
|
|
|
8436
8438
|
style: {
|
|
8437
8439
|
fill: { kind: "none" },
|
|
8438
8440
|
stroke: { kind: "solid", color: chart.textColor ?? "#334155" },
|
|
8439
|
-
strokeWidth:
|
|
8441
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1),
|
|
8440
8442
|
opacity: 0.25
|
|
8441
8443
|
}
|
|
8442
8444
|
};
|
|
@@ -8448,10 +8450,10 @@ function renderPolarArea(context) {
|
|
|
8448
8450
|
const showLabels = context.showLabels && sweep >= MIN_LABEL_SWEEP;
|
|
8449
8451
|
const wedges = context.chart.series.flatMap((series, index) => {
|
|
8450
8452
|
const angles = { start: start + index * sweep, end: start + (index + 1) * sweep };
|
|
8451
|
-
const value = Math.max(0,
|
|
8453
|
+
const value = Math.max(0, chunkSKGJXCAO_cjs.finite(series.values[0], 0));
|
|
8452
8454
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
8453
8455
|
const outerRadius = Math.max(innerRadius + 1, innerRadius + (maxRadius - innerRadius) * fraction);
|
|
8454
|
-
const rawColor = series.color ??
|
|
8456
|
+
const rawColor = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[index % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
8455
8457
|
const nodes = wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor);
|
|
8456
8458
|
if (!showLabels) {
|
|
8457
8459
|
return nodes;
|
|
@@ -8462,10 +8464,10 @@ function renderPolarArea(context) {
|
|
|
8462
8464
|
return [...wedges, ...ringNodes(context, layout)];
|
|
8463
8465
|
}
|
|
8464
8466
|
function labelSizes(chart) {
|
|
8465
|
-
const base = Math.max(9,
|
|
8467
|
+
const base = Math.max(9, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12));
|
|
8466
8468
|
return {
|
|
8467
|
-
nameSize: Math.max(6,
|
|
8468
|
-
valueSize: Math.max(6,
|
|
8469
|
+
nameSize: Math.max(6, chunkSKGJXCAO_cjs.finite(chart.config?.polarNameSize, base)),
|
|
8470
|
+
valueSize: Math.max(6, chunkSKGJXCAO_cjs.finite(chart.config?.polarValueSize, base))
|
|
8469
8471
|
};
|
|
8470
8472
|
}
|
|
8471
8473
|
function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
@@ -8473,8 +8475,8 @@ function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
|
8473
8475
|
const { nameSize, valueSize } = labelSizes(context.chart);
|
|
8474
8476
|
const lineHeight = (nameSize + valueSize) * 1.2 / 2;
|
|
8475
8477
|
const ringThickness = geometry.outerRadius - geometry.innerRadius;
|
|
8476
|
-
const labelOffsetX =
|
|
8477
|
-
const labelOffsetY =
|
|
8478
|
+
const labelOffsetX = chunkSKGJXCAO_cjs.finite(series.labelOffsetX, 0);
|
|
8479
|
+
const labelOffsetY = chunkSKGJXCAO_cjs.finite(series.labelOffsetY, 0);
|
|
8478
8480
|
const hasManualOffset = labelOffsetX !== 0 || labelOffsetY !== 0;
|
|
8479
8481
|
const tooThin = ringThickness < lineHeight * 2 + 6;
|
|
8480
8482
|
const chordWidth = 2 * geometry.outerRadius * Math.sin(Math.abs(angles.end - angles.start) / 2);
|
|
@@ -8484,17 +8486,17 @@ function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
|
8484
8486
|
return void 0;
|
|
8485
8487
|
}
|
|
8486
8488
|
const outside = hasManualOffset || !fitsInline;
|
|
8487
|
-
const tickStart =
|
|
8488
|
-
const point = outside ? hasManualOffset ? addOffset(
|
|
8489
|
-
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor :
|
|
8490
|
-
|
|
8491
|
-
|
|
8489
|
+
const tickStart = chunkSKGJXCAO_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + LEADER_INSET);
|
|
8490
|
+
const point = outside ? hasManualOffset ? addOffset(chunkSKGJXCAO_cjs.pieArcPoint(geometry, mid, geometry.outerRadius), labelOffsetX, labelOffsetY) : chunkSKGJXCAO_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + OUTSIDE_GAP) : chunkSKGJXCAO_cjs.pieArcPoint(geometry, mid, geometry.innerRadius + ringThickness * LABEL_RADIUS_FRACTION);
|
|
8491
|
+
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor : chunkSKGJXCAO_cjs.sameHueTint(chunkSKGJXCAO_cjs.representativeColor(fillColor, OUTSIDE_FALLBACK_COLOR), OUTSIDE_TINT_LIGHTNESS) ?? OUTSIDE_FALLBACK_COLOR : chunkSKGJXCAO_cjs.sameHueContrastColor(
|
|
8492
|
+
chunkSKGJXCAO_cjs.representativeColor(fillColor, "#0f172a"),
|
|
8493
|
+
chunkSKGJXCAO_cjs.contrastTextColor(chunkSKGJXCAO_cjs.representativeColor(fillColor, "#0f172a"))
|
|
8492
8494
|
);
|
|
8493
8495
|
return { point, color, outside, mid, tickStart };
|
|
8494
8496
|
}
|
|
8495
8497
|
function labelTick(context, series, placement, lineHeight) {
|
|
8496
8498
|
const { point, color, outside, tickStart } = placement;
|
|
8497
|
-
const tickEnd = outside ?
|
|
8499
|
+
const tickEnd = outside ? chunkSKGJXCAO_cjs.clipSegmentToRect(tickStart, point, LABEL_WIDTH2 / 2, lineHeight) : tickStart;
|
|
8498
8500
|
return {
|
|
8499
8501
|
type: "path",
|
|
8500
8502
|
id: `chart-polar-area-label-tick-${context.chart.id}-${series.id}`,
|
|
@@ -8521,7 +8523,7 @@ function labelTexts(context, geometry, series, value, placement) {
|
|
|
8521
8523
|
bounds,
|
|
8522
8524
|
x: point.x - LABEL_WIDTH2 / 2,
|
|
8523
8525
|
width: LABEL_WIDTH2,
|
|
8524
|
-
fontFamily: chart.fontFamily ??
|
|
8526
|
+
fontFamily: chart.fontFamily ?? chunkSKGJXCAO_cjs.DEFAULT_FONT,
|
|
8525
8527
|
align: "center",
|
|
8526
8528
|
verticalAlign: "middle",
|
|
8527
8529
|
lineHeight: 1.2,
|
|
@@ -8544,7 +8546,7 @@ function labelTexts(context, geometry, series, value, placement) {
|
|
|
8544
8546
|
lines: [series.label],
|
|
8545
8547
|
fontWeight: valueFirst ? "normal" : "bold",
|
|
8546
8548
|
detail,
|
|
8547
|
-
prop:
|
|
8549
|
+
prop: chunkSKGJXCAO_cjs.seriesLabelProp(series.id)
|
|
8548
8550
|
};
|
|
8549
8551
|
const valueText = {
|
|
8550
8552
|
type: "text",
|
|
@@ -8554,10 +8556,10 @@ function labelTexts(context, geometry, series, value, placement) {
|
|
|
8554
8556
|
y: valueY,
|
|
8555
8557
|
height: valueSize * 1.2,
|
|
8556
8558
|
fontSize: valueSize,
|
|
8557
|
-
lines: [
|
|
8559
|
+
lines: [chunkSKGJXCAO_cjs.formatFieldValue(value)],
|
|
8558
8560
|
fontWeight: valueFirst ? "bold" : "normal",
|
|
8559
8561
|
detail,
|
|
8560
|
-
prop:
|
|
8562
|
+
prop: chunkSKGJXCAO_cjs.seriesValueProp(series.id, 0),
|
|
8561
8563
|
propKind: "value"
|
|
8562
8564
|
};
|
|
8563
8565
|
return [nameText, valueText];
|
|
@@ -8584,10 +8586,10 @@ function radarFrameFor(context) {
|
|
|
8584
8586
|
return {
|
|
8585
8587
|
centerX: plot.x + plot.width / 2,
|
|
8586
8588
|
centerY: plot.y + plot.height / 2,
|
|
8587
|
-
radius:
|
|
8589
|
+
radius: chunkSKGJXCAO_cjs.radarRadius(plot.width, plot.height, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12), context.showLabels),
|
|
8588
8590
|
min: chart.axisY.min,
|
|
8589
8591
|
max: chart.axisY.max,
|
|
8590
|
-
count:
|
|
8592
|
+
count: chunkSKGJXCAO_cjs.radarCategoryCount(configuredCount, dataCount),
|
|
8591
8593
|
curved: chart.chartType === "radial",
|
|
8592
8594
|
tension: chart.config?.radarTension
|
|
8593
8595
|
};
|
|
@@ -8597,7 +8599,7 @@ function createRadarGeometry(context) {
|
|
|
8597
8599
|
const configuredCategories = chart.config?.categories?.filter(Boolean) ?? [];
|
|
8598
8600
|
const frame = radarFrameFor(context);
|
|
8599
8601
|
const categories = createCategories(configuredCategories, frame.count);
|
|
8600
|
-
const pointAt = (pointRadius, pointIndex) =>
|
|
8602
|
+
const pointAt = (pointRadius, pointIndex) => chunkSKGJXCAO_cjs.radarPointAt(frame, pointIndex, pointRadius);
|
|
8601
8603
|
return {
|
|
8602
8604
|
circular: frame.curved,
|
|
8603
8605
|
areaOpacity: Math.max(0, Math.min(1, chart.config?.areaOpacity ?? 0.16)),
|
|
@@ -8609,9 +8611,9 @@ function createRadarGeometry(context) {
|
|
|
8609
8611
|
centerX: frame.centerX,
|
|
8610
8612
|
centerY: frame.centerY,
|
|
8611
8613
|
radius: frame.radius,
|
|
8612
|
-
radiusForValue: (value) =>
|
|
8614
|
+
radiusForValue: (value) => chunkSKGJXCAO_cjs.radarRadiusForValue(frame, value),
|
|
8613
8615
|
pointAt,
|
|
8614
|
-
polygonPath: (pointRadius) =>
|
|
8616
|
+
polygonPath: (pointRadius) => chunkSKGJXCAO_cjs.radarSeriesPath(
|
|
8615
8617
|
categories.map((_, index) => pointAt(pointRadius, index)),
|
|
8616
8618
|
false
|
|
8617
8619
|
)
|
|
@@ -8632,7 +8634,7 @@ function renderRadarGrid(context, geometry) {
|
|
|
8632
8634
|
return [...renderRings(context, geometry), ...geometry.showSpokes ? renderSpokes(context, geometry) : []];
|
|
8633
8635
|
}
|
|
8634
8636
|
function renderRings(context, geometry) {
|
|
8635
|
-
return
|
|
8637
|
+
return chunkSKGJXCAO_cjs.chartTicks(context.chart.axisY).filter((tick) => tick > context.chart.axisY.min).map((tick) => createRingNode(context, geometry, tick));
|
|
8636
8638
|
}
|
|
8637
8639
|
function createRingNode(context, geometry, tick) {
|
|
8638
8640
|
const { chart, bounds, nextOrder } = context;
|
|
@@ -8640,7 +8642,7 @@ function createRingNode(context, geometry, tick) {
|
|
|
8640
8642
|
const style = {
|
|
8641
8643
|
fill: { kind: "none" },
|
|
8642
8644
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8643
|
-
strokeWidth:
|
|
8645
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1)
|
|
8644
8646
|
};
|
|
8645
8647
|
if (geometry.circular) {
|
|
8646
8648
|
return {
|
|
@@ -8677,7 +8679,7 @@ function renderSpokes(context, geometry) {
|
|
|
8677
8679
|
style: {
|
|
8678
8680
|
fill: { kind: "none" },
|
|
8679
8681
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8680
|
-
strokeWidth:
|
|
8682
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1)
|
|
8681
8683
|
}
|
|
8682
8684
|
};
|
|
8683
8685
|
});
|
|
@@ -8697,7 +8699,7 @@ function createCategoryLabel(context, geometry, category, categoryIndex) {
|
|
|
8697
8699
|
const labelPoint = geometry.pointAt(geometry.radius + 10, categoryIndex);
|
|
8698
8700
|
const horizontalOffset = labelPoint.x - geometry.centerX;
|
|
8699
8701
|
const width = Math.max(64, Math.min(120, plot.width / 3));
|
|
8700
|
-
return
|
|
8702
|
+
return chunkSKGJXCAO_cjs.chartText({
|
|
8701
8703
|
id: `chart-radar-label-${chart.id}-${categoryIndex}`,
|
|
8702
8704
|
order: nextOrder(),
|
|
8703
8705
|
bounds,
|
|
@@ -8735,9 +8737,9 @@ function renderRadarSeries(context, geometry) {
|
|
|
8735
8737
|
return nodes;
|
|
8736
8738
|
}
|
|
8737
8739
|
function renderSeries(context, geometry, series, seriesIndex) {
|
|
8738
|
-
const color = series.color ??
|
|
8740
|
+
const color = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
8739
8741
|
const points = seriesPoints(series, context, geometry);
|
|
8740
|
-
const path =
|
|
8742
|
+
const path = chunkSKGJXCAO_cjs.radarSeriesPath(points, geometry.circular, geometry.tension);
|
|
8741
8743
|
return [
|
|
8742
8744
|
createSeriesFill(context, geometry, series, path, color),
|
|
8743
8745
|
...geometry.strokeWidth > 0 ? [createSeriesStroke(context, geometry, series, path, color)] : [],
|
|
@@ -8760,7 +8762,7 @@ function createSeriesFill(context, geometry, series, path, color) {
|
|
|
8760
8762
|
d: path,
|
|
8761
8763
|
detail: { of: "chartSeries", series: series.id },
|
|
8762
8764
|
style: {
|
|
8763
|
-
fill:
|
|
8765
|
+
fill: chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id),
|
|
8764
8766
|
stroke: { kind: "none" },
|
|
8765
8767
|
opacity: Math.max(0, Math.min(1, series.opacity ?? geometry.areaOpacity))
|
|
8766
8768
|
}
|
|
@@ -8777,10 +8779,10 @@ function createSeriesStroke(context, geometry, series, path, color) {
|
|
|
8777
8779
|
detail: { of: "chartSeries", series: series.id },
|
|
8778
8780
|
style: {
|
|
8779
8781
|
fill: { kind: "none" },
|
|
8780
|
-
stroke:
|
|
8782
|
+
stroke: chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id),
|
|
8781
8783
|
strokeWidth: geometry.strokeWidth,
|
|
8782
8784
|
lineJoin: "round",
|
|
8783
|
-
shadow:
|
|
8785
|
+
shadow: chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle)
|
|
8784
8786
|
}
|
|
8785
8787
|
};
|
|
8786
8788
|
}
|
|
@@ -8796,8 +8798,8 @@ function createSeriesPoints(context, geometry, series, points, color) {
|
|
|
8796
8798
|
rx: geometry.pointSize,
|
|
8797
8799
|
ry: geometry.pointSize,
|
|
8798
8800
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex, mark: "radar-vertex" },
|
|
8799
|
-
prop:
|
|
8800
|
-
style: { fill:
|
|
8801
|
+
prop: chunkSKGJXCAO_cjs.seriesValueProp(series.id, pointIndex),
|
|
8802
|
+
style: { fill: chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id) }
|
|
8801
8803
|
}));
|
|
8802
8804
|
}
|
|
8803
8805
|
|
|
@@ -8851,25 +8853,25 @@ function ringProgressPath(cx, cy, r, sweep, from) {
|
|
|
8851
8853
|
}
|
|
8852
8854
|
function layoutOf2(context) {
|
|
8853
8855
|
const { chart, plot } = context;
|
|
8854
|
-
const axisMin =
|
|
8856
|
+
const axisMin = chunkSKGJXCAO_cjs.finite(chart.axisY.min, 0);
|
|
8855
8857
|
return {
|
|
8856
8858
|
centerX: plot.x + plot.width / 2,
|
|
8857
8859
|
centerY: plot.y + plot.height / 2,
|
|
8858
8860
|
outerRadius: Math.max(1, Math.min(plot.width, plot.height) / 2 - 4),
|
|
8859
|
-
ringThickness: Math.max(1,
|
|
8860
|
-
ringGap: Math.max(0,
|
|
8861
|
+
ringThickness: Math.max(1, chunkSKGJXCAO_cjs.finite(chart.config?.ringThickness, DEFAULT_RING_THICKNESS)),
|
|
8862
|
+
ringGap: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.ringGap, DEFAULT_RING_GAP)),
|
|
8861
8863
|
axisMin,
|
|
8862
|
-
range:
|
|
8863
|
-
start: TOP3 +
|
|
8864
|
-
total: Math.min(360, Math.max(1,
|
|
8865
|
-
trackOpacity: Math.min(1, Math.max(0,
|
|
8864
|
+
range: chunkSKGJXCAO_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
8865
|
+
start: TOP3 + chunkSKGJXCAO_cjs.finite(chart.config?.ringStartAngle, 0) * Math.PI / 180,
|
|
8866
|
+
total: Math.min(360, Math.max(1, chunkSKGJXCAO_cjs.finite(chart.config?.ringSweep, 360))) * Math.PI / 180,
|
|
8867
|
+
trackOpacity: Math.min(1, Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.ringTrackOpacity, TRACK_OPACITY))),
|
|
8866
8868
|
cap: chart.config?.ringCap ?? "round"
|
|
8867
8869
|
};
|
|
8868
8870
|
}
|
|
8869
8871
|
function ringEndShadows(context, layout, series, radius, sweep, color) {
|
|
8870
8872
|
const { chart, bounds, nextOrder } = context;
|
|
8871
8873
|
const { centerX, centerY, ringThickness, start } = layout;
|
|
8872
|
-
const shadow =
|
|
8874
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8873
8875
|
const isFullCircle = sweep >= Math.PI * 2 - FULL_SWEEP_EPSILON;
|
|
8874
8876
|
if (!shadow || isFullCircle) {
|
|
8875
8877
|
return [];
|
|
@@ -8907,8 +8909,8 @@ function ringNodes2(context, layout, series, index) {
|
|
|
8907
8909
|
if (radius <= ringThickness / 2) {
|
|
8908
8910
|
return [];
|
|
8909
8911
|
}
|
|
8910
|
-
const color =
|
|
8911
|
-
const value = Math.max(0,
|
|
8912
|
+
const color = chunkSKGJXCAO_cjs.paint(series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[index % chunkSKGJXCAO_cjs.CHART_COLORS.length], diagnostics, chart.id);
|
|
8913
|
+
const value = Math.max(0, chunkSKGJXCAO_cjs.finite(series.values[0], 0));
|
|
8912
8914
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
8913
8915
|
const trackStyle = {
|
|
8914
8916
|
fill: { kind: "none" },
|
|
@@ -8946,7 +8948,7 @@ function ringNodes2(context, layout, series, index) {
|
|
|
8946
8948
|
bounds,
|
|
8947
8949
|
d: ringProgressPath(centerX, centerY, radius, sweep, start),
|
|
8948
8950
|
detail: { of: "chartValue", series: series.id, valueIndex: 0, mark: "radial-bar-ring" },
|
|
8949
|
-
prop:
|
|
8951
|
+
prop: chunkSKGJXCAO_cjs.seriesValueProp(series.id, 0),
|
|
8950
8952
|
style: { fill: { kind: "none" }, stroke: color, strokeWidth: ringThickness, lineCap: cap }
|
|
8951
8953
|
};
|
|
8952
8954
|
return [track, ...casters, progress];
|
|
@@ -8958,7 +8960,7 @@ function renderRadialBar(context) {
|
|
|
8958
8960
|
|
|
8959
8961
|
// src/renderScene/charts/renderers/sankey/links.ts
|
|
8960
8962
|
function renderSankeyLinks(context, data) {
|
|
8961
|
-
const shadow =
|
|
8963
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
8962
8964
|
const gradient = Boolean(context.chart.config?.linkGradient);
|
|
8963
8965
|
const { plot } = context;
|
|
8964
8966
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
@@ -8979,8 +8981,8 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
8979
8981
|
bottom: data.baseY + link.targetY1
|
|
8980
8982
|
};
|
|
8981
8983
|
const config = context.chart.config;
|
|
8982
|
-
const fromColor = link.color || data.nodeColors.get(link.source) ||
|
|
8983
|
-
const toColor = data.nodeColors.get(link.target) ||
|
|
8984
|
+
const fromColor = link.color || data.nodeColors.get(link.source) || chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL;
|
|
8985
|
+
const toColor = data.nodeColors.get(link.target) || chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL;
|
|
8984
8986
|
const fill2 = gradient ? {
|
|
8985
8987
|
kind: "linear-gradient",
|
|
8986
8988
|
angle: 0,
|
|
@@ -8995,9 +8997,9 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
8995
8997
|
toId: link.target,
|
|
8996
8998
|
source,
|
|
8997
8999
|
target,
|
|
8998
|
-
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0,
|
|
9000
|
+
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0, chunkSKGJXCAO_cjs.finite(config?.sankeyLinkCurve, 0.5))),
|
|
8999
9001
|
fill: fill2,
|
|
9000
|
-
opacity: Math.min(1, Math.max(0,
|
|
9002
|
+
opacity: Math.min(1, Math.max(0, chunkSKGJXCAO_cjs.finite(config?.sankeyLinkOpacity, link.color ? 0.85 : 0.45)))
|
|
9001
9003
|
};
|
|
9002
9004
|
}
|
|
9003
9005
|
function createSankeyRibbonNode(context, ribbon, shadow, clipPath, gradient) {
|
|
@@ -9038,7 +9040,7 @@ function sankeyRibbonPath(ribbon) {
|
|
|
9038
9040
|
var OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG = 0.3;
|
|
9039
9041
|
var OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG = 0.78;
|
|
9040
9042
|
function renderSankeyNodes(context, data) {
|
|
9041
|
-
const cornerRadius = Math.max(0,
|
|
9043
|
+
const cornerRadius = Math.max(0, chunkSKGJXCAO_cjs.finite(context.chart.config?.barCornerRadius, 0));
|
|
9042
9044
|
const nodes = [];
|
|
9043
9045
|
data.nodes.forEach((node) => {
|
|
9044
9046
|
nodes.push(createNodeRect(context, data, node, cornerRadius));
|
|
@@ -9054,8 +9056,8 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
9054
9056
|
const x = data.baseX + node.x;
|
|
9055
9057
|
const y = data.baseY + node.y;
|
|
9056
9058
|
const style = {
|
|
9057
|
-
fill: { kind: "solid", color: node.color ||
|
|
9058
|
-
shadow:
|
|
9059
|
+
fill: { kind: "solid", color: node.color || chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL },
|
|
9060
|
+
shadow: chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle)
|
|
9059
9061
|
};
|
|
9060
9062
|
const isFirstColumn = node.column === 0;
|
|
9061
9063
|
const isLastColumn = node.column === data.columnCount - 1;
|
|
@@ -9081,7 +9083,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
9081
9083
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
9082
9084
|
order: nextOrder(),
|
|
9083
9085
|
bounds,
|
|
9084
|
-
d:
|
|
9086
|
+
d: chunkSKGJXCAO_cjs.leftRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
9085
9087
|
style,
|
|
9086
9088
|
detail
|
|
9087
9089
|
};
|
|
@@ -9092,7 +9094,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
9092
9094
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
9093
9095
|
order: nextOrder(),
|
|
9094
9096
|
bounds,
|
|
9095
|
-
d:
|
|
9097
|
+
d: chunkSKGJXCAO_cjs.rightRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
9096
9098
|
style,
|
|
9097
9099
|
detail
|
|
9098
9100
|
};
|
|
@@ -9118,9 +9120,9 @@ function createNodeLabel(context, data, node) {
|
|
|
9118
9120
|
return void 0;
|
|
9119
9121
|
}
|
|
9120
9122
|
const fallback = chart.textColor ?? "#0f172a";
|
|
9121
|
-
const defaultColor = position === "inside" ?
|
|
9123
|
+
const defaultColor = position === "inside" ? chunkSKGJXCAO_cjs.contrastTextColor(node.color) : chunkSKGJXCAO_cjs.sameHueTint(
|
|
9122
9124
|
node.color,
|
|
9123
|
-
|
|
9125
|
+
chunkSKGJXCAO_cjs.isLightColor(fallback) ? OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG : OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG
|
|
9124
9126
|
) ?? fallback;
|
|
9125
9127
|
const color = chart.config?.labelColor ?? defaultColor;
|
|
9126
9128
|
return { ...label, color, detail: { of: "chartSeries", series: node.id, mark: "sankey-node-label" } };
|
|
@@ -9132,7 +9134,7 @@ function createOutsideLabel(context, data, node) {
|
|
|
9132
9134
|
const y = data.baseY + node.y;
|
|
9133
9135
|
const labelX2 = isLastColumn ? x - data.labelGutter + 8 : x + node.width + 6;
|
|
9134
9136
|
return {
|
|
9135
|
-
...
|
|
9137
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
9136
9138
|
id: `chart-sankey-label-${chart.id}-${node.id}`,
|
|
9137
9139
|
order: nextOrder(),
|
|
9138
9140
|
bounds,
|
|
@@ -9157,11 +9159,11 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
9157
9159
|
if (orientation === "vertical") {
|
|
9158
9160
|
const thickness = fontSize * 1.4;
|
|
9159
9161
|
const width = Math.max(1, node.height - 8);
|
|
9160
|
-
if (
|
|
9162
|
+
if (chunkSKGJXCAO_cjs.estimateTextWidth(node.label, fontSize, false) > width) {
|
|
9161
9163
|
return void 0;
|
|
9162
9164
|
}
|
|
9163
9165
|
return {
|
|
9164
|
-
...
|
|
9166
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
9165
9167
|
id,
|
|
9166
9168
|
order: nextOrder(),
|
|
9167
9169
|
bounds,
|
|
@@ -9178,7 +9180,7 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
9178
9180
|
};
|
|
9179
9181
|
}
|
|
9180
9182
|
return {
|
|
9181
|
-
...
|
|
9183
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
9182
9184
|
id,
|
|
9183
9185
|
order: nextOrder(),
|
|
9184
9186
|
bounds,
|
|
@@ -9199,18 +9201,18 @@ function createSankeyRenderData(context) {
|
|
|
9199
9201
|
const labelGutter = showLabels ? 92 : 0;
|
|
9200
9202
|
const availableWidth = Math.max(1, plot.width - labelGutter * 2);
|
|
9201
9203
|
const layout = layoutSankey(createNodeInputs(context), createLinkInputs(context), availableWidth, plot.height, {
|
|
9202
|
-
nodeWidth: Math.max(1,
|
|
9203
|
-
nodeGap: Math.max(0,
|
|
9204
|
+
nodeWidth: Math.max(1, chunkSKGJXCAO_cjs.finite(chart.config?.sankeyNodeWidth, 18)),
|
|
9205
|
+
nodeGap: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.sankeyNodeGap, 8))
|
|
9204
9206
|
});
|
|
9205
9207
|
return {
|
|
9206
9208
|
...layout,
|
|
9207
9209
|
baseX: plot.x + labelGutter,
|
|
9208
9210
|
baseY: plot.y,
|
|
9209
9211
|
labelGutter,
|
|
9210
|
-
fontSize: Math.max(9,
|
|
9211
|
-
labelSize: Math.max(6,
|
|
9212
|
+
fontSize: Math.max(9, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12)),
|
|
9213
|
+
labelSize: Math.max(6, chunkSKGJXCAO_cjs.finite(chart.config?.sankeyLabelSize, Math.max(9, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
9212
9214
|
columnCount: Math.max(1, ...layout.nodes.map((node) => node.column + 1)),
|
|
9213
|
-
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color ||
|
|
9215
|
+
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color || chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL]))
|
|
9214
9216
|
};
|
|
9215
9217
|
}
|
|
9216
9218
|
function createNodeInputs(context) {
|
|
@@ -9232,7 +9234,7 @@ function createLinkInputs(context) {
|
|
|
9232
9234
|
source: series.source,
|
|
9233
9235
|
target: series.target,
|
|
9234
9236
|
value: series.values[0] ?? 0,
|
|
9235
|
-
color: series.color ?
|
|
9237
|
+
color: series.color ? chunkSKGJXCAO_cjs.representativeColor(series.color, chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL) : void 0
|
|
9236
9238
|
});
|
|
9237
9239
|
});
|
|
9238
9240
|
return inputs;
|
|
@@ -9251,9 +9253,9 @@ function renderSankey(context) {
|
|
|
9251
9253
|
var DEFAULT_POINT_SIZE = 4;
|
|
9252
9254
|
function renderScatter(context) {
|
|
9253
9255
|
const nodes = [];
|
|
9254
|
-
const shadow =
|
|
9256
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
9255
9257
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
9256
|
-
const color = series.color ??
|
|
9258
|
+
const color = series.color ?? chunkSKGJXCAO_cjs.CHART_COLORS[seriesIndex % chunkSKGJXCAO_cjs.CHART_COLORS.length];
|
|
9257
9259
|
const points = pixelPoints(context, seriesValuePairs(context.chart, series));
|
|
9258
9260
|
points.forEach((point, pointIndex) => {
|
|
9259
9261
|
nodes.push(createScatterPoint(context, series, point, pointIndex, color, shadow));
|
|
@@ -9277,8 +9279,8 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
9277
9279
|
ry: radius,
|
|
9278
9280
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex },
|
|
9279
9281
|
style: {
|
|
9280
|
-
fill:
|
|
9281
|
-
stroke: strokeWidth > 0 ?
|
|
9282
|
+
fill: chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id),
|
|
9283
|
+
stroke: strokeWidth > 0 ? chunkSKGJXCAO_cjs.paint(config?.pointStrokeColor ?? color, diagnostics, chart.id) : void 0,
|
|
9282
9284
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
9283
9285
|
opacity: config?.pointOpacity,
|
|
9284
9286
|
shadow
|
|
@@ -9289,14 +9291,14 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
9289
9291
|
// src/renderScene/charts/renderers/treemap/layout.ts
|
|
9290
9292
|
function createTreemapLayout(context) {
|
|
9291
9293
|
const { chart, plot, showLegend } = context;
|
|
9292
|
-
const fontSize = Math.max(9,
|
|
9294
|
+
const fontSize = Math.max(9, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12));
|
|
9293
9295
|
const legendPosition = chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : "bottom";
|
|
9294
9296
|
const legendHeight = showLegend && legendPosition === "bottom" ? 48 : 0;
|
|
9295
|
-
const cellGap = Math.max(0,
|
|
9297
|
+
const cellGap = Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.cellGap, 0));
|
|
9296
9298
|
return {
|
|
9297
9299
|
leaves: chart.series,
|
|
9298
|
-
bands:
|
|
9299
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
9300
|
+
bands: chunkSKGJXCAO_cjs.axisBands(chart.axisY),
|
|
9301
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkSKGJXCAO_cjs.DEFAULT_HEATMAP_ZONES,
|
|
9300
9302
|
fontSize,
|
|
9301
9303
|
smallFontSize: Math.max(8, fontSize - 1),
|
|
9302
9304
|
legendPosition,
|
|
@@ -9304,18 +9306,18 @@ function createTreemapLayout(context) {
|
|
|
9304
9306
|
gridWidth: Math.max(1, plot.width),
|
|
9305
9307
|
gridHeight: Math.max(1, plot.height - legendHeight),
|
|
9306
9308
|
cellGap,
|
|
9307
|
-
cellRadius: Math.max(0,
|
|
9308
|
-
headerHeight: Math.max(0,
|
|
9309
|
-
labelSize: Math.max(6,
|
|
9310
|
-
valueSize: Math.max(6,
|
|
9311
|
-
labelPadding: Math.max(0,
|
|
9309
|
+
cellRadius: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.barCornerRadius, cellGap)),
|
|
9310
|
+
headerHeight: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.headerHeight, 20)),
|
|
9311
|
+
labelSize: Math.max(6, chunkSKGJXCAO_cjs.finite(chart.config?.tileLabelSize, Math.max(8, fontSize - 1))),
|
|
9312
|
+
valueSize: Math.max(6, chunkSKGJXCAO_cjs.finite(chart.config?.tileValueSize, Math.max(8, fontSize - 1))),
|
|
9313
|
+
labelPadding: Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.tileLabelPadding, 4))
|
|
9312
9314
|
};
|
|
9313
9315
|
}
|
|
9314
9316
|
function treemapLeafValue(leaf) {
|
|
9315
9317
|
return leaf.values[0] ?? 0;
|
|
9316
9318
|
}
|
|
9317
9319
|
function treemapLeafColor(leaf, layout) {
|
|
9318
|
-
return leaf.color ??
|
|
9320
|
+
return leaf.color ?? chunkSKGJXCAO_cjs.zoneColorAtValue(treemapLeafValue(leaf), layout.bands, layout.zones);
|
|
9319
9321
|
}
|
|
9320
9322
|
|
|
9321
9323
|
// src/renderScene/charts/renderers/treemap/legend.ts
|
|
@@ -9340,7 +9342,7 @@ function bandStops(layout) {
|
|
|
9340
9342
|
const zones = layout.zones.slice(0, bandCount);
|
|
9341
9343
|
return zones.map((zone, index) => ({
|
|
9342
9344
|
offset: bandRatio2(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
9343
|
-
color: zone.color ??
|
|
9345
|
+
color: zone.color ?? chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL
|
|
9344
9346
|
}));
|
|
9345
9347
|
}
|
|
9346
9348
|
function renderBottomLegend(context, layout) {
|
|
@@ -9349,7 +9351,7 @@ function renderBottomLegend(context, layout) {
|
|
|
9349
9351
|
const barWidth = layout.gridWidth;
|
|
9350
9352
|
const labelHeight = layout.fontSize + 2;
|
|
9351
9353
|
const barY = plot.y + layout.gridHeight + CHART_GAP;
|
|
9352
|
-
const barBounds =
|
|
9354
|
+
const barBounds = chunkSKGJXCAO_cjs.boxBounds({ x: barX, y: barY, width: barWidth, height: BAR_THICKNESS2 });
|
|
9353
9355
|
const stops = bandStops(layout);
|
|
9354
9356
|
const bar = {
|
|
9355
9357
|
type: "rect",
|
|
@@ -9363,7 +9365,7 @@ function renderBottomLegend(context, layout) {
|
|
|
9363
9365
|
rx: 3,
|
|
9364
9366
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
9365
9367
|
style: {
|
|
9366
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color:
|
|
9368
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color: chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL },
|
|
9367
9369
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
9368
9370
|
strokeWidth: 1
|
|
9369
9371
|
}
|
|
@@ -9386,12 +9388,12 @@ function renderBottomLegend(context, layout) {
|
|
|
9386
9388
|
const isLast = index === layout.bands.length - 1;
|
|
9387
9389
|
const align = isFirst ? "left" : isLast ? "right" : "center";
|
|
9388
9390
|
const frameX = isFirst ? x : isLast ? x - LABEL_SIZE : x - LABEL_SIZE / 2;
|
|
9389
|
-
const label =
|
|
9391
|
+
const label = chunkSKGJXCAO_cjs.chartText({
|
|
9390
9392
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
9391
9393
|
order: nextOrder(),
|
|
9392
9394
|
bounds,
|
|
9393
9395
|
frame: { x: frameX, y: barY + BAR_THICKNESS2 + TICK_LENGTH3 + ROW_GAP2, width: LABEL_SIZE, height: labelHeight },
|
|
9394
|
-
text:
|
|
9396
|
+
text: chunkSKGJXCAO_cjs.formatFieldValue(value),
|
|
9395
9397
|
chart,
|
|
9396
9398
|
align
|
|
9397
9399
|
});
|
|
@@ -9405,7 +9407,7 @@ function renderSideLegend(context, layout) {
|
|
|
9405
9407
|
const barTop = plot.y;
|
|
9406
9408
|
const barHeight = layout.gridHeight;
|
|
9407
9409
|
const barX = side === "left" ? plot.x - CHART_GAP - BAR_THICKNESS2 : plot.x + layout.gridWidth + CHART_GAP;
|
|
9408
|
-
const barBounds =
|
|
9410
|
+
const barBounds = chunkSKGJXCAO_cjs.boxBounds({ x: barX, y: barTop, width: BAR_THICKNESS2, height: barHeight });
|
|
9409
9411
|
const stops = bandStops(layout);
|
|
9410
9412
|
const bar = {
|
|
9411
9413
|
type: "rect",
|
|
@@ -9419,7 +9421,7 @@ function renderSideLegend(context, layout) {
|
|
|
9419
9421
|
rx: 3,
|
|
9420
9422
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
9421
9423
|
style: {
|
|
9422
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color:
|
|
9424
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color: chunkSKGJXCAO_cjs.DEFAULT_ZONE_FILL },
|
|
9423
9425
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
9424
9426
|
strokeWidth: 1
|
|
9425
9427
|
}
|
|
@@ -9441,12 +9443,12 @@ function renderSideLegend(context, layout) {
|
|
|
9441
9443
|
strokeWidth: 1
|
|
9442
9444
|
}
|
|
9443
9445
|
};
|
|
9444
|
-
const label =
|
|
9446
|
+
const label = chunkSKGJXCAO_cjs.chartText({
|
|
9445
9447
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
9446
9448
|
order: nextOrder(),
|
|
9447
9449
|
bounds,
|
|
9448
9450
|
frame: { x: labelX2, y: y - layout.fontSize / 2, width: LABEL_SIZE, height: layout.fontSize + 2 },
|
|
9449
|
-
text:
|
|
9451
|
+
text: chunkSKGJXCAO_cjs.formatFieldValue(value),
|
|
9450
9452
|
chart,
|
|
9451
9453
|
align: side === "left" ? "right" : "left"
|
|
9452
9454
|
});
|
|
@@ -9534,7 +9536,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
9534
9536
|
};
|
|
9535
9537
|
const smallFontSize = Math.max(8, Math.max(9, chart.fontSize ?? 12) - 1);
|
|
9536
9538
|
const label = {
|
|
9537
|
-
...
|
|
9539
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
9538
9540
|
id: `chart-treemap-header-label-${chart.id}-${index}`,
|
|
9539
9541
|
order: nextOrder(),
|
|
9540
9542
|
bounds,
|
|
@@ -9549,7 +9551,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
9549
9551
|
align: "center"
|
|
9550
9552
|
}),
|
|
9551
9553
|
fontSize: smallFontSize,
|
|
9552
|
-
color:
|
|
9554
|
+
color: chunkSKGJXCAO_cjs.contrastTextColor(fill2)
|
|
9553
9555
|
};
|
|
9554
9556
|
return [background, label];
|
|
9555
9557
|
}
|
|
@@ -9565,7 +9567,7 @@ function renderTile(context, layout, tile, nextTile) {
|
|
|
9565
9567
|
function createTileNode(context, layout, tile, color, nextColor) {
|
|
9566
9568
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
9567
9569
|
const gap = layout.cellGap;
|
|
9568
|
-
const shadow =
|
|
9570
|
+
const shadow = chunkSKGJXCAO_cjs.resolveChartShadow(chart.shadowStyle);
|
|
9569
9571
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
9570
9572
|
const tileX = plot.x + tile.x + gap / 2;
|
|
9571
9573
|
const tileY = plot.y + tile.y + gap / 2;
|
|
@@ -9582,10 +9584,10 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
9582
9584
|
kind: "linear-gradient",
|
|
9583
9585
|
angle: 0,
|
|
9584
9586
|
stops: [
|
|
9585
|
-
{ offset: 0, color:
|
|
9586
|
-
{ offset: 100, color:
|
|
9587
|
+
{ offset: 0, color: chunkSKGJXCAO_cjs.representativeColor(color, fallback) },
|
|
9588
|
+
{ offset: 100, color: chunkSKGJXCAO_cjs.representativeColor(nextColor, fallback) }
|
|
9587
9589
|
]
|
|
9588
|
-
} :
|
|
9590
|
+
} : chunkSKGJXCAO_cjs.paint(color, diagnostics, chart.id);
|
|
9589
9591
|
return {
|
|
9590
9592
|
type: "rect",
|
|
9591
9593
|
id: `chart-treemap-tile-${chart.id}-${tile.item.leaf.id}`,
|
|
@@ -9599,7 +9601,7 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
9599
9601
|
style: {
|
|
9600
9602
|
fill: fill2,
|
|
9601
9603
|
stroke: { kind: "solid", color: chart.config?.tileStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
9602
|
-
strokeWidth:
|
|
9604
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.config?.tileStrokeWidth, chunkSKGJXCAO_cjs.finite(chart.gridWidth, 1)),
|
|
9603
9605
|
shadow,
|
|
9604
9606
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
9605
9607
|
}
|
|
@@ -9614,12 +9616,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
9614
9616
|
const height = Math.max(1, tile.height - gap - pad * 1.5);
|
|
9615
9617
|
const x = plot.x + tile.x + gap / 2 + pad;
|
|
9616
9618
|
const y = plot.y + tile.y + gap / 2 + pad * 0.75;
|
|
9617
|
-
const textColor = chart.config?.tileTextColor ??
|
|
9619
|
+
const textColor = chart.config?.tileTextColor ?? chunkSKGJXCAO_cjs.contrastTextColor(chunkSKGJXCAO_cjs.representativeColor(color, "#ffffff"));
|
|
9618
9620
|
const lineHeight = layout.labelSize * 1.2;
|
|
9619
9621
|
const maxLines = Math.max(1, Math.floor(height / lineHeight));
|
|
9620
|
-
const labelLines =
|
|
9622
|
+
const labelLines = chunkSKGJXCAO_cjs.wrapText(leaf.label, width, layout.labelSize).slice(0, maxLines).map((line) => chunkSKGJXCAO_cjs.ellipsizeToWidth(line, width, layout.labelSize, true));
|
|
9621
9623
|
const label = {
|
|
9622
|
-
...
|
|
9624
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
9623
9625
|
id: `chart-treemap-label-${chart.id}-${leaf.id}`,
|
|
9624
9626
|
order: nextOrder(),
|
|
9625
9627
|
bounds,
|
|
@@ -9633,12 +9635,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
9633
9635
|
color: textColor
|
|
9634
9636
|
};
|
|
9635
9637
|
const valueText = String(value);
|
|
9636
|
-
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 &&
|
|
9638
|
+
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 && chunkSKGJXCAO_cjs.estimateTextWidth(valueText, layout.valueSize, false) <= width;
|
|
9637
9639
|
if (chart.config?.showTileValues === false || !valueFits) {
|
|
9638
9640
|
return [label];
|
|
9639
9641
|
}
|
|
9640
9642
|
const valueNode = {
|
|
9641
|
-
...
|
|
9643
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
9642
9644
|
id: `chart-treemap-value-${chart.id}-${leaf.id}`,
|
|
9643
9645
|
order: nextOrder(),
|
|
9644
9646
|
bounds,
|
|
@@ -9715,7 +9717,7 @@ function buildCartesianChart(foundation) {
|
|
|
9715
9717
|
|
|
9716
9718
|
// src/renderScene/charts/chartFrame.ts
|
|
9717
9719
|
function scaleDetail(chart, plot) {
|
|
9718
|
-
const horizontal =
|
|
9720
|
+
const horizontal = chunkSKGJXCAO_cjs.isHorizontalBar(chart);
|
|
9719
9721
|
const range = horizontal ? `${plot.x},${plot.width}` : `${plot.y},${plot.height}`;
|
|
9720
9722
|
return {
|
|
9721
9723
|
of: "chartScale",
|
|
@@ -9723,7 +9725,7 @@ function scaleDetail(chart, plot) {
|
|
|
9723
9725
|
};
|
|
9724
9726
|
}
|
|
9725
9727
|
function pieDetail(chart, plot) {
|
|
9726
|
-
const { outerRadius, innerRadius, cornerRadius } =
|
|
9728
|
+
const { outerRadius, innerRadius, cornerRadius } = chunkSKGJXCAO_cjs.resolvePieRadii(
|
|
9727
9729
|
plot.width,
|
|
9728
9730
|
plot.height,
|
|
9729
9731
|
chart.config?.innerRadius,
|
|
@@ -9736,8 +9738,8 @@ function pieDetail(chart, plot) {
|
|
|
9736
9738
|
}
|
|
9737
9739
|
function polarAreaDetail(chart, plot) {
|
|
9738
9740
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
9739
|
-
const innerRadius = Math.max(0, Math.min(
|
|
9740
|
-
const cornerRadius = Math.max(0,
|
|
9741
|
+
const innerRadius = Math.max(0, Math.min(chunkSKGJXCAO_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1));
|
|
9742
|
+
const cornerRadius = Math.max(0, chunkSKGJXCAO_cjs.finite(chart.config?.pieCornerRadius, 0));
|
|
9741
9743
|
return {
|
|
9742
9744
|
of: "pieGeometry",
|
|
9743
9745
|
pieGeometry: `${plot.x + plot.width / 2},${plot.y + plot.height / 2},${maxRadius},${innerRadius},${cornerRadius}`
|
|
@@ -9746,8 +9748,8 @@ function polarAreaDetail(chart, plot) {
|
|
|
9746
9748
|
function radarDetail(chart, plot) {
|
|
9747
9749
|
const configuredCount = (chart.config?.categories?.filter(Boolean) ?? []).length;
|
|
9748
9750
|
const dataCount = Math.max(0, ...chart.series.map((series) => series.values.length));
|
|
9749
|
-
const count =
|
|
9750
|
-
const radius =
|
|
9751
|
+
const count = chunkSKGJXCAO_cjs.radarCategoryCount(configuredCount, dataCount);
|
|
9752
|
+
const radius = chunkSKGJXCAO_cjs.radarRadius(plot.width, plot.height, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12), chart.showAxisLabels !== false);
|
|
9751
9753
|
const centerX = plot.x + plot.width / 2;
|
|
9752
9754
|
const centerY = plot.y + plot.height / 2;
|
|
9753
9755
|
const curved = chart.chartType === "radial" ? 1 : 0;
|
|
@@ -9781,9 +9783,9 @@ function buildChartFrame(chart, bounds, plot, order) {
|
|
|
9781
9783
|
height: chart.height,
|
|
9782
9784
|
rx: chart.cornerRadius ?? 12,
|
|
9783
9785
|
style: {
|
|
9784
|
-
fill:
|
|
9786
|
+
fill: chunkSKGJXCAO_cjs.paint(chart.fillColor ?? "#ffffff", [], chart.id),
|
|
9785
9787
|
stroke: { kind: "solid", color: chart.strokeColor ?? "#475569" },
|
|
9786
|
-
strokeWidth:
|
|
9788
|
+
strokeWidth: chunkSKGJXCAO_cjs.finite(chart.strokeWidth, 1)
|
|
9787
9789
|
}
|
|
9788
9790
|
};
|
|
9789
9791
|
const detail = frameDetail(chart, plot);
|
|
@@ -9843,7 +9845,7 @@ function buildChartTitle(chart, bounds, plot, renderOrder) {
|
|
|
9843
9845
|
}
|
|
9844
9846
|
return [
|
|
9845
9847
|
{
|
|
9846
|
-
...
|
|
9848
|
+
...chunkSKGJXCAO_cjs.chartText({
|
|
9847
9849
|
id: `chart-title-${chart.id}`,
|
|
9848
9850
|
order: renderOrder.next(),
|
|
9849
9851
|
bounds,
|
|
@@ -9854,8 +9856,8 @@ function buildChartTitle(chart, bounds, plot, renderOrder) {
|
|
|
9854
9856
|
}),
|
|
9855
9857
|
...chart.titleColor ? { color: chart.titleColor } : {},
|
|
9856
9858
|
fontWeight: chart.titleWeight ?? "bold",
|
|
9857
|
-
fontSize:
|
|
9858
|
-
prop:
|
|
9859
|
+
fontSize: chunkSKGJXCAO_cjs.finite(chart.titleSize, Math.max(10, chunkSKGJXCAO_cjs.finite(chart.fontSize, 12)) + 2),
|
|
9860
|
+
prop: chunkSKGJXCAO_cjs.CHART_TITLE_PROP
|
|
9859
9861
|
}
|
|
9860
9862
|
];
|
|
9861
9863
|
}
|
|
@@ -9908,7 +9910,7 @@ function buildChart(chart, index, diagnostics) {
|
|
|
9908
9910
|
// src/renderScene/charts/artifacts.ts
|
|
9909
9911
|
function buildCharts(charts, diagnostics) {
|
|
9910
9912
|
return charts.flatMap(
|
|
9911
|
-
(chart, index) =>
|
|
9913
|
+
(chart, index) => chunkSKGJXCAO_cjs.tag(buildChart(chart, index, diagnostics), "chart", chart.id, chart.chartType, chart.title ?? "Chart")
|
|
9912
9914
|
);
|
|
9913
9915
|
}
|
|
9914
9916
|
|
|
@@ -10009,7 +10011,7 @@ function visibleBounds(node) {
|
|
|
10009
10011
|
}
|
|
10010
10012
|
function sceneBounds(nodes) {
|
|
10011
10013
|
if (!nodes.length) {
|
|
10012
|
-
return
|
|
10014
|
+
return chunkSKGJXCAO_cjs.EMPTY_BOUNDS;
|
|
10013
10015
|
}
|
|
10014
10016
|
const all = nodes.map(visibleBounds);
|
|
10015
10017
|
return {
|
|
@@ -10024,8 +10026,8 @@ function stackingOf(input) {
|
|
|
10024
10026
|
const add = (role, objects, legacyBase) => {
|
|
10025
10027
|
objects.forEach((object, index) => {
|
|
10026
10028
|
stacking.set(`${role}:${object.id}`, {
|
|
10027
|
-
rank:
|
|
10028
|
-
sequence:
|
|
10029
|
+
rank: chunkSKGJXCAO_cjs.stackRank(object),
|
|
10030
|
+
sequence: chunkSKGJXCAO_cjs.stackSequence(object, legacyBase + index)
|
|
10029
10031
|
});
|
|
10030
10032
|
});
|
|
10031
10033
|
};
|
|
@@ -10522,31 +10524,31 @@ function chartSeriesAttrs(detail) {
|
|
|
10522
10524
|
];
|
|
10523
10525
|
}
|
|
10524
10526
|
function frameBoundaryAttrs(detail) {
|
|
10525
|
-
return [`${
|
|
10527
|
+
return [`${chunkSKGJXCAO_cjs.CORNER_RADIUS_ATTR}="${num2(detail.cornerRadius)}"`, `${chunkSKGJXCAO_cjs.SQUARE_CORNER_ATTR}="${detail.squareCorner}"`];
|
|
10526
10528
|
}
|
|
10527
10529
|
function declaredBoundsAttr(bounds) {
|
|
10528
|
-
return `${
|
|
10530
|
+
return `${chunkSKGJXCAO_cjs.SYMBOL_BOUNDS_ATTR}="${num2(bounds.x)},${num2(bounds.y)},${num2(bounds.width)},${num2(bounds.height)}"`;
|
|
10529
10531
|
}
|
|
10530
10532
|
function symbolGeometryAttrs(detail) {
|
|
10531
10533
|
return [
|
|
10532
|
-
`${
|
|
10533
|
-
`${
|
|
10534
|
+
`${chunkSKGJXCAO_cjs.SYMBOL_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
10535
|
+
`${chunkSKGJXCAO_cjs.SYMBOL_TENSION_ATTR}="${num2(detail.tension)}"`,
|
|
10534
10536
|
declaredBoundsAttr(detail.declaredBounds)
|
|
10535
10537
|
];
|
|
10536
10538
|
}
|
|
10537
10539
|
function pathGeometryAttrs(detail) {
|
|
10538
10540
|
return [
|
|
10539
|
-
`${
|
|
10540
|
-
`${
|
|
10541
|
-
`${
|
|
10541
|
+
`${chunkSKGJXCAO_cjs.PATH_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
10542
|
+
`${chunkSKGJXCAO_cjs.PATH_TENSION_ATTR}="${num2(detail.tension)}"`,
|
|
10543
|
+
`${chunkSKGJXCAO_cjs.PATH_CLOSED_ATTR}="${detail.closed}"`
|
|
10542
10544
|
];
|
|
10543
10545
|
}
|
|
10544
10546
|
function isometricGeometryAttrs(detail) {
|
|
10545
10547
|
return [
|
|
10546
|
-
`${
|
|
10547
|
-
`${
|
|
10548
|
+
`${chunkSKGJXCAO_cjs.ISOMETRIC_SIZE_ATTR}="${num2(detail.width)},${num2(detail.height)},${num2(detail.depth)}"`,
|
|
10549
|
+
`${chunkSKGJXCAO_cjs.CORNER_RADIUS_ATTR}="${num2(detail.cornerRadius)}"`,
|
|
10548
10550
|
declaredBoundsAttr(detail.bounds),
|
|
10549
|
-
`${
|
|
10551
|
+
`${chunkSKGJXCAO_cjs.ISOMETRIC_LABEL_OFFSET_ATTR}="${num2(detail.labelOffsetX)},${num2(detail.labelOffsetY)}"`
|
|
10550
10552
|
];
|
|
10551
10553
|
}
|
|
10552
10554
|
function linkDetailAttrs(detail) {
|
|
@@ -10693,7 +10695,7 @@ function renderSvgDocument(scene, options = {}) {
|
|
|
10693
10695
|
const nodes = options.linkHitAreas ? withLinkHitAreas(scene.nodes) : scene.nodes;
|
|
10694
10696
|
const body = nodes.map((node) => nodeSvg(node, defs)).join("\n ");
|
|
10695
10697
|
const declaration = options.includeXmlDeclaration === false ? "" : '<?xml version="1.0" encoding="UTF-8"?>\n';
|
|
10696
|
-
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${num2(width)}px" height="${num2(height)}px" viewBox="${viewBox}" role="img" data-sf-contract="${
|
|
10698
|
+
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${num2(width)}px" height="${num2(height)}px" viewBox="${viewBox}" role="img" data-sf-contract="${chunkSKGJXCAO_cjs.DOM_CONTRACT_VERSION}">
|
|
10697
10699
|
<defs>${defs.entries.join("")}</defs>
|
|
10698
10700
|
${body}
|
|
10699
10701
|
</svg>`;
|
|
@@ -10713,9 +10715,9 @@ function renderCanvas(input, options = {}) {
|
|
|
10713
10715
|
}
|
|
10714
10716
|
var SCENE_CACHE_LIMIT = 50;
|
|
10715
10717
|
var sceneCache = /* @__PURE__ */ new Map();
|
|
10716
|
-
var cachedForRegistry =
|
|
10718
|
+
var cachedForRegistry = chunkSKGJXCAO_cjs.componentRegistryVersion();
|
|
10717
10719
|
function cachedRenderScene(source) {
|
|
10718
|
-
const registry =
|
|
10720
|
+
const registry = chunkSKGJXCAO_cjs.componentRegistryVersion();
|
|
10719
10721
|
if (registry !== cachedForRegistry) {
|
|
10720
10722
|
sceneCache.clear();
|
|
10721
10723
|
cachedForRegistry = registry;
|
|
@@ -10747,7 +10749,7 @@ function render(source, options = {}) {
|
|
|
10747
10749
|
var SCENE_ORDER_BASE = 1e4;
|
|
10748
10750
|
function defineComponent(definition) {
|
|
10749
10751
|
const { scene, ...descriptor } = definition;
|
|
10750
|
-
const unregisterDescriptor =
|
|
10752
|
+
const unregisterDescriptor = chunkSKGJXCAO_cjs.registerComponentDescriptor(descriptor);
|
|
10751
10753
|
const unregisterBuilder = registerComponentBuilder(
|
|
10752
10754
|
descriptor.type,
|
|
10753
10755
|
(component, index) => scene(component, { order: SCENE_ORDER_BASE + index })
|
|
@@ -10766,5 +10768,5 @@ exports.render = render;
|
|
|
10766
10768
|
exports.renderCanvas = renderCanvas;
|
|
10767
10769
|
exports.sflToRenderInput = sflToRenderInput;
|
|
10768
10770
|
exports.sliderReach = sliderReach;
|
|
10769
|
-
//# sourceMappingURL=chunk-
|
|
10770
|
-
//# sourceMappingURL=chunk-
|
|
10771
|
+
//# sourceMappingURL=chunk-PSC7G6NL.cjs.map
|
|
10772
|
+
//# sourceMappingURL=chunk-PSC7G6NL.cjs.map
|