stickyflow 0.7.0 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -0
- package/README.md +1 -1
- 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-OWNVXKXN.cjs → chunk-B3YRZVMR.cjs} +23 -23
- package/dist/chunk-B3YRZVMR.cjs.map +1 -0
- package/dist/{chunk-JCRPLPKV.js → chunk-BUVUJMWT.js} +5 -5
- package/dist/chunk-BUVUJMWT.js.map +1 -0
- package/dist/{chunk-ZNHYW47T.js → chunk-CM35H45Z.js} +3 -3
- package/dist/{chunk-ZNHYW47T.js.map → chunk-CM35H45Z.js.map} +1 -1
- package/dist/{chunk-JQK4IGXJ.js → chunk-D2266VBZ.js} +440 -8
- package/dist/chunk-D2266VBZ.js.map +1 -0
- package/dist/{chunk-SDMQRSRW.js → chunk-FS6L462E.js} +455 -136
- package/dist/chunk-FS6L462E.js.map +1 -0
- package/dist/{chunk-EKAWJFJQ.cjs → chunk-OUWGWDJ2.cjs} +15 -15
- package/dist/{chunk-EKAWJFJQ.cjs.map → chunk-OUWGWDJ2.cjs.map} +1 -1
- package/dist/{chunk-KXYSO6GC.cjs → chunk-QL7MNEMT.cjs} +444 -7
- package/dist/chunk-QL7MNEMT.cjs.map +1 -0
- package/dist/{chunk-BUOWM3LC.cjs → chunk-SQBF2BKT.cjs} +382 -73
- package/dist/chunk-SQBF2BKT.cjs.map +1 -0
- package/dist/{chunk-A73UJ5AQ.cjs → chunk-YSXD5IVZ.cjs} +1074 -755
- package/dist/chunk-YSXD5IVZ.cjs.map +1 -0
- package/dist/{chunk-MUKIGLR5.js → chunk-ZCGZJBAT.js} +353 -44
- package/dist/chunk-ZCGZJBAT.js.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 +268 -235
- 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 +44 -11
- package/dist/interaction/index.js.map +1 -1
- package/dist/{render-BU2uYzjG.d.cts → render-DU4lYbRl.d.cts} +29 -11
- package/dist/{render-BU2uYzjG.d.ts → render-DU4lYbRl.d.ts} +29 -11
- package/dist/{runtime-B7KiTmn8.d.cts → runtime-DG8X3Fwf.d.cts} +2 -2
- package/dist/{runtime-BPzyD-Nd.d.ts → runtime-kqD1RS17.d.ts} +2 -2
- package/dist/{runtimeTypes-DalvhScn.d.ts → runtimeTypes-CvjlBZds.d.cts} +7 -3
- package/dist/{runtimeTypes-BIP70z72.d.cts → runtimeTypes-vRaHOIHi.d.ts} +7 -3
- package/dist/stickyflow-diagram.global.js +294 -39
- package/dist/stickyflow-diagram.global.js.map +1 -1
- package/dist/{types-D_2NZ6lL.d.cts → types-B5jrEEcF.d.cts} +1 -1
- package/dist/{types-DMWs27Hn.d.ts → types-B7IkZ0w4.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-A73UJ5AQ.cjs.map +0 -1
- package/dist/chunk-BUOWM3LC.cjs.map +0 -1
- package/dist/chunk-JCRPLPKV.js.map +0 -1
- package/dist/chunk-JQK4IGXJ.js.map +0 -1
- package/dist/chunk-KXYSO6GC.cjs.map +0 -1
- package/dist/chunk-MUKIGLR5.js.map +0 -1
- package/dist/chunk-OWNVXKXN.cjs.map +0 -1
- package/dist/chunk-SDMQRSRW.js.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkQL7MNEMT_cjs = require('./chunk-QL7MNEMT.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-]*`;
|
|
@@ -163,6 +163,23 @@ var PATH_TYPES = ["straight", "curved", "orthogonal"];
|
|
|
163
163
|
function optionalOneOf(value, allowed) {
|
|
164
164
|
return value !== void 0 && allowed.includes(value) ? value : void 0;
|
|
165
165
|
}
|
|
166
|
+
var BLEND_MODES = [
|
|
167
|
+
"multiply",
|
|
168
|
+
"screen",
|
|
169
|
+
"overlay",
|
|
170
|
+
"darken",
|
|
171
|
+
"lighten",
|
|
172
|
+
"color-dodge",
|
|
173
|
+
"color-burn",
|
|
174
|
+
"hard-light",
|
|
175
|
+
"soft-light",
|
|
176
|
+
"difference",
|
|
177
|
+
"exclusion",
|
|
178
|
+
"hue",
|
|
179
|
+
"saturation",
|
|
180
|
+
"color",
|
|
181
|
+
"luminosity"
|
|
182
|
+
];
|
|
166
183
|
var SHAPE_STROKE_STYLES = ["solid", "dashed", "dotted", "double"];
|
|
167
184
|
var MARKER_TYPES = [
|
|
168
185
|
"none",
|
|
@@ -242,6 +259,14 @@ function axesOf(p) {
|
|
|
242
259
|
axisLineStyle: p.axisLineStyle === "dashed" || p.axisLineStyle === "dotted" ? p.axisLineStyle : void 0,
|
|
243
260
|
tickLength: numOf(p.tickLength),
|
|
244
261
|
axisFontSize: numOf(p.axisFontSize),
|
|
262
|
+
axisLabelAngle: numOf(p.axisLabelAngle),
|
|
263
|
+
axisLabelSpace: numOf(p.axisLabelSpace),
|
|
264
|
+
rowLabelSide: p.rowLabelSide === "left" || p.rowLabelSide === "right" ? p.rowLabelSide : void 0,
|
|
265
|
+
columnLabelSide: p.columnLabelSide === "top" || p.columnLabelSide === "bottom" ? p.columnLabelSide : void 0,
|
|
266
|
+
legendSide: p.legendSide === "top" || p.legendSide === "bottom" || p.legendSide === "left" || p.legendSide === "right" ? p.legendSide : void 0,
|
|
267
|
+
xLabelGap: numOf(p.xLabelGap),
|
|
268
|
+
yLabelGap: numOf(p.yLabelGap),
|
|
269
|
+
axisLabelAlign: p.axisLabelAlign === "left" || p.axisLabelAlign === "center" || p.axisLabelAlign === "right" ? p.axisLabelAlign : void 0,
|
|
245
270
|
axisFontFamily: p.axisFontFamily,
|
|
246
271
|
showValueAxis: p.showValueAxis !== "false",
|
|
247
272
|
categoryAlign: p.categoryAlign === "left" || p.categoryAlign === "inside" ? p.categoryAlign : void 0,
|
|
@@ -252,6 +277,7 @@ function textOf(p) {
|
|
|
252
277
|
return {
|
|
253
278
|
textColor: p.textColor ?? "#0f172a",
|
|
254
279
|
titleSize: numOf(p.titleSize),
|
|
280
|
+
titleAlign: p.titleAlign === "left" || p.titleAlign === "center" || p.titleAlign === "right" ? p.titleAlign : void 0,
|
|
255
281
|
titleWeight: p.titleWeight === "normal" ? "normal" : void 0,
|
|
256
282
|
titleColor: p.titleColor,
|
|
257
283
|
fontSize: numOf(p.fontSize) ?? 12,
|
|
@@ -261,6 +287,7 @@ function textOf(p) {
|
|
|
261
287
|
function legendOf(p) {
|
|
262
288
|
return {
|
|
263
289
|
legendColor: p.legendColor,
|
|
290
|
+
legendGap: numOf(p.legendGap),
|
|
264
291
|
showLegend: p.showLegend === "true",
|
|
265
292
|
legendPosition: legendPositionOf(p.legendPosition)
|
|
266
293
|
};
|
|
@@ -633,7 +660,7 @@ function readComponentValue(descriptor, raw) {
|
|
|
633
660
|
return raw;
|
|
634
661
|
}
|
|
635
662
|
function genericComponentObject(canvasObject) {
|
|
636
|
-
const descriptor =
|
|
663
|
+
const descriptor = chunkQL7MNEMT_cjs.getComponentDescriptor(canvasObject.component.type);
|
|
637
664
|
return {
|
|
638
665
|
id: canvasObject.id,
|
|
639
666
|
type: canvasObject.component.type,
|
|
@@ -822,7 +849,7 @@ var BUILT_IN_OBJECTS = {
|
|
|
822
849
|
};
|
|
823
850
|
function componentObject(canvasObject) {
|
|
824
851
|
const type = canvasObject.component.type;
|
|
825
|
-
return
|
|
852
|
+
return chunkQL7MNEMT_cjs.isBuiltInComponentType(type) ? BUILT_IN_OBJECTS[type](canvasObject) : genericComponentObject(canvasObject);
|
|
826
853
|
}
|
|
827
854
|
|
|
828
855
|
// src/renderInput/fromSfl/canvasObjects/connection.ts
|
|
@@ -888,6 +915,7 @@ function frameObject(e) {
|
|
|
888
915
|
showLabel: p.showLabel !== "false",
|
|
889
916
|
labelPosition: oneOf(p.labelPosition, LABEL_POSITIONS, "top"),
|
|
890
917
|
shadow: p.shadow !== "false",
|
|
918
|
+
clip: p.clip === "true" || void 0,
|
|
891
919
|
order: e.order,
|
|
892
920
|
sourceIndex: e.sourceIndex
|
|
893
921
|
};
|
|
@@ -915,6 +943,7 @@ function isometricObject(canvasObject) {
|
|
|
915
943
|
strokeColor: solidColor(presentation.stroke) ?? "#111827",
|
|
916
944
|
strokeWidth: numOf(presentation.strokeWidth) ?? 1,
|
|
917
945
|
cornerRadius: numOf(presentation.cornerRadius) ?? (canvasObject.isometric.footprint ? 0 : 8),
|
|
946
|
+
seams: presentation.seams === "false" ? false : void 0,
|
|
918
947
|
hasShadow: shadowStyle?.enabled ?? false,
|
|
919
948
|
shadowStyle,
|
|
920
949
|
labelOffsetX: numOf(presentation.labelOffsetX) ?? 0,
|
|
@@ -1019,6 +1048,8 @@ function shapeObject(e, shaders) {
|
|
|
1019
1048
|
dash: dashArray(p.dash),
|
|
1020
1049
|
strokeStyle: optionalOneOf(p.strokeStyle, SHAPE_STROKE_STYLES),
|
|
1021
1050
|
opacity: numOf(p.opacity),
|
|
1051
|
+
blur: numOf(p.blur),
|
|
1052
|
+
blend: optionalOneOf(p.blend, BLEND_MODES),
|
|
1022
1053
|
parentFrameId: e.parentFrameId,
|
|
1023
1054
|
order: e.order,
|
|
1024
1055
|
sourceIndex: e.sourceIndex,
|
|
@@ -1063,9 +1094,9 @@ function collectCanvasObjects(state) {
|
|
|
1063
1094
|
shapes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "shape").map((shape) => shapeObject(shape, shaders)),
|
|
1064
1095
|
frames: canvasObjects.filter((canvasObject) => canvasObject.objectType === "frame").map(frameObject),
|
|
1065
1096
|
swimlanes: canvasObjects.filter((canvasObject) => canvasObject.objectType === "swimlane").map(swimlaneObject),
|
|
1066
|
-
isometricObjects: canvasObjects.filter(
|
|
1097
|
+
isometricObjects: canvasObjects.filter(chunkQL7MNEMT_cjs.isIsometricObject).map(isometricObject),
|
|
1067
1098
|
paths: canvasObjects.filter((canvasObject) => canvasObject.objectType === "path").map(pathObject),
|
|
1068
|
-
dimensions: canvasObjects.filter(
|
|
1099
|
+
dimensions: canvasObjects.filter(chunkQL7MNEMT_cjs.isDimensionObject).map(dimensionObject),
|
|
1069
1100
|
charts: canvasObjects.filter((canvasObject) => canvasObject.objectType === "chart").map(chartObject),
|
|
1070
1101
|
components: canvasObjects.filter(
|
|
1071
1102
|
(canvasObject) => canvasObject.objectType === "component" && canvasObject.component !== void 0
|
|
@@ -1092,9 +1123,9 @@ function sidePoint(canvasObject, endpoint) {
|
|
|
1092
1123
|
function namedPortPoint(canvasObject, endpoint) {
|
|
1093
1124
|
const port = canvasObject.symbol?.ports?.find((candidate) => candidate.name === endpoint.port);
|
|
1094
1125
|
if (!port) {
|
|
1095
|
-
return
|
|
1126
|
+
return chunkQL7MNEMT_cjs.elementCenter(canvasObject);
|
|
1096
1127
|
}
|
|
1097
|
-
return
|
|
1128
|
+
return chunkQL7MNEMT_cjs.pointAtNormalizedPort(
|
|
1098
1129
|
{
|
|
1099
1130
|
x: canvasObject.x,
|
|
1100
1131
|
y: canvasObject.y,
|
|
@@ -1140,7 +1171,7 @@ function explicitAnchorPoint(canvasObject, endpoint) {
|
|
|
1140
1171
|
return null;
|
|
1141
1172
|
}
|
|
1142
1173
|
function automaticEndpointPoint(canvasObject, opposite) {
|
|
1143
|
-
return opposite ?
|
|
1174
|
+
return opposite ? chunkQL7MNEMT_cjs.edgePointToward(canvasObject, opposite) : chunkQL7MNEMT_cjs.elementCenter(canvasObject);
|
|
1144
1175
|
}
|
|
1145
1176
|
function findPositionedCanvasObject(canvasObjects, id) {
|
|
1146
1177
|
return canvasObjects.find((candidate) => candidate.id === id);
|
|
@@ -1158,7 +1189,7 @@ function positionedCanvasObjects(canvasObjects) {
|
|
|
1158
1189
|
];
|
|
1159
1190
|
}
|
|
1160
1191
|
function connectionEndpointPoint(object, face) {
|
|
1161
|
-
return object ?
|
|
1192
|
+
return object ? chunkQL7MNEMT_cjs.isometricFaceCenter(object, face) : { x: 0, y: 0 };
|
|
1162
1193
|
}
|
|
1163
1194
|
function isometricStackPosition(isometricObjects, id) {
|
|
1164
1195
|
const index = isometricObjects.findIndex((object2) => object2.id === id);
|
|
@@ -1173,8 +1204,8 @@ function connectionStack(isometricObjects, connection) {
|
|
|
1173
1204
|
return { order: connection.order, sourceIndex: connection.sourceIndex };
|
|
1174
1205
|
}
|
|
1175
1206
|
const behind = [
|
|
1176
|
-
|
|
1177
|
-
|
|
1207
|
+
chunkQL7MNEMT_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.fromFace) ? void 0 : isometricStackPosition(isometricObjects, connection.fromId),
|
|
1208
|
+
chunkQL7MNEMT_cjs.VISIBLE_ISOMETRIC_FACES.has(connection.toFace) ? void 0 : isometricStackPosition(isometricObjects, connection.toId)
|
|
1178
1209
|
].filter((position) => position !== void 0);
|
|
1179
1210
|
if (!behind.length) {
|
|
1180
1211
|
return { sourceIndex: connection.sourceIndex };
|
|
@@ -1216,7 +1247,7 @@ function createRenderInputLinks(canvasObjects) {
|
|
|
1216
1247
|
|
|
1217
1248
|
// src/renderInput/fromSfl/index.ts
|
|
1218
1249
|
function sflToRenderInput(sfl) {
|
|
1219
|
-
const state =
|
|
1250
|
+
const state = chunkQL7MNEMT_cjs.sflToCanvasState(sfl);
|
|
1220
1251
|
const canvasObjects = collectCanvasObjects(state);
|
|
1221
1252
|
return {
|
|
1222
1253
|
shapes: canvasObjects.shapes,
|
|
@@ -1235,13 +1266,13 @@ function sflToRenderInput(sfl) {
|
|
|
1235
1266
|
// src/renderScene/artifacts/component/placeholder.ts
|
|
1236
1267
|
var STROKE = "#94a3b8";
|
|
1237
1268
|
function buildPlaceholder(component, index) {
|
|
1238
|
-
const x =
|
|
1239
|
-
const y =
|
|
1240
|
-
const width = Math.max(0,
|
|
1241
|
-
const height = Math.max(0,
|
|
1242
|
-
const rotation =
|
|
1269
|
+
const x = chunkQL7MNEMT_cjs.finite(component.x, 0);
|
|
1270
|
+
const y = chunkQL7MNEMT_cjs.finite(component.y, 0);
|
|
1271
|
+
const width = Math.max(0, chunkQL7MNEMT_cjs.finite(component.width, 120));
|
|
1272
|
+
const height = Math.max(0, chunkQL7MNEMT_cjs.finite(component.height, 60));
|
|
1273
|
+
const rotation = chunkQL7MNEMT_cjs.finite(component.rotation, 0);
|
|
1243
1274
|
const order = 1e4 + index;
|
|
1244
|
-
const bounds =
|
|
1275
|
+
const bounds = chunkQL7MNEMT_cjs.rotatedBounds({ x, y, width, height }, rotation, 2);
|
|
1245
1276
|
return [
|
|
1246
1277
|
{
|
|
1247
1278
|
id: `widget-${component.id}`,
|
|
@@ -1266,7 +1297,7 @@ function buildPlaceholder(component, index) {
|
|
|
1266
1297
|
width,
|
|
1267
1298
|
height,
|
|
1268
1299
|
lines: [component.type],
|
|
1269
|
-
fontFamily:
|
|
1300
|
+
fontFamily: chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
1270
1301
|
fontSize: 12,
|
|
1271
1302
|
fontWeight: "normal",
|
|
1272
1303
|
color: STROKE,
|
|
@@ -1280,44 +1311,44 @@ function buildPlaceholder(component, index) {
|
|
|
1280
1311
|
|
|
1281
1312
|
// src/renderScene/artifacts/component/builtIn.ts
|
|
1282
1313
|
function buildRollingNumber(component, index) {
|
|
1283
|
-
const x =
|
|
1284
|
-
const y =
|
|
1285
|
-
const width = Math.max(0,
|
|
1286
|
-
const height = Math.max(0,
|
|
1287
|
-
const rotation =
|
|
1314
|
+
const x = chunkQL7MNEMT_cjs.finite(component.x, 0);
|
|
1315
|
+
const y = chunkQL7MNEMT_cjs.finite(component.y, 0);
|
|
1316
|
+
const width = Math.max(0, chunkQL7MNEMT_cjs.finite(component.width, 160));
|
|
1317
|
+
const height = Math.max(0, chunkQL7MNEMT_cjs.finite(component.height, 90));
|
|
1318
|
+
const rotation = chunkQL7MNEMT_cjs.finite(component.rotation, 0);
|
|
1288
1319
|
return [
|
|
1289
1320
|
{
|
|
1290
1321
|
id: `widget-${component.id}`,
|
|
1291
1322
|
type: "rolling-number",
|
|
1292
1323
|
order: 1e4 + index,
|
|
1293
|
-
bounds:
|
|
1324
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1294
1325
|
x,
|
|
1295
1326
|
y,
|
|
1296
1327
|
width,
|
|
1297
1328
|
height,
|
|
1298
1329
|
rotation,
|
|
1299
|
-
value:
|
|
1330
|
+
value: chunkQL7MNEMT_cjs.formatRollingNumber(component.value, component.digits),
|
|
1300
1331
|
digits: component.digits,
|
|
1301
|
-
duration: Math.max(0,
|
|
1332
|
+
duration: Math.max(0, chunkQL7MNEMT_cjs.finite(component.duration, 420)),
|
|
1302
1333
|
label: component.label,
|
|
1303
|
-
componentStyle:
|
|
1334
|
+
componentStyle: chunkQL7MNEMT_cjs.resolveRollingNumberStyle(component.style)
|
|
1304
1335
|
}
|
|
1305
1336
|
];
|
|
1306
1337
|
}
|
|
1307
1338
|
function buildTickScale(component, index) {
|
|
1308
|
-
const x =
|
|
1309
|
-
const y =
|
|
1310
|
-
const width = Math.max(0,
|
|
1311
|
-
const height = Math.max(0,
|
|
1312
|
-
const rotation =
|
|
1313
|
-
const max =
|
|
1314
|
-
const progress = Math.min(1, Math.max(0,
|
|
1339
|
+
const x = chunkQL7MNEMT_cjs.finite(component.x, 0);
|
|
1340
|
+
const y = chunkQL7MNEMT_cjs.finite(component.y, 0);
|
|
1341
|
+
const width = Math.max(0, chunkQL7MNEMT_cjs.finite(component.width, 200));
|
|
1342
|
+
const height = Math.max(0, chunkQL7MNEMT_cjs.finite(component.height, 200));
|
|
1343
|
+
const rotation = chunkQL7MNEMT_cjs.finite(component.rotation, 0);
|
|
1344
|
+
const max = chunkQL7MNEMT_cjs.finite(component.max, 100) || 100;
|
|
1345
|
+
const progress = Math.min(1, Math.max(0, chunkQL7MNEMT_cjs.finite(Number(component.value), 0) / max));
|
|
1315
1346
|
const nodes = [
|
|
1316
1347
|
{
|
|
1317
1348
|
id: `widget-${component.id}`,
|
|
1318
1349
|
type: "shader-surface",
|
|
1319
1350
|
order: 1e4 + index,
|
|
1320
|
-
bounds:
|
|
1351
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1321
1352
|
x,
|
|
1322
1353
|
y,
|
|
1323
1354
|
width,
|
|
@@ -1334,12 +1365,12 @@ function buildTickScale(component, index) {
|
|
|
1334
1365
|
}
|
|
1335
1366
|
function buildTickLabels(component, box) {
|
|
1336
1367
|
const labels = component.labels ?? {};
|
|
1337
|
-
const ticks2 = Math.max(1,
|
|
1338
|
-
const major = Math.max(1,
|
|
1339
|
-
const start =
|
|
1340
|
-
const sweep =
|
|
1341
|
-
const radius =
|
|
1342
|
-
const fontSize =
|
|
1368
|
+
const ticks2 = Math.max(1, chunkQL7MNEMT_cjs.finite(Number(component.parameters.ticks), 48));
|
|
1369
|
+
const major = Math.max(1, chunkQL7MNEMT_cjs.finite(Number(component.parameters.major), 5));
|
|
1370
|
+
const start = chunkQL7MNEMT_cjs.finite(Number(component.parameters.start), 225) * Math.PI / 180;
|
|
1371
|
+
const sweep = chunkQL7MNEMT_cjs.finite(Number(component.parameters.sweep), 270) * Math.PI / 180;
|
|
1372
|
+
const radius = chunkQL7MNEMT_cjs.finite(Number(component.parameters.radius), 0.9) + chunkQL7MNEMT_cjs.finite(labels.offset, 0.08);
|
|
1373
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(labels.size, 12);
|
|
1343
1374
|
const centerX = box.x + box.width / 2;
|
|
1344
1375
|
const centerY = box.y + box.height / 2;
|
|
1345
1376
|
const count = Math.floor(ticks2 / major);
|
|
@@ -1354,10 +1385,10 @@ function buildTickLabels(component, box) {
|
|
|
1354
1385
|
id: `widget-${component.id}-label-${step}`,
|
|
1355
1386
|
type: "text",
|
|
1356
1387
|
order: box.order + 0.1,
|
|
1357
|
-
bounds:
|
|
1388
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1358
1389
|
...labelBox,
|
|
1359
1390
|
lines: [String(Math.round(box.max * fraction * 10) / 10)],
|
|
1360
|
-
fontFamily: labels.fontFamily ||
|
|
1391
|
+
fontFamily: labels.fontFamily || chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
1361
1392
|
fontSize,
|
|
1362
1393
|
fontWeight: labels.weight ?? "normal",
|
|
1363
1394
|
color: labels.color || "#8f95c4",
|
|
@@ -1369,20 +1400,20 @@ function buildTickLabels(component, box) {
|
|
|
1369
1400
|
return nodes;
|
|
1370
1401
|
}
|
|
1371
1402
|
function buildRuler(component, index) {
|
|
1372
|
-
const x =
|
|
1373
|
-
const y =
|
|
1374
|
-
const width = Math.max(0,
|
|
1375
|
-
const height = Math.max(0,
|
|
1376
|
-
const rotation =
|
|
1377
|
-
const min =
|
|
1378
|
-
const max =
|
|
1379
|
-
const progress = max === min ? 0 : Math.min(1, Math.max(0, (
|
|
1403
|
+
const x = chunkQL7MNEMT_cjs.finite(component.x, 0);
|
|
1404
|
+
const y = chunkQL7MNEMT_cjs.finite(component.y, 0);
|
|
1405
|
+
const width = Math.max(0, chunkQL7MNEMT_cjs.finite(component.width, 120));
|
|
1406
|
+
const height = Math.max(0, chunkQL7MNEMT_cjs.finite(component.height, 360));
|
|
1407
|
+
const rotation = chunkQL7MNEMT_cjs.finite(component.rotation, 0);
|
|
1408
|
+
const min = chunkQL7MNEMT_cjs.finite(component.min, 0);
|
|
1409
|
+
const max = chunkQL7MNEMT_cjs.finite(component.max, 100);
|
|
1410
|
+
const progress = max === min ? 0 : Math.min(1, Math.max(0, (chunkQL7MNEMT_cjs.finite(Number(component.value), min) - min) / (max - min)));
|
|
1380
1411
|
const nodes = [
|
|
1381
1412
|
{
|
|
1382
1413
|
id: `widget-${component.id}`,
|
|
1383
1414
|
type: "shader-surface",
|
|
1384
1415
|
order: 1e4 + index,
|
|
1385
|
-
bounds:
|
|
1416
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x, y, width, height }, rotation, 2),
|
|
1386
1417
|
x,
|
|
1387
1418
|
y,
|
|
1388
1419
|
width,
|
|
@@ -1400,14 +1431,14 @@ function buildRuler(component, index) {
|
|
|
1400
1431
|
function buildRulerLabels(component, box) {
|
|
1401
1432
|
const labels = component.labels ?? {};
|
|
1402
1433
|
const horizontal = component.parameters.axis === "horizontal";
|
|
1403
|
-
const ticks2 = Math.max(1,
|
|
1404
|
-
const major = Math.max(1,
|
|
1405
|
-
const inset =
|
|
1406
|
-
const line =
|
|
1434
|
+
const ticks2 = Math.max(1, chunkQL7MNEMT_cjs.finite(Number(component.parameters.ticks), 50));
|
|
1435
|
+
const major = Math.max(1, chunkQL7MNEMT_cjs.finite(Number(component.parameters.major), 5));
|
|
1436
|
+
const inset = chunkQL7MNEMT_cjs.finite(Number(component.parameters.inset), 0.05) > 0 ? chunkQL7MNEMT_cjs.finite(Number(component.parameters.inset), 0.05) : 0.05;
|
|
1437
|
+
const line = chunkQL7MNEMT_cjs.finite(Number(component.parameters.line), 0.7) > 0 ? chunkQL7MNEMT_cjs.finite(Number(component.parameters.line), 0.7) : 0.7;
|
|
1407
1438
|
const across = horizontal ? box.height : box.width;
|
|
1408
|
-
const tickLength = (
|
|
1409
|
-
const edge = line * across - 0.12 * across - tickLength -
|
|
1410
|
-
const fontSize =
|
|
1439
|
+
const tickLength = (chunkQL7MNEMT_cjs.finite(Number(component.parameters.length), 0.1) > 0 ? chunkQL7MNEMT_cjs.finite(Number(component.parameters.length), 0.1) : 0.1) * across * 1.9;
|
|
1440
|
+
const edge = line * across - 0.12 * across - tickLength - chunkQL7MNEMT_cjs.finite(labels.offset, 0.04) * across;
|
|
1441
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(labels.size, 12);
|
|
1411
1442
|
const count = Math.floor(ticks2 / major);
|
|
1412
1443
|
const nodes = [];
|
|
1413
1444
|
for (let step = 0; step <= count; step += 1) {
|
|
@@ -1418,10 +1449,10 @@ function buildRulerLabels(component, box) {
|
|
|
1418
1449
|
id: `widget-${component.id}-label-${step}`,
|
|
1419
1450
|
type: "text",
|
|
1420
1451
|
order: box.order + 0.1,
|
|
1421
|
-
bounds:
|
|
1452
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(labelBox, 0, 2),
|
|
1422
1453
|
...labelBox,
|
|
1423
1454
|
lines: [String(Math.round((box.min + (box.max - box.min) * fraction) * 10) / 10)],
|
|
1424
|
-
fontFamily: labels.fontFamily ||
|
|
1455
|
+
fontFamily: labels.fontFamily || chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
1425
1456
|
fontSize,
|
|
1426
1457
|
fontWeight: labels.weight ?? "normal",
|
|
1427
1458
|
color: labels.color || "#8f95c4",
|
|
@@ -1437,10 +1468,10 @@ function buildRulerLabels(component, box) {
|
|
|
1437
1468
|
var DISABLED_INK = "#94a3b8";
|
|
1438
1469
|
function controlBox(component, index, fallback) {
|
|
1439
1470
|
return {
|
|
1440
|
-
x:
|
|
1441
|
-
y:
|
|
1442
|
-
width: Math.max(1,
|
|
1443
|
-
height: Math.max(1,
|
|
1471
|
+
x: chunkQL7MNEMT_cjs.finite(component.x, 0),
|
|
1472
|
+
y: chunkQL7MNEMT_cjs.finite(component.y, 0),
|
|
1473
|
+
width: Math.max(1, chunkQL7MNEMT_cjs.finite(component.width, fallback.width)),
|
|
1474
|
+
height: Math.max(1, chunkQL7MNEMT_cjs.finite(component.height, fallback.height)),
|
|
1444
1475
|
order: 1e4 + index
|
|
1445
1476
|
};
|
|
1446
1477
|
}
|
|
@@ -1458,7 +1489,7 @@ function hitArea(component, box) {
|
|
|
1458
1489
|
id: `widget-${component.id}`,
|
|
1459
1490
|
type: "rect",
|
|
1460
1491
|
order: box.order,
|
|
1461
|
-
bounds:
|
|
1492
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(box, 0, 0),
|
|
1462
1493
|
x: box.x,
|
|
1463
1494
|
y: box.y,
|
|
1464
1495
|
width: box.width,
|
|
@@ -1471,13 +1502,13 @@ function labelText(component, part, area, label, order) {
|
|
|
1471
1502
|
id: `widget-${component.id}-${part}`,
|
|
1472
1503
|
type: "text",
|
|
1473
1504
|
order,
|
|
1474
|
-
bounds:
|
|
1505
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(area, 0, 0),
|
|
1475
1506
|
x: area.x,
|
|
1476
1507
|
y: area.y,
|
|
1477
1508
|
width: area.width,
|
|
1478
1509
|
height: area.height,
|
|
1479
1510
|
lines: [label.text],
|
|
1480
|
-
fontFamily:
|
|
1511
|
+
fontFamily: chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
1481
1512
|
fontSize: label.fontSize,
|
|
1482
1513
|
fontWeight: "600",
|
|
1483
1514
|
color: label.color,
|
|
@@ -1496,7 +1527,7 @@ function buildButton(component, index) {
|
|
|
1496
1527
|
id: `widget-${component.id}-face`,
|
|
1497
1528
|
type: "rect",
|
|
1498
1529
|
order: box.order + 0.1,
|
|
1499
|
-
bounds:
|
|
1530
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(box, 0, 0),
|
|
1500
1531
|
x: box.x,
|
|
1501
1532
|
y: box.y,
|
|
1502
1533
|
width: box.width,
|
|
@@ -1535,7 +1566,7 @@ function boxNode(component, box, square) {
|
|
|
1535
1566
|
id: `widget-${component.id}-box`,
|
|
1536
1567
|
type: "rect",
|
|
1537
1568
|
order: box.order + 0.1,
|
|
1538
|
-
bounds:
|
|
1569
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(square, 0, 2),
|
|
1539
1570
|
...square,
|
|
1540
1571
|
rx: square.width * CORNER_RATIO,
|
|
1541
1572
|
style: fade(component, {
|
|
@@ -1550,7 +1581,7 @@ function checkNode(component, box, square) {
|
|
|
1550
1581
|
id: `widget-${component.id}-check`,
|
|
1551
1582
|
type: "path",
|
|
1552
1583
|
order: box.order + 0.2,
|
|
1553
|
-
bounds:
|
|
1584
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(square, 0, 0),
|
|
1554
1585
|
d: checkPath(square),
|
|
1555
1586
|
style: fade(component, {
|
|
1556
1587
|
fill: { kind: "none" },
|
|
@@ -1614,7 +1645,7 @@ function buildKnob(component, index) {
|
|
|
1614
1645
|
id: `widget-${component.id}-${part}`,
|
|
1615
1646
|
type: "ellipse",
|
|
1616
1647
|
order: box.order + order,
|
|
1617
|
-
bounds:
|
|
1648
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
1618
1649
|
cx,
|
|
1619
1650
|
cy,
|
|
1620
1651
|
rx: radius,
|
|
@@ -1641,7 +1672,7 @@ function buildKnob(component, index) {
|
|
|
1641
1672
|
id: `widget-${component.id}-face`,
|
|
1642
1673
|
type: "ellipse",
|
|
1643
1674
|
order: box.order + 0.3,
|
|
1644
|
-
bounds:
|
|
1675
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(
|
|
1645
1676
|
{ x: cx - faceRadius, y: cy - faceRadius, width: faceRadius * 2, height: faceRadius * 2 },
|
|
1646
1677
|
0,
|
|
1647
1678
|
0
|
|
@@ -1656,7 +1687,7 @@ function buildKnob(component, index) {
|
|
|
1656
1687
|
id: `widget-${component.id}-dot`,
|
|
1657
1688
|
type: "ellipse",
|
|
1658
1689
|
order: box.order + 0.4,
|
|
1659
|
-
bounds:
|
|
1690
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(
|
|
1660
1691
|
{
|
|
1661
1692
|
x: cx + radius * Math.cos(angle) - dotRadius,
|
|
1662
1693
|
y: cy - radius * Math.sin(angle) - dotRadius,
|
|
@@ -1719,7 +1750,7 @@ function buildProgress(component, index) {
|
|
|
1719
1750
|
id: `widget-${component.id}-${part}`,
|
|
1720
1751
|
type: "ellipse",
|
|
1721
1752
|
order: box.order + order,
|
|
1722
|
-
bounds:
|
|
1753
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, thickness),
|
|
1723
1754
|
cx,
|
|
1724
1755
|
cy,
|
|
1725
1756
|
rx: radius,
|
|
@@ -1744,7 +1775,7 @@ function buildProgress(component, index) {
|
|
|
1744
1775
|
id: `widget-${component.id}-${part}`,
|
|
1745
1776
|
type: "rect",
|
|
1746
1777
|
order: box.order + order,
|
|
1747
|
-
bounds:
|
|
1778
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(shape, 0, 0),
|
|
1748
1779
|
...shape,
|
|
1749
1780
|
rx: radius,
|
|
1750
1781
|
style: fade(component, {
|
|
@@ -1787,7 +1818,7 @@ function buildSegmented(component, index) {
|
|
|
1787
1818
|
id: `widget-${component.id}-track`,
|
|
1788
1819
|
type: "rect",
|
|
1789
1820
|
order: box.order + 0.1,
|
|
1790
|
-
bounds:
|
|
1821
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(box, 0, 0),
|
|
1791
1822
|
x: box.x,
|
|
1792
1823
|
y: box.y,
|
|
1793
1824
|
width: box.width,
|
|
@@ -1799,7 +1830,7 @@ function buildSegmented(component, index) {
|
|
|
1799
1830
|
id: `widget-${component.id}-active`,
|
|
1800
1831
|
type: "rect",
|
|
1801
1832
|
order: box.order + 0.2,
|
|
1802
|
-
bounds:
|
|
1833
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x: box.x + inset + active * cellWidth, width: cellWidth, ...cell }, 0, 0),
|
|
1803
1834
|
x: box.x + inset + active * cellWidth,
|
|
1804
1835
|
y: cell.y,
|
|
1805
1836
|
width: cellWidth,
|
|
@@ -1851,7 +1882,7 @@ var rect = (component, box, part, order, shape, color, extra = {}) => ({
|
|
|
1851
1882
|
id: `widget-${component.id}-${part}`,
|
|
1852
1883
|
type: "rect",
|
|
1853
1884
|
order: box.order + order,
|
|
1854
|
-
bounds:
|
|
1885
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(shape, 0, 0),
|
|
1855
1886
|
...shape,
|
|
1856
1887
|
style: fade(component, { fill: solid(color), stroke: { kind: "none" }, ...extra })
|
|
1857
1888
|
});
|
|
@@ -1904,7 +1935,7 @@ function buildLine(component, box, thumbs, vertical) {
|
|
|
1904
1935
|
id: `widget-${component.id}-${part}`,
|
|
1905
1936
|
type: "ellipse",
|
|
1906
1937
|
order: box.order + order,
|
|
1907
|
-
bounds:
|
|
1938
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x: cx - radius, y: cy - radius, width: radius * 2, height: radius * 2 }, 0, 0),
|
|
1908
1939
|
cx,
|
|
1909
1940
|
cy,
|
|
1910
1941
|
rx: radius,
|
|
@@ -2056,7 +2087,7 @@ function buildSwitch(component, index) {
|
|
|
2056
2087
|
id: `widget-${component.id}-track`,
|
|
2057
2088
|
type: "rect",
|
|
2058
2089
|
order: box.order + 0.1,
|
|
2059
|
-
bounds:
|
|
2090
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(box, 0, 0),
|
|
2060
2091
|
x: box.x,
|
|
2061
2092
|
y: box.y,
|
|
2062
2093
|
width: box.width,
|
|
@@ -2071,7 +2102,7 @@ function buildSwitch(component, index) {
|
|
|
2071
2102
|
id: `widget-${component.id}-thumb`,
|
|
2072
2103
|
type: "ellipse",
|
|
2073
2104
|
order: box.order + 0.2,
|
|
2074
|
-
bounds:
|
|
2105
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(thumb, 0, 0),
|
|
2075
2106
|
cx: centerX,
|
|
2076
2107
|
cy: box.y + box.height / 2,
|
|
2077
2108
|
rx: radius,
|
|
@@ -2095,7 +2126,7 @@ function buildToggleButton(component, index) {
|
|
|
2095
2126
|
id: `widget-${component.id}-face`,
|
|
2096
2127
|
type: "rect",
|
|
2097
2128
|
order: box.order + 0.1,
|
|
2098
|
-
bounds:
|
|
2129
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(box, 0, 2),
|
|
2099
2130
|
x: box.x,
|
|
2100
2131
|
y: box.y,
|
|
2101
2132
|
width: box.width,
|
|
@@ -2150,8 +2181,8 @@ function getComponentBuilder(type) {
|
|
|
2150
2181
|
|
|
2151
2182
|
// src/renderScene/artifacts/component/build.ts
|
|
2152
2183
|
function ariaOf(component) {
|
|
2153
|
-
const role =
|
|
2154
|
-
if (!role || !
|
|
2184
|
+
const role = chunkQL7MNEMT_cjs.getComponentDescriptor(component.type)?.role;
|
|
2185
|
+
if (!role || !chunkQL7MNEMT_cjs.isGenericComponent(component)) {
|
|
2155
2186
|
return void 0;
|
|
2156
2187
|
}
|
|
2157
2188
|
const flag = typeof component.value === "boolean" ? component.value : void 0;
|
|
@@ -2162,12 +2193,12 @@ function ariaOf(component) {
|
|
|
2162
2193
|
};
|
|
2163
2194
|
}
|
|
2164
2195
|
function labelOf(component) {
|
|
2165
|
-
return component.label ?? (
|
|
2196
|
+
return component.label ?? (chunkQL7MNEMT_cjs.isGenericComponent(component) ? component.id : String(component.value));
|
|
2166
2197
|
}
|
|
2167
2198
|
function buildComponents(components) {
|
|
2168
2199
|
return components.flatMap((component, index) => {
|
|
2169
2200
|
const build = getComponentBuilder(component.type) ?? buildPlaceholder;
|
|
2170
|
-
const nodes =
|
|
2201
|
+
const nodes = chunkQL7MNEMT_cjs.tag(
|
|
2171
2202
|
build(component, index),
|
|
2172
2203
|
"widget",
|
|
2173
2204
|
component.id,
|
|
@@ -2207,13 +2238,13 @@ function tabBox(input, thickness, length) {
|
|
|
2207
2238
|
y,
|
|
2208
2239
|
width: length,
|
|
2209
2240
|
height: thickness,
|
|
2210
|
-
path:
|
|
2241
|
+
path: chunkQL7MNEMT_cjs.bottomRoundedRectPath(x, y, length, thickness, TAB_RADIUS)
|
|
2211
2242
|
};
|
|
2212
2243
|
}
|
|
2213
2244
|
case "left": {
|
|
2214
2245
|
const x = input.x - thickness;
|
|
2215
2246
|
const y = input.y - inset;
|
|
2216
|
-
return { x, y, width: thickness, height: length, path:
|
|
2247
|
+
return { x, y, width: thickness, height: length, path: chunkQL7MNEMT_cjs.leftRoundedRectPath(x, y, thickness, length, TAB_RADIUS) };
|
|
2217
2248
|
}
|
|
2218
2249
|
case "right": {
|
|
2219
2250
|
const x = input.x + input.width;
|
|
@@ -2223,13 +2254,13 @@ function tabBox(input, thickness, length) {
|
|
|
2223
2254
|
y,
|
|
2224
2255
|
width: thickness,
|
|
2225
2256
|
height: length,
|
|
2226
|
-
path:
|
|
2257
|
+
path: chunkQL7MNEMT_cjs.rightRoundedRectPath(x, y, thickness, length, TAB_RADIUS)
|
|
2227
2258
|
};
|
|
2228
2259
|
}
|
|
2229
2260
|
default: {
|
|
2230
2261
|
const x = input.x - inset;
|
|
2231
2262
|
const y = input.y - thickness;
|
|
2232
|
-
return { x, y, width: length, height: thickness, path:
|
|
2263
|
+
return { x, y, width: length, height: thickness, path: chunkQL7MNEMT_cjs.topRoundedRectPath(x, y, length, thickness, TAB_RADIUS) };
|
|
2233
2264
|
}
|
|
2234
2265
|
}
|
|
2235
2266
|
}
|
|
@@ -2238,7 +2269,7 @@ function renderTitleTab(input) {
|
|
|
2238
2269
|
const padding = 16;
|
|
2239
2270
|
const length = Math.max(120, input.title.length * input.fontSize * 0.62 + padding * 2);
|
|
2240
2271
|
const box = tabBox(input, thickness, length);
|
|
2241
|
-
const bounds =
|
|
2272
|
+
const bounds = chunkQL7MNEMT_cjs.boxBounds(box, 6);
|
|
2242
2273
|
const vertical = input.labelPosition === "left" || input.labelPosition === "right";
|
|
2243
2274
|
return [
|
|
2244
2275
|
{
|
|
@@ -2266,7 +2297,7 @@ function horizontalTitleText(input, box, padding, bounds) {
|
|
|
2266
2297
|
width: Math.max(0, box.width - padding * 2),
|
|
2267
2298
|
height: box.height,
|
|
2268
2299
|
lines: [input.title],
|
|
2269
|
-
fontFamily: input.fontFamily ??
|
|
2300
|
+
fontFamily: input.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
2270
2301
|
fontSize: input.fontSize,
|
|
2271
2302
|
fontWeight: input.fontWeight,
|
|
2272
2303
|
color: input.textColor,
|
|
@@ -2290,7 +2321,7 @@ function verticalTitleText(input, box, padding, bounds) {
|
|
|
2290
2321
|
width: textLength,
|
|
2291
2322
|
height: textThickness,
|
|
2292
2323
|
lines: [input.title],
|
|
2293
|
-
fontFamily: input.fontFamily ??
|
|
2324
|
+
fontFamily: input.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
2294
2325
|
fontSize: input.fontSize,
|
|
2295
2326
|
fontWeight: input.fontWeight,
|
|
2296
2327
|
color: input.textColor,
|
|
@@ -2311,7 +2342,7 @@ var SQUARED_CORNER_BY_LABEL_POSITION = {
|
|
|
2311
2342
|
};
|
|
2312
2343
|
function frameBoundaryNode(frame, order, hasTab) {
|
|
2313
2344
|
const shadow = frame.shadow ?? true;
|
|
2314
|
-
const bounds =
|
|
2345
|
+
const bounds = chunkQL7MNEMT_cjs.boxBounds(
|
|
2315
2346
|
{ x: frame.x, y: frame.y, width: frame.width, height: frame.height },
|
|
2316
2347
|
frame.strokeWidth + (shadow ? 20 : 4)
|
|
2317
2348
|
);
|
|
@@ -2346,7 +2377,7 @@ function frameBoundaryNode(frame, order, hasTab) {
|
|
|
2346
2377
|
id: `frame-${frame.id}`,
|
|
2347
2378
|
order,
|
|
2348
2379
|
bounds,
|
|
2349
|
-
d:
|
|
2380
|
+
d: chunkQL7MNEMT_cjs.cornersRoundedRectPath(frame.x, frame.y, frame.width, frame.height, radii),
|
|
2350
2381
|
detail: { of: "frameBoundary", cornerRadius: frame.cornerRadius, squareCorner: squared },
|
|
2351
2382
|
style
|
|
2352
2383
|
};
|
|
@@ -2435,7 +2466,7 @@ function labelBase(context, lane, index) {
|
|
|
2435
2466
|
id: `swimlane-label-${context.swimlane.id}-${lane.id}`,
|
|
2436
2467
|
order: context.order + 0.5 + index / 100,
|
|
2437
2468
|
lines: [lane.label],
|
|
2438
|
-
fontFamily: context.swimlane.fontFamily ??
|
|
2469
|
+
fontFamily: context.swimlane.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
2439
2470
|
fontSize: context.swimlane.fontSize,
|
|
2440
2471
|
fontWeight: context.swimlane.fontWeight,
|
|
2441
2472
|
color: context.swimlane.textColor,
|
|
@@ -2451,7 +2482,7 @@ function horizontalLabel(context, lane, index) {
|
|
|
2451
2482
|
const y = centerY - thickness / 2;
|
|
2452
2483
|
return {
|
|
2453
2484
|
...labelBase(context, lane, index),
|
|
2454
|
-
bounds:
|
|
2485
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x, y, width, height: thickness }, -90, 12),
|
|
2455
2486
|
x,
|
|
2456
2487
|
y,
|
|
2457
2488
|
width,
|
|
@@ -2503,7 +2534,7 @@ function createSwimlaneRenderContext(swimlane, index) {
|
|
|
2503
2534
|
return {
|
|
2504
2535
|
swimlane,
|
|
2505
2536
|
order: 5e3 + index,
|
|
2506
|
-
bounds:
|
|
2537
|
+
bounds: chunkQL7MNEMT_cjs.boxBounds(
|
|
2507
2538
|
{ x: swimlane.x, y: swimlane.y, width: swimlane.width, height: swimlane.height },
|
|
2508
2539
|
swimlane.strokeWidth + 4
|
|
2509
2540
|
),
|
|
@@ -2542,9 +2573,9 @@ function buildSwimlane(swimlane, index) {
|
|
|
2542
2573
|
function buildContainers(input) {
|
|
2543
2574
|
return [
|
|
2544
2575
|
...input.frames.flatMap(
|
|
2545
|
-
(frame, index) =>
|
|
2576
|
+
(frame, index) => chunkQL7MNEMT_cjs.tag(buildFrame(frame, index), "frame", frame.id, void 0, frame.title ?? void 0)
|
|
2546
2577
|
),
|
|
2547
|
-
...input.swimlanes.flatMap((swimlane, index) =>
|
|
2578
|
+
...input.swimlanes.flatMap((swimlane, index) => chunkQL7MNEMT_cjs.tag(buildSwimlane(swimlane, index), "swimlane", swimlane.id))
|
|
2548
2579
|
];
|
|
2549
2580
|
}
|
|
2550
2581
|
|
|
@@ -2594,7 +2625,7 @@ var DEFAULT_COLOR = "#475569";
|
|
|
2594
2625
|
var CHAR_WIDTH = 0.6;
|
|
2595
2626
|
var pathData = (segments) => segments.map(([from, to]) => `M ${from.x} ${from.y} L ${to.x} ${to.y}`).join(" ");
|
|
2596
2627
|
function pathNode(dimension, name, order, segments) {
|
|
2597
|
-
const strokeWidth = Math.max(0,
|
|
2628
|
+
const strokeWidth = Math.max(0, chunkQL7MNEMT_cjs.finite(dimension.strokeWidth, 1));
|
|
2598
2629
|
const points = segments.flat();
|
|
2599
2630
|
return {
|
|
2600
2631
|
type: "path",
|
|
@@ -2616,7 +2647,7 @@ function pathNode(dimension, name, order, segments) {
|
|
|
2616
2647
|
};
|
|
2617
2648
|
}
|
|
2618
2649
|
function labelNode2(dimension, order, text, center, angle) {
|
|
2619
|
-
const fontSize =
|
|
2650
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(dimension.fontSize, 11);
|
|
2620
2651
|
const width = Math.max(24, text.length * fontSize * CHAR_WIDTH + 8);
|
|
2621
2652
|
const height = fontSize * 1.3;
|
|
2622
2653
|
return {
|
|
@@ -2634,7 +2665,7 @@ function labelNode2(dimension, order, text, center, angle) {
|
|
|
2634
2665
|
width,
|
|
2635
2666
|
height,
|
|
2636
2667
|
lines: [text],
|
|
2637
|
-
fontFamily:
|
|
2668
|
+
fontFamily: chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
2638
2669
|
fontSize,
|
|
2639
2670
|
fontWeight: "normal",
|
|
2640
2671
|
color: dimension.textColor ?? dimension.strokeColor ?? DEFAULT_COLOR,
|
|
@@ -2659,7 +2690,7 @@ function buildDimension(dimension, index) {
|
|
|
2659
2690
|
}
|
|
2660
2691
|
function buildDimensions(dimensions) {
|
|
2661
2692
|
return dimensions.flatMap(
|
|
2662
|
-
(dimension, index) =>
|
|
2693
|
+
(dimension, index) => chunkQL7MNEMT_cjs.tag(
|
|
2663
2694
|
buildDimension(dimension, index),
|
|
2664
2695
|
"dimension",
|
|
2665
2696
|
dimension.id,
|
|
@@ -2673,9 +2704,9 @@ function buildDimensions(dimensions) {
|
|
|
2673
2704
|
// src/renderScene/artifacts/isometric/context.ts
|
|
2674
2705
|
var FILL_PROP = { prop: "style.fill", propKind: "color", propSolidOnly: true };
|
|
2675
2706
|
function isometricContext(object, index) {
|
|
2676
|
-
const strokeWidth = Math.max(0,
|
|
2677
|
-
const rotation =
|
|
2678
|
-
const box =
|
|
2707
|
+
const strokeWidth = Math.max(0, chunkQL7MNEMT_cjs.finite(object.strokeWidth, 1));
|
|
2708
|
+
const rotation = chunkQL7MNEMT_cjs.finite(object.rotation, 0);
|
|
2709
|
+
const box = chunkQL7MNEMT_cjs.isometricBounds(object);
|
|
2679
2710
|
const rotationCenter = { x: box.x + box.width / 2, y: box.y + box.height / 2 };
|
|
2680
2711
|
return {
|
|
2681
2712
|
object,
|
|
@@ -2687,7 +2718,7 @@ function isometricContext(object, index) {
|
|
|
2687
2718
|
strokeWidth,
|
|
2688
2719
|
common: {
|
|
2689
2720
|
type: "path",
|
|
2690
|
-
bounds:
|
|
2721
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(box, rotation, strokeWidth + 2),
|
|
2691
2722
|
rotation,
|
|
2692
2723
|
rotationCenter,
|
|
2693
2724
|
style: {
|
|
@@ -2703,13 +2734,13 @@ function faceNode(context, name, offset, points, style) {
|
|
|
2703
2734
|
...context.common,
|
|
2704
2735
|
id: `isometric-${context.object.id}-${name}`,
|
|
2705
2736
|
order: context.order + offset,
|
|
2706
|
-
d:
|
|
2737
|
+
d: chunkQL7MNEMT_cjs.roundedPolygonPath([...points], 0),
|
|
2707
2738
|
style,
|
|
2708
2739
|
...FILL_PROP
|
|
2709
2740
|
};
|
|
2710
2741
|
}
|
|
2711
2742
|
function silhouette(object) {
|
|
2712
|
-
const faces =
|
|
2743
|
+
const faces = chunkQL7MNEMT_cjs.isometricFaces(object);
|
|
2713
2744
|
return [faces.top[0], faces.top[1], faces.right[2], faces.front[2], faces.front[3], faces.top[3]];
|
|
2714
2745
|
}
|
|
2715
2746
|
function hullNode(context, hullPath, cornerRadius) {
|
|
@@ -2726,15 +2757,15 @@ function hullNode(context, hullPath, cornerRadius) {
|
|
|
2726
2757
|
depth: Math.max(0, object.depth),
|
|
2727
2758
|
cornerRadius,
|
|
2728
2759
|
bounds: box,
|
|
2729
|
-
labelOffsetX:
|
|
2730
|
-
labelOffsetY:
|
|
2760
|
+
labelOffsetX: chunkQL7MNEMT_cjs.finite(object.labelOffsetX, 0),
|
|
2761
|
+
labelOffsetY: chunkQL7MNEMT_cjs.finite(object.labelOffsetY, 0)
|
|
2731
2762
|
},
|
|
2732
2763
|
style: { ...common.style, fill: { kind: "none" } }
|
|
2733
2764
|
};
|
|
2734
2765
|
}
|
|
2735
2766
|
function unseenHullNode(context) {
|
|
2736
2767
|
return {
|
|
2737
|
-
...hullNode(context,
|
|
2768
|
+
...hullNode(context, chunkQL7MNEMT_cjs.roundedPolygonPath(silhouette(context.object), 0), 0),
|
|
2738
2769
|
style: { ...context.common.style, fill: { kind: "none" }, stroke: { kind: "none" } }
|
|
2739
2770
|
};
|
|
2740
2771
|
}
|
|
@@ -2747,9 +2778,9 @@ var LABEL_PADDING_Y = 3;
|
|
|
2747
2778
|
var LABEL_CHAR_WIDTH = 6.5;
|
|
2748
2779
|
function labelPlacement(context) {
|
|
2749
2780
|
const { object } = context;
|
|
2750
|
-
const anchor =
|
|
2751
|
-
const bottomY = anchor.y - LABEL_GAP +
|
|
2752
|
-
return { anchor, centerX: anchor.x +
|
|
2781
|
+
const anchor = chunkQL7MNEMT_cjs.isometricTopFaceCenter(object);
|
|
2782
|
+
const bottomY = anchor.y - LABEL_GAP + chunkQL7MNEMT_cjs.finite(object.labelOffsetY, 0);
|
|
2783
|
+
return { anchor, centerX: anchor.x + chunkQL7MNEMT_cjs.finite(object.labelOffsetX, 0), topY: bottomY - LABEL_HEIGHT, bottomY };
|
|
2753
2784
|
}
|
|
2754
2785
|
function labelTextNode(context, placement, text) {
|
|
2755
2786
|
const { object, order, rotation, rotationCenter, box } = context;
|
|
@@ -2764,7 +2795,7 @@ function labelTextNode(context, placement, text) {
|
|
|
2764
2795
|
width: box.width,
|
|
2765
2796
|
height: LABEL_HEIGHT,
|
|
2766
2797
|
lines: [text],
|
|
2767
|
-
fontFamily:
|
|
2798
|
+
fontFamily: chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
2768
2799
|
fontSize: 12,
|
|
2769
2800
|
fontWeight: "normal",
|
|
2770
2801
|
color: "#111827",
|
|
@@ -2844,7 +2875,7 @@ function groundShadowNode(context, topOutline) {
|
|
|
2844
2875
|
}
|
|
2845
2876
|
const height = Math.max(0, object.height);
|
|
2846
2877
|
const heightFactor = 0.6 + Math.min(1, height / 150) * 0.7;
|
|
2847
|
-
const shadowDrop = height +
|
|
2878
|
+
const shadowDrop = height + chunkQL7MNEMT_cjs.finite(object.shadowStyle?.distance, 0);
|
|
2848
2879
|
const contactFootprint = topOutline.map((point) => ({ x: point.x, y: point.y + shadowDrop }));
|
|
2849
2880
|
const footprintCenter = {
|
|
2850
2881
|
x: contactFootprint.reduce((sum, point) => sum + point.x, 0) / contactFootprint.length,
|
|
@@ -2867,14 +2898,14 @@ function groundShadowNode(context, topOutline) {
|
|
|
2867
2898
|
maxX: Math.max(...footprintXs),
|
|
2868
2899
|
maxY: Math.max(...footprintYs)
|
|
2869
2900
|
},
|
|
2870
|
-
d:
|
|
2901
|
+
d: chunkQL7MNEMT_cjs.roundedPolygonPath(footprint, 0),
|
|
2871
2902
|
rotation,
|
|
2872
2903
|
rotationCenter,
|
|
2873
2904
|
style: {
|
|
2874
2905
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
2875
2906
|
stroke: { kind: "none" },
|
|
2876
2907
|
opacity: Math.min(1, (object.shadowStyle?.opacity ?? 0.18) * heightFactor),
|
|
2877
|
-
blur:
|
|
2908
|
+
blur: chunkQL7MNEMT_cjs.finite(object.shadowStyle?.blur, 8),
|
|
2878
2909
|
pointerEvents: "none"
|
|
2879
2910
|
}
|
|
2880
2911
|
};
|
|
@@ -2888,7 +2919,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2888
2919
|
const depth = Math.max(0, object.depth);
|
|
2889
2920
|
const center = {
|
|
2890
2921
|
x: box.x + box.width / 2,
|
|
2891
|
-
y: object.y + Math.max(0, object.height) + (width + depth) *
|
|
2922
|
+
y: object.y + Math.max(0, object.height) + (width + depth) * chunkQL7MNEMT_cjs.AXIS_SIN / 2
|
|
2892
2923
|
};
|
|
2893
2924
|
return {
|
|
2894
2925
|
type: "ellipse",
|
|
@@ -2908,7 +2939,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2908
2939
|
fill: { kind: "solid", color: object.shadowStyle?.color ?? "#000000" },
|
|
2909
2940
|
stroke: { kind: "none" },
|
|
2910
2941
|
opacity: object.shadowStyle?.opacity ?? 0.2,
|
|
2911
|
-
blur:
|
|
2942
|
+
blur: chunkQL7MNEMT_cjs.finite(object.shadowStyle?.blur, 8),
|
|
2912
2943
|
pointerEvents: "none"
|
|
2913
2944
|
}
|
|
2914
2945
|
};
|
|
@@ -2918,7 +2949,7 @@ function sphereShadowNode(context, radius) {
|
|
|
2918
2949
|
function faceNodes(context, faces, hullClip) {
|
|
2919
2950
|
const { object, common } = context;
|
|
2920
2951
|
const noStroke = { ...common.style, stroke: { kind: "none" } };
|
|
2921
|
-
const fills =
|
|
2952
|
+
const fills = chunkQL7MNEMT_cjs.deriveFaceFills(object.fill ?? "#f8fafc");
|
|
2922
2953
|
const face = (name, offset, points, color) => faceNode(context, name, offset, points, { ...noStroke, fill: { kind: "solid", color }, clip: hullClip });
|
|
2923
2954
|
return [
|
|
2924
2955
|
face("top", 0, faces.top, fills.topFill),
|
|
@@ -2944,21 +2975,21 @@ function seamsNode(context, faces, hullClip) {
|
|
|
2944
2975
|
}
|
|
2945
2976
|
function buildBox(object, index) {
|
|
2946
2977
|
const context = isometricContext(object, index);
|
|
2947
|
-
const faces =
|
|
2948
|
-
const cornerRadius = Math.max(0,
|
|
2949
|
-
const hullPath =
|
|
2978
|
+
const faces = chunkQL7MNEMT_cjs.isometricFaces(object);
|
|
2979
|
+
const cornerRadius = Math.max(0, chunkQL7MNEMT_cjs.finite(object.cornerRadius, 8));
|
|
2980
|
+
const hullPath = chunkQL7MNEMT_cjs.roundedPolygonPath(silhouette(object), cornerRadius);
|
|
2950
2981
|
const hullClip = { type: "path", d: hullPath };
|
|
2951
2982
|
const groundShadow = groundShadowNode(context, faces.top);
|
|
2952
|
-
const seams = seamsNode(context, faces, hullClip);
|
|
2983
|
+
const seams = object.seams === false ? void 0 : seamsNode(context, faces, hullClip);
|
|
2953
2984
|
const hull = hullNode(context, hullPath, cornerRadius);
|
|
2954
2985
|
const facesNodes = faceNodes(context, faces, hullClip);
|
|
2955
|
-
const objectNodes = groundShadow ? [hull, ...facesNodes, groundShadow, seams] : [hull, ...facesNodes, seams];
|
|
2986
|
+
const objectNodes = groundShadow ? [hull, ...facesNodes, groundShadow, ...seams ? [seams] : []] : [hull, ...facesNodes, ...seams ? [seams] : []];
|
|
2956
2987
|
return object.text ? [...objectNodes, ...labelNodes(context, object.text)] : objectNodes;
|
|
2957
2988
|
}
|
|
2958
2989
|
|
|
2959
2990
|
// src/renderScene/artifacts/isometric/extruded.ts
|
|
2960
2991
|
function wallNode(context, side, index, fill2) {
|
|
2961
|
-
const color =
|
|
2992
|
+
const color = chunkQL7MNEMT_cjs.shadeFill(fill2, side.light);
|
|
2962
2993
|
return faceNode(context, `side-${index}`, 0.05 + index * 1e-3, side.points, {
|
|
2963
2994
|
...context.common.style,
|
|
2964
2995
|
stroke: { kind: "solid", color },
|
|
@@ -2983,7 +3014,7 @@ function wallEdgesNode(context, side, index) {
|
|
|
2983
3014
|
}
|
|
2984
3015
|
function buildExtruded(object, index, footprint) {
|
|
2985
3016
|
const context = isometricContext(object, index);
|
|
2986
|
-
const { top, sides } =
|
|
3017
|
+
const { top, sides } = chunkQL7MNEMT_cjs.extrudeFootprint(object, footprint, Math.max(0, chunkQL7MNEMT_cjs.finite(object.cornerRadius, 0)));
|
|
2987
3018
|
const fill2 = object.fill ?? "#f8fafc";
|
|
2988
3019
|
const groundShadow = groundShadowNode(context, top);
|
|
2989
3020
|
const topFace = faceNode(context, "top", 0.2, top, { ...context.common.style, fill: { kind: "solid", color: fill2 } });
|
|
@@ -3020,9 +3051,9 @@ function buildSphere(object, index) {
|
|
|
3020
3051
|
kind: "linear-gradient",
|
|
3021
3052
|
angle: 135,
|
|
3022
3053
|
stops: [
|
|
3023
|
-
{ offset: 0, color:
|
|
3054
|
+
{ offset: 0, color: chunkQL7MNEMT_cjs.shadeFill(fill2, 1.22) },
|
|
3024
3055
|
{ offset: 0.5, color: fill2 },
|
|
3025
|
-
{ offset: 1, color:
|
|
3056
|
+
{ offset: 1, color: chunkQL7MNEMT_cjs.shadeFill(fill2, 0.82) }
|
|
3026
3057
|
]
|
|
3027
3058
|
}
|
|
3028
3059
|
},
|
|
@@ -3058,12 +3089,12 @@ function buildIsometricObject(object, index) {
|
|
|
3058
3089
|
if (object.form === "sphere") {
|
|
3059
3090
|
return buildSphere(object, index);
|
|
3060
3091
|
}
|
|
3061
|
-
const footprint =
|
|
3092
|
+
const footprint = chunkQL7MNEMT_cjs.cleanFootprint(object.footprint);
|
|
3062
3093
|
return footprint.length > 0 ? buildExtruded(object, index, footprint) : buildBox(object, index);
|
|
3063
3094
|
}
|
|
3064
3095
|
function buildIsometricObjects(objects) {
|
|
3065
3096
|
return objects.flatMap(
|
|
3066
|
-
(object, index) =>
|
|
3097
|
+
(object, index) => chunkQL7MNEMT_cjs.tag(
|
|
3067
3098
|
buildIsometricObject(object, index),
|
|
3068
3099
|
"isometric",
|
|
3069
3100
|
object.id,
|
|
@@ -3092,7 +3123,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
3092
3123
|
if (!label) {
|
|
3093
3124
|
return [];
|
|
3094
3125
|
}
|
|
3095
|
-
const fontSize =
|
|
3126
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(context.link.style?.fontSize, 10);
|
|
3096
3127
|
const position = endpointLabelPosition(context.points, end);
|
|
3097
3128
|
const width = 90;
|
|
3098
3129
|
return [
|
|
@@ -3106,7 +3137,7 @@ function renderEndpointLabel(context, end, labelIndex) {
|
|
|
3106
3137
|
width,
|
|
3107
3138
|
height: fontSize * 2,
|
|
3108
3139
|
lines: [label],
|
|
3109
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3140
|
+
fontFamily: context.link.style?.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
3110
3141
|
fontSize,
|
|
3111
3142
|
fontWeight: "normal",
|
|
3112
3143
|
color: context.color,
|
|
@@ -3136,7 +3167,7 @@ function renderMainLabel(context) {
|
|
|
3136
3167
|
width: context.label.width,
|
|
3137
3168
|
height: context.label.fontSize * 2,
|
|
3138
3169
|
lines: context.label.lines,
|
|
3139
|
-
fontFamily: context.link.style?.fontFamily ??
|
|
3170
|
+
fontFamily: context.link.style?.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
3140
3171
|
fontSize: context.label.fontSize,
|
|
3141
3172
|
fontWeight: "normal",
|
|
3142
3173
|
color: context.color,
|
|
@@ -3190,10 +3221,10 @@ function linkBounds(points, padding) {
|
|
|
3190
3221
|
}
|
|
3191
3222
|
function labelLayout(link, measureText) {
|
|
3192
3223
|
const visible = Boolean(link.showText && link.text);
|
|
3193
|
-
const fontSize =
|
|
3224
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(link.style?.fontSize, 10);
|
|
3194
3225
|
const width = Math.min(250, Math.max(fontSize * 2, (link.text?.length ?? 0) * fontSize * 0.65 + 10));
|
|
3195
|
-
const metrics = measureText?.(link.style?.fontFamily ??
|
|
3196
|
-
const lines = visible ?
|
|
3226
|
+
const metrics = measureText?.(link.style?.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT, fontSize);
|
|
3227
|
+
const lines = visible ? chunkQL7MNEMT_cjs.wrapText(link.text ?? "", width, fontSize, metrics) : [];
|
|
3197
3228
|
return { visible, fontSize, width, height: lines.length * fontSize * 1.4, lines };
|
|
3198
3229
|
}
|
|
3199
3230
|
function linkStyle(item, strokeWidth, color, dash) {
|
|
@@ -3210,26 +3241,26 @@ function linkStyle(item, strokeWidth, color, dash) {
|
|
|
3210
3241
|
dash,
|
|
3211
3242
|
lineCap: "round",
|
|
3212
3243
|
lineJoin: "round",
|
|
3213
|
-
opacity:
|
|
3244
|
+
opacity: chunkQL7MNEMT_cjs.finite(link.style?.opacity, 1),
|
|
3214
3245
|
shadow: resolveShadow(link.style?.shadow)
|
|
3215
3246
|
};
|
|
3216
3247
|
}
|
|
3217
3248
|
function createLinkRenderContext(item, index, measureText) {
|
|
3218
3249
|
const { link, from, to } = item;
|
|
3219
3250
|
const pathType = link.style?.pathType ?? "orthogonal";
|
|
3220
|
-
const { points, segments } =
|
|
3221
|
-
const strokeWidth =
|
|
3251
|
+
const { points, segments } = chunkQL7MNEMT_cjs.calculateLinkRoute(link, from, to, pathType);
|
|
3252
|
+
const strokeWidth = chunkQL7MNEMT_cjs.finite(link.style?.strokeWidth, 2);
|
|
3222
3253
|
const color = getLinkStrokeColor(link.style?.color) || "#64748b";
|
|
3223
3254
|
const label = labelLayout(link, measureText);
|
|
3224
3255
|
const contentDash = getDashArray(strokeWidth, link.style?.strokeStyle ?? "solid");
|
|
3225
|
-
const gap = label.visible && !contentDash ?
|
|
3256
|
+
const gap = label.visible && !contentDash ? chunkQL7MNEMT_cjs.labelGapDash(points, pathType, label.width, label.height) : null;
|
|
3226
3257
|
const dash = gap ? [gap.dashBefore, gap.gapLength, 1e6] : contentDash;
|
|
3227
3258
|
return {
|
|
3228
3259
|
link,
|
|
3229
3260
|
pathType,
|
|
3230
3261
|
points,
|
|
3231
3262
|
segments,
|
|
3232
|
-
midpoint:
|
|
3263
|
+
midpoint: chunkQL7MNEMT_cjs.getLineMidpoint(points, pathType, from, to),
|
|
3233
3264
|
strokeWidth,
|
|
3234
3265
|
bounds: linkBounds(points, strokeWidth + 14),
|
|
3235
3266
|
color,
|
|
@@ -3275,7 +3306,7 @@ function pathData2(points, pathType, segments, strokeWidth) {
|
|
|
3275
3306
|
return `M ${points[0]} ${points[1]} C ${points[2]} ${points[3]} ${points[4]} ${points[5]} ${points[6]} ${points[7]}`;
|
|
3276
3307
|
}
|
|
3277
3308
|
if (pathType === "orthogonal" && segments.length > 0) {
|
|
3278
|
-
return
|
|
3309
|
+
return chunkQL7MNEMT_cjs.roundedOrthogonalPathData(segments, Math.max(16, strokeWidth * 4));
|
|
3279
3310
|
}
|
|
3280
3311
|
return polylinePathData(points);
|
|
3281
3312
|
}
|
|
@@ -3379,7 +3410,7 @@ function buildLink(item, index, measureText) {
|
|
|
3379
3410
|
}
|
|
3380
3411
|
function buildLinks(links, measureText) {
|
|
3381
3412
|
return links.flatMap(
|
|
3382
|
-
(item, index) =>
|
|
3413
|
+
(item, index) => chunkQL7MNEMT_cjs.tag(
|
|
3383
3414
|
buildLink(item, index, measureText),
|
|
3384
3415
|
"link",
|
|
3385
3416
|
item.link.id,
|
|
@@ -3394,7 +3425,7 @@ function buildFreeformPath(path, index) {
|
|
|
3394
3425
|
if (path.isVisible === false || path.points.length < 2) {
|
|
3395
3426
|
return [];
|
|
3396
3427
|
}
|
|
3397
|
-
const strokeWidth =
|
|
3428
|
+
const strokeWidth = chunkQL7MNEMT_cjs.finite(path.strokeWidth, 2);
|
|
3398
3429
|
const extra = strokeWidth + 12;
|
|
3399
3430
|
const bounds = {
|
|
3400
3431
|
minX: Math.min(...path.points.map((point) => point.x)) - extra,
|
|
@@ -3402,7 +3433,7 @@ function buildFreeformPath(path, index) {
|
|
|
3402
3433
|
maxX: Math.max(...path.points.map((point) => point.x)) + extra,
|
|
3403
3434
|
maxY: Math.max(...path.points.map((point) => point.y)) + extra
|
|
3404
3435
|
};
|
|
3405
|
-
const tension =
|
|
3436
|
+
const tension = chunkQL7MNEMT_cjs.finite(path.tension, 0);
|
|
3406
3437
|
const closed = path.closed === true;
|
|
3407
3438
|
return [
|
|
3408
3439
|
{
|
|
@@ -3410,7 +3441,7 @@ function buildFreeformPath(path, index) {
|
|
|
3410
3441
|
id: `path-${path.id}`,
|
|
3411
3442
|
order: 3e4 + index,
|
|
3412
3443
|
bounds,
|
|
3413
|
-
d:
|
|
3444
|
+
d: chunkQL7MNEMT_cjs.freeformPathData({ points: path.points, tension, closed }),
|
|
3414
3445
|
markerStart: path.startMarker,
|
|
3415
3446
|
markerEnd: path.endMarker,
|
|
3416
3447
|
detail: {
|
|
@@ -3426,13 +3457,13 @@ function buildFreeformPath(path, index) {
|
|
|
3426
3457
|
dash: path.dash?.length ? path.dash : void 0,
|
|
3427
3458
|
lineCap: "round",
|
|
3428
3459
|
lineJoin: "round",
|
|
3429
|
-
opacity:
|
|
3460
|
+
opacity: chunkQL7MNEMT_cjs.finite(path.opacity, 1)
|
|
3430
3461
|
}
|
|
3431
3462
|
}
|
|
3432
3463
|
];
|
|
3433
3464
|
}
|
|
3434
3465
|
function buildFreeformPaths(paths) {
|
|
3435
|
-
return paths.flatMap((path, index) =>
|
|
3466
|
+
return paths.flatMap((path, index) => chunkQL7MNEMT_cjs.tag(buildFreeformPath(path, index), "path", path.id, "path", "Path"));
|
|
3436
3467
|
}
|
|
3437
3468
|
|
|
3438
3469
|
// src/renderScene/artifacts/shape/geometry/base.ts
|
|
@@ -3448,7 +3479,7 @@ function shapeNodeBase(context) {
|
|
|
3448
3479
|
|
|
3449
3480
|
// src/renderScene/artifacts/shape/geometry/simple.ts
|
|
3450
3481
|
function renderPath(context) {
|
|
3451
|
-
const path =
|
|
3482
|
+
const path = chunkQL7MNEMT_cjs.localShapePath(context.shape.shapeType, context.x, context.y, context.width, context.height);
|
|
3452
3483
|
if (!path) {
|
|
3453
3484
|
return [];
|
|
3454
3485
|
}
|
|
@@ -3464,7 +3495,7 @@ function renderBoundedPath(context) {
|
|
|
3464
3495
|
}));
|
|
3465
3496
|
}
|
|
3466
3497
|
function renderRectangle(context) {
|
|
3467
|
-
const rx = context.shape.shapeType === "pill" ?
|
|
3498
|
+
const rx = context.shape.shapeType === "pill" ? chunkQL7MNEMT_cjs.pillCornerRadius(context.width, context.height) : context.shape.shapeType === "rounded_rectangle" ? chunkQL7MNEMT_cjs.finite(context.shape.cornerRadius, 8) : 0;
|
|
3468
3499
|
return [
|
|
3469
3500
|
{
|
|
3470
3501
|
...shapeNodeBase(context),
|
|
@@ -3493,7 +3524,7 @@ function renderSymbol(context) {
|
|
|
3493
3524
|
if (!context.shape.symbol || context.shape.symbol.points.length < 2) {
|
|
3494
3525
|
return renderRectangle(context);
|
|
3495
3526
|
}
|
|
3496
|
-
const tension =
|
|
3527
|
+
const tension = chunkQL7MNEMT_cjs.finite(context.shape.symbol.tension, 0);
|
|
3497
3528
|
const points = context.shape.symbol.points.map(([x, y]) => ({
|
|
3498
3529
|
x: context.x + x * context.width,
|
|
3499
3530
|
y: context.y + y * context.height
|
|
@@ -3502,7 +3533,7 @@ function renderSymbol(context) {
|
|
|
3502
3533
|
{
|
|
3503
3534
|
...shapeNodeBase(context),
|
|
3504
3535
|
type: "path",
|
|
3505
|
-
d:
|
|
3536
|
+
d: chunkQL7MNEMT_cjs.freeformPathData({ points, tension, closed: true }),
|
|
3506
3537
|
rotationCenter: context.rotationCenter,
|
|
3507
3538
|
detail: {
|
|
3508
3539
|
of: "symbolGeometry",
|
|
@@ -3540,7 +3571,14 @@ function renderShapeGeometry(context) {
|
|
|
3540
3571
|
}
|
|
3541
3572
|
|
|
3542
3573
|
// src/renderScene/artifacts/shape/shaderSurface.ts
|
|
3543
|
-
var RECT_PROGRAMS = /* @__PURE__ */ new Set([
|
|
3574
|
+
var RECT_PROGRAMS = /* @__PURE__ */ new Set([
|
|
3575
|
+
"reactivePanel",
|
|
3576
|
+
"ledMatrix",
|
|
3577
|
+
"lightBand",
|
|
3578
|
+
"silkFolds",
|
|
3579
|
+
"glowCard",
|
|
3580
|
+
"glassDots"
|
|
3581
|
+
]);
|
|
3544
3582
|
function shaderMask(context) {
|
|
3545
3583
|
if (context.shape.shapeType === "circle" || context.shape.shapeType === "oval") {
|
|
3546
3584
|
return "ellipse";
|
|
@@ -3570,7 +3608,7 @@ function renderShapeShaderSurface(context) {
|
|
|
3570
3608
|
id: `${context.id}-shader`,
|
|
3571
3609
|
type: "shader-surface",
|
|
3572
3610
|
order: context.order,
|
|
3573
|
-
bounds:
|
|
3611
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds(surfaceBounds, context.rotation, 0),
|
|
3574
3612
|
...surfaceBounds,
|
|
3575
3613
|
rotation: context.rotation,
|
|
3576
3614
|
shader: context.shape.shader,
|
|
@@ -3640,22 +3678,24 @@ function shapeDash(shape, strokeWidth) {
|
|
|
3640
3678
|
}
|
|
3641
3679
|
function shapeStyle(shape, diagnostics) {
|
|
3642
3680
|
const defaults = shapeDefaults(shape, diagnostics);
|
|
3643
|
-
const strokeWidth =
|
|
3681
|
+
const strokeWidth = chunkQL7MNEMT_cjs.finite(shape.strokeWidth, defaults.strokeWidth);
|
|
3644
3682
|
const shadow = shape.shadowStyle ?? (shape.hasShadow ? { enabled: true, color: "#000000", opacity: 0.25, blur: 10, angle: 45, distance: 5 } : void 0);
|
|
3645
|
-
const angle =
|
|
3683
|
+
const angle = chunkQL7MNEMT_cjs.finite(shadow?.angle, 45) * Math.PI / 180;
|
|
3646
3684
|
return {
|
|
3647
|
-
fill:
|
|
3648
|
-
stroke:
|
|
3685
|
+
fill: chunkQL7MNEMT_cjs.paint(shape.fillColor, diagnostics, shape.id),
|
|
3686
|
+
stroke: chunkQL7MNEMT_cjs.paint(shape.strokeColor, diagnostics, shape.id),
|
|
3649
3687
|
strokeWidth,
|
|
3650
3688
|
dash: shapeDash(shape, strokeWidth),
|
|
3651
3689
|
lineCap: shape.strokeStyle === "dotted" ? "round" : "butt",
|
|
3652
|
-
opacity:
|
|
3690
|
+
opacity: chunkQL7MNEMT_cjs.finite(shape.opacity, defaults.opacity),
|
|
3691
|
+
blur: shape.blur !== void 0 && shape.blur > 0 ? shape.blur : void 0,
|
|
3692
|
+
blend: shape.blend,
|
|
3653
3693
|
shadow: shadow?.enabled ? {
|
|
3654
3694
|
color: shadow.color ?? "#000000",
|
|
3655
|
-
opacity:
|
|
3656
|
-
blur:
|
|
3657
|
-
dx: Math.cos(angle) *
|
|
3658
|
-
dy: Math.sin(angle) *
|
|
3695
|
+
opacity: chunkQL7MNEMT_cjs.finite(shadow.opacity, 0.25),
|
|
3696
|
+
blur: chunkQL7MNEMT_cjs.finite(shadow.blur, 10),
|
|
3697
|
+
dx: Math.cos(angle) * chunkQL7MNEMT_cjs.finite(shadow.distance, 5),
|
|
3698
|
+
dy: Math.sin(angle) * chunkQL7MNEMT_cjs.finite(shadow.distance, 5)
|
|
3659
3699
|
} : void 0
|
|
3660
3700
|
};
|
|
3661
3701
|
}
|
|
@@ -3731,11 +3771,11 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3731
3771
|
if (!shape.text) {
|
|
3732
3772
|
return null;
|
|
3733
3773
|
}
|
|
3734
|
-
const fontSize =
|
|
3774
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(shape.fontSize, shapeDefaults(shape, []).fontSize);
|
|
3735
3775
|
const padding = shape.isText ? 0 : Math.max(8, strokeWidth * 2);
|
|
3736
|
-
const area = shape.shapeType === "person" ?
|
|
3776
|
+
const area = shape.shapeType === "person" ? chunkQL7MNEMT_cjs.personLabelArea(x, y, width, height) : { x, y, width, height };
|
|
3737
3777
|
const textWidth = Math.max(0, area.width - padding * 2);
|
|
3738
|
-
const fontFamily2 = shape.fontFamily ||
|
|
3778
|
+
const fontFamily2 = shape.fontFamily || chunkQL7MNEMT_cjs.DEFAULT_FONT;
|
|
3739
3779
|
const metrics = measureText?.(fontFamily2, fontSize);
|
|
3740
3780
|
const textNode = {
|
|
3741
3781
|
type: "text",
|
|
@@ -3746,7 +3786,7 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3746
3786
|
y: area.y + padding,
|
|
3747
3787
|
width: textWidth,
|
|
3748
3788
|
height: Math.max(0, area.height - padding * 2),
|
|
3749
|
-
lines:
|
|
3789
|
+
lines: chunkQL7MNEMT_cjs.wrapText(shape.text, textWidth, fontSize, metrics),
|
|
3750
3790
|
fontFamily: fontFamily2,
|
|
3751
3791
|
fontSize,
|
|
3752
3792
|
fontWeight: shape.fontWeight ?? "normal",
|
|
@@ -3754,12 +3794,12 @@ function renderShapeText(context, strokeWidth, measureText) {
|
|
|
3754
3794
|
color: shape.textColor || "#111827",
|
|
3755
3795
|
align: shape.textAlign ?? "center",
|
|
3756
3796
|
verticalAlign: shape.textVerticalAlign ?? "middle",
|
|
3757
|
-
lineHeight:
|
|
3797
|
+
lineHeight: chunkQL7MNEMT_cjs.finite(shape.lineHeight, 1.3),
|
|
3758
3798
|
rotation,
|
|
3759
3799
|
rotationCenter
|
|
3760
3800
|
};
|
|
3761
3801
|
if (hasBoldMarkup(shape.text)) {
|
|
3762
|
-
const { measure, spaceWidth } = metrics ??
|
|
3802
|
+
const { measure, spaceWidth } = metrics ?? chunkQL7MNEMT_cjs.heuristicRichMeasure(fontSize);
|
|
3763
3803
|
textNode.richLines = wrapRichText(shape.text, textWidth, measure, spaceWidth);
|
|
3764
3804
|
}
|
|
3765
3805
|
return textNode;
|
|
@@ -3798,19 +3838,19 @@ function renderDoubleStroke(context, strokeWidth) {
|
|
|
3798
3838
|
return nodes;
|
|
3799
3839
|
}
|
|
3800
3840
|
function createRenderContext(shape, index, diagnostics) {
|
|
3801
|
-
const x =
|
|
3802
|
-
const y =
|
|
3803
|
-
const width = Math.max(0,
|
|
3804
|
-
const height = Math.max(0,
|
|
3805
|
-
const rotation =
|
|
3806
|
-
const strokeWidth =
|
|
3841
|
+
const x = chunkQL7MNEMT_cjs.finite(shape.x, 0);
|
|
3842
|
+
const y = chunkQL7MNEMT_cjs.finite(shape.y, 0);
|
|
3843
|
+
const width = Math.max(0, chunkQL7MNEMT_cjs.finite(shape.width, 100));
|
|
3844
|
+
const height = Math.max(0, chunkQL7MNEMT_cjs.finite(shape.height, 100));
|
|
3845
|
+
const rotation = chunkQL7MNEMT_cjs.finite(shape.rotation, 0);
|
|
3846
|
+
const strokeWidth = chunkQL7MNEMT_cjs.finite(shape.strokeWidth, 2);
|
|
3807
3847
|
return {
|
|
3808
3848
|
strokeWidth,
|
|
3809
3849
|
context: {
|
|
3810
3850
|
shape,
|
|
3811
3851
|
id: `shape-${shape.id}`,
|
|
3812
3852
|
order: 1e4 + index,
|
|
3813
|
-
bounds:
|
|
3853
|
+
bounds: chunkQL7MNEMT_cjs.rotatedBounds({ x, y, width, height }, rotation, strokeWidth + (shape.hasShadow ? 20 : 2)),
|
|
3814
3854
|
rotation,
|
|
3815
3855
|
rotationCenter: { x: x + width / 2, y: y + height / 2 },
|
|
3816
3856
|
style: shapeStyle(shape, diagnostics),
|
|
@@ -3844,7 +3884,7 @@ function buildShape(shape, index, diagnostics, measureText) {
|
|
|
3844
3884
|
}
|
|
3845
3885
|
function buildShapes(shapes, diagnostics, measureText) {
|
|
3846
3886
|
return shapes.flatMap(
|
|
3847
|
-
(shape, index) =>
|
|
3887
|
+
(shape, index) => chunkQL7MNEMT_cjs.tag(
|
|
3848
3888
|
buildShape(shape, index, diagnostics, measureText),
|
|
3849
3889
|
"shape",
|
|
3850
3890
|
shape.id,
|
|
@@ -3861,7 +3901,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
3861
3901
|
return null;
|
|
3862
3902
|
}
|
|
3863
3903
|
return {
|
|
3864
|
-
...
|
|
3904
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
3865
3905
|
role: "axis",
|
|
3866
3906
|
id: `chart-x-label-${chart.id}`,
|
|
3867
3907
|
order,
|
|
@@ -3871,7 +3911,7 @@ function buildXAxisLabel(chart, layout, order) {
|
|
|
3871
3911
|
chart,
|
|
3872
3912
|
align: "center"
|
|
3873
3913
|
}),
|
|
3874
|
-
prop:
|
|
3914
|
+
prop: chunkQL7MNEMT_cjs.axisLabelProp("x")
|
|
3875
3915
|
};
|
|
3876
3916
|
}
|
|
3877
3917
|
function buildYAxisLabel(chart, layout, order) {
|
|
@@ -3879,7 +3919,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
3879
3919
|
return null;
|
|
3880
3920
|
}
|
|
3881
3921
|
return {
|
|
3882
|
-
...
|
|
3922
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
3883
3923
|
role: "axis",
|
|
3884
3924
|
id: `chart-y-label-${chart.id}`,
|
|
3885
3925
|
order,
|
|
@@ -3895,7 +3935,7 @@ function buildYAxisLabel(chart, layout, order) {
|
|
|
3895
3935
|
align: "center",
|
|
3896
3936
|
rotation: -90
|
|
3897
3937
|
}),
|
|
3898
|
-
prop:
|
|
3938
|
+
prop: chunkQL7MNEMT_cjs.axisLabelProp("y")
|
|
3899
3939
|
};
|
|
3900
3940
|
}
|
|
3901
3941
|
function buildAxisLabels(chart, layout, order) {
|
|
@@ -3918,7 +3958,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
3918
3958
|
return chart.series.map((series, index) => {
|
|
3919
3959
|
const centerY = layout.plot.y + (index + 0.5) * slotWidth;
|
|
3920
3960
|
return {
|
|
3921
|
-
...
|
|
3961
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
3922
3962
|
role: "axis",
|
|
3923
3963
|
id: `chart-y-tick-${chart.id}-${index}`,
|
|
3924
3964
|
order: order + index,
|
|
@@ -3928,7 +3968,7 @@ function buildBoxplotSeriesYAxisTicks(chart, layout, order) {
|
|
|
3928
3968
|
chart,
|
|
3929
3969
|
align: "right"
|
|
3930
3970
|
}),
|
|
3931
|
-
prop:
|
|
3971
|
+
prop: chunkQL7MNEMT_cjs.seriesLabelProp(series.id)
|
|
3932
3972
|
};
|
|
3933
3973
|
});
|
|
3934
3974
|
}
|
|
@@ -3954,7 +3994,7 @@ function isStackedLegendPosition(position) {
|
|
|
3954
3994
|
return position === "bottomLeft" || position === "bottomRight";
|
|
3955
3995
|
}
|
|
3956
3996
|
function legendItemWidths(chart) {
|
|
3957
|
-
return legendSeries(chart).map((item) => Math.max(42, item.label.length *
|
|
3997
|
+
return legendSeries(chart).map((item) => Math.max(42, item.label.length * chunkQL7MNEMT_cjs.finite(chart.fontSize, 12) * 0.58 + 22));
|
|
3958
3998
|
}
|
|
3959
3999
|
function stackedLegendColumnWidth(chart) {
|
|
3960
4000
|
const widths = legendItemWidths(chart);
|
|
@@ -4007,9 +4047,9 @@ function renderLegendItem(render2, item) {
|
|
|
4007
4047
|
}
|
|
4008
4048
|
function createLegendSwatch(render2, item) {
|
|
4009
4049
|
const { chart, bounds, diagnostics } = render2;
|
|
4010
|
-
const fallback =
|
|
4050
|
+
const fallback = chunkQL7MNEMT_cjs.CHART_COLORS[item.seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
4011
4051
|
const solidOnly = chart.chartType === "line";
|
|
4012
|
-
const color = solidOnly ?
|
|
4052
|
+
const color = solidOnly ? chunkQL7MNEMT_cjs.representativeColor(item.series.color, fallback) : item.series.color ?? fallback;
|
|
4013
4053
|
return {
|
|
4014
4054
|
type: "rect",
|
|
4015
4055
|
id: `chart-legend-swatch-${chart.id}-${item.series.id}`,
|
|
@@ -4020,16 +4060,16 @@ function createLegendSwatch(render2, item) {
|
|
|
4020
4060
|
width: 10,
|
|
4021
4061
|
height: 10,
|
|
4022
4062
|
rx: 3,
|
|
4023
|
-
prop:
|
|
4063
|
+
prop: chunkQL7MNEMT_cjs.seriesColorProp(item.series.id),
|
|
4024
4064
|
propKind: "color",
|
|
4025
4065
|
propSolidOnly: solidOnly,
|
|
4026
|
-
style: { fill:
|
|
4066
|
+
style: { fill: chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id) }
|
|
4027
4067
|
};
|
|
4028
4068
|
}
|
|
4029
4069
|
function createLegendLabel(render2, item) {
|
|
4030
4070
|
const { chart, bounds } = render2;
|
|
4031
4071
|
return {
|
|
4032
|
-
...
|
|
4072
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4033
4073
|
role: "legend",
|
|
4034
4074
|
id: `chart-legend-${chart.id}-${item.series.id}`,
|
|
4035
4075
|
order: item.order + 1,
|
|
@@ -4038,7 +4078,7 @@ function createLegendLabel(render2, item) {
|
|
|
4038
4078
|
text: item.series.label,
|
|
4039
4079
|
chart
|
|
4040
4080
|
}),
|
|
4041
|
-
prop:
|
|
4081
|
+
prop: chunkQL7MNEMT_cjs.seriesLabelProp(item.series.id)
|
|
4042
4082
|
};
|
|
4043
4083
|
}
|
|
4044
4084
|
|
|
@@ -4057,13 +4097,19 @@ function hasCartesianDecorations(chart) {
|
|
|
4057
4097
|
return !CHARTS_WITHOUT_CARTESIAN_DECORATIONS.has(chart.chartType);
|
|
4058
4098
|
}
|
|
4059
4099
|
function tickOffset(chart) {
|
|
4060
|
-
return hasCartesianDecorations(chart) ? Math.max(0,
|
|
4100
|
+
return hasCartesianDecorations(chart) ? Math.max(0, chunkQL7MNEMT_cjs.finite(chart.tickLength, 0)) : 0;
|
|
4101
|
+
}
|
|
4102
|
+
function xLabelOffset(chart) {
|
|
4103
|
+
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0, chunkQL7MNEMT_cjs.finite(chart.xLabelGap, 0)) : 0);
|
|
4104
|
+
}
|
|
4105
|
+
function yLabelOffset(chart) {
|
|
4106
|
+
return tickOffset(chart) + (hasCartesianDecorations(chart) ? Math.max(0, chunkQL7MNEMT_cjs.finite(chart.yLabelGap, 0)) : 0);
|
|
4061
4107
|
}
|
|
4062
4108
|
function isHorizontalBoxplot(chart) {
|
|
4063
4109
|
return chart.chartType === "boxplot" && chart.config?.orientation === "horizontal";
|
|
4064
4110
|
}
|
|
4065
4111
|
function boxplotCategoryLabelWidth(chart) {
|
|
4066
|
-
const fontSize =
|
|
4112
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(chart.fontSize, 12);
|
|
4067
4113
|
const longest = Math.max(0, ...chart.series.map((series) => (series.label || series.id).length));
|
|
4068
4114
|
return longest * fontSize * 0.58 + 16;
|
|
4069
4115
|
}
|
|
@@ -4075,15 +4121,18 @@ function treemapSideLegendSide(chart, showLegend) {
|
|
|
4075
4121
|
return chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : null;
|
|
4076
4122
|
}
|
|
4077
4123
|
function barCategoryLabelWidth(chart) {
|
|
4078
|
-
const fontSize =
|
|
4124
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(chart.axisFontSize ?? chart.fontSize, 12);
|
|
4079
4125
|
const categories = chart.config?.categories ?? [];
|
|
4080
4126
|
return Math.max(0, ...categories.map((category) => category.length)) * fontSize * 0.58 + 16;
|
|
4081
4127
|
}
|
|
4082
4128
|
function leftLabelWidth(chart) {
|
|
4129
|
+
if (chart.axisLabelSpace && chart.axisLabelSpace > 0 && (isHorizontalBoxplot(chart) || chunkQL7MNEMT_cjs.isHorizontalBar(chart))) {
|
|
4130
|
+
return chart.axisLabelSpace;
|
|
4131
|
+
}
|
|
4083
4132
|
if (isHorizontalBoxplot(chart)) {
|
|
4084
4133
|
return boxplotCategoryLabelWidth(chart);
|
|
4085
4134
|
}
|
|
4086
|
-
if (
|
|
4135
|
+
if (chunkQL7MNEMT_cjs.isHorizontalBar(chart)) {
|
|
4087
4136
|
return chart.categoryAlign === "left" || chart.categoryAlign === "inside" ? 20 : barCategoryLabelWidth(chart);
|
|
4088
4137
|
}
|
|
4089
4138
|
if (chart.showValueAxis === false) {
|
|
@@ -4091,6 +4140,14 @@ function leftLabelWidth(chart) {
|
|
|
4091
4140
|
}
|
|
4092
4141
|
return chart.axisY.label ? 60 : 46;
|
|
4093
4142
|
}
|
|
4143
|
+
function tiltedBottomRoom(chart) {
|
|
4144
|
+
const tilt = chunkQL7MNEMT_cjs.labelTilt(chart);
|
|
4145
|
+
if (tilt <= 0) {
|
|
4146
|
+
return 0;
|
|
4147
|
+
}
|
|
4148
|
+
const labels = chart.chartType === "bar" && !chunkQL7MNEMT_cjs.isHorizontalBar(chart) ? chart.config?.categories ?? [] : chart.chartType === "boxplot" && !isHorizontalBoxplot(chart) ? chart.series.map((series) => series.label || series.id) : [];
|
|
4149
|
+
return labels.length > 0 ? Math.max(0, chunkQL7MNEMT_cjs.tiltedLabelRoom(chart, labels, tilt) - 18) : 0;
|
|
4150
|
+
}
|
|
4094
4151
|
function decorations(chart) {
|
|
4095
4152
|
const showLabels = chart.showAxisLabels !== false;
|
|
4096
4153
|
const showLegend = chart.showLegend !== false;
|
|
@@ -4100,21 +4157,22 @@ function decorations(chart) {
|
|
|
4100
4157
|
const legendStacked = hasLegendItems && isStackedLegendPosition(legendPosition);
|
|
4101
4158
|
const sideColumnWidth = legendStacked ? stackedLegendColumnWidth(chart) + LEGEND_COLUMN_GAP : 0;
|
|
4102
4159
|
const treemapSide = treemapSideLegendSide(chart, showLegend);
|
|
4103
|
-
const
|
|
4104
|
-
const
|
|
4160
|
+
const tickX = xLabelOffset(chart);
|
|
4161
|
+
const tickY = yLabelOffset(chart);
|
|
4162
|
+
const padLeft = tickY + (showLabels ? leftLabelWidth(chart) : 12) + (legendPosition === "bottomLeft" ? sideColumnWidth : 0) + (treemapSide === "left" ? TREEMAP_SIDE_LEGEND_WIDTH : 0);
|
|
4105
4163
|
const padRight = 24 + (legendPosition === "bottomRight" ? sideColumnWidth : 0) + (treemapSide === "right" ? TREEMAP_SIDE_LEGEND_WIDTH : 0);
|
|
4106
4164
|
const valueRow = chart.chartType === "bar" && chart.config?.showBarLabels === true && chart.config.barLabelPosition === "axis";
|
|
4107
|
-
const horizontalValueAxis =
|
|
4108
|
-
const basePadBottom = showLabels ?
|
|
4165
|
+
const horizontalValueAxis = chunkQL7MNEMT_cjs.isHorizontalBar(chart) && chart.showValueAxis !== false;
|
|
4166
|
+
const basePadBottom = showLabels ? chunkQL7MNEMT_cjs.isHorizontalBar(chart) ? horizontalValueAxis ? 34 : 12 : (chart.axisX.label ? 52 : 34) + (valueRow ? 18 : 0) : 12;
|
|
4109
4167
|
const hasColorBar = chart.chartType === "field" && showLegend && Boolean(chart.config?.scale?.stops.length);
|
|
4110
4168
|
const legendAtBottomRow = hasLegendItems && !legendAtTop && !legendStacked;
|
|
4111
|
-
const padBottom =
|
|
4112
|
-
const titleHeight = chart.title ? Math.max(44, 20 +
|
|
4169
|
+
const padBottom = tickX + basePadBottom + (showLabels ? tiltedBottomRoom(chart) : 0) + (hasColorBar ? 44 : 0) + (legendAtBottomRow ? 16 + LEGEND_ROW_HEIGHT : 0);
|
|
4170
|
+
const titleHeight = chart.title ? Math.max(44, 20 + chunkQL7MNEMT_cjs.finite(chart.titleSize, 14) * 1.6) : 0;
|
|
4113
4171
|
const padTop = titleHeight || (legendAtTop && hasLegendItems ? 44 : 24);
|
|
4114
4172
|
return {
|
|
4115
|
-
bounds:
|
|
4173
|
+
bounds: chunkQL7MNEMT_cjs.boxBounds(
|
|
4116
4174
|
{ x: chart.x, y: chart.y, width: chart.width, height: chart.height },
|
|
4117
|
-
|
|
4175
|
+
chunkQL7MNEMT_cjs.finite(chart.strokeWidth, 1) + 2
|
|
4118
4176
|
),
|
|
4119
4177
|
plot: {
|
|
4120
4178
|
x: chart.x + padLeft,
|
|
@@ -4136,26 +4194,48 @@ function categoryLabels(chart, count) {
|
|
|
4136
4194
|
return Array.from({ length: count }, (_value, index) => String(index + 1));
|
|
4137
4195
|
}
|
|
4138
4196
|
function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
4139
|
-
const count =
|
|
4197
|
+
const count = chunkQL7MNEMT_cjs.barCategoryCount(chart);
|
|
4140
4198
|
const slotWidth = layout.plot.width / count;
|
|
4141
4199
|
const labels = categoryLabels(chart, count);
|
|
4142
4200
|
const editable = Boolean(chart.config?.categories?.length);
|
|
4201
|
+
const tilt = chunkQL7MNEMT_cjs.labelTilt(chart);
|
|
4143
4202
|
const left = chart.categoryAlign === "left";
|
|
4144
4203
|
const groupGap = left ? Math.min(
|
|
4145
|
-
Math.max(0,
|
|
4204
|
+
Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.barGroupGap, 8)),
|
|
4146
4205
|
Math.max(0, slotWidth - 1)
|
|
4147
4206
|
) : 0;
|
|
4148
4207
|
return Array.from({ length: count }, (_value, index) => {
|
|
4149
4208
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
4209
|
+
if (tilt > 0) {
|
|
4210
|
+
const text = labels[index] ?? String(index + 1);
|
|
4211
|
+
const { frame, rotation } = chunkQL7MNEMT_cjs.labelBelowFrame(chart, text, tilt, {
|
|
4212
|
+
x: centerX,
|
|
4213
|
+
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart)
|
|
4214
|
+
});
|
|
4215
|
+
return {
|
|
4216
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4217
|
+
role: "axis",
|
|
4218
|
+
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4219
|
+
order: order + index,
|
|
4220
|
+
bounds: layout.bounds,
|
|
4221
|
+
frame,
|
|
4222
|
+
text,
|
|
4223
|
+
chart,
|
|
4224
|
+
align: "right",
|
|
4225
|
+
rotation
|
|
4226
|
+
}),
|
|
4227
|
+
prop: editable ? chunkQL7MNEMT_cjs.categoryProp(index) : void 0
|
|
4228
|
+
};
|
|
4229
|
+
}
|
|
4150
4230
|
return {
|
|
4151
|
-
...
|
|
4231
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4152
4232
|
role: "axis",
|
|
4153
4233
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4154
4234
|
order: order + index,
|
|
4155
4235
|
bounds: layout.bounds,
|
|
4156
4236
|
frame: {
|
|
4157
4237
|
x: left ? layout.plot.x + index * slotWidth + groupGap / 2 : centerX - slotWidth / 2,
|
|
4158
|
-
y: layout.plot.y + layout.plot.height + 4 +
|
|
4238
|
+
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart),
|
|
4159
4239
|
width: left ? slotWidth - groupGap : slotWidth,
|
|
4160
4240
|
height: 18
|
|
4161
4241
|
},
|
|
@@ -4163,24 +4243,46 @@ function buildCategoricalXAxisTicks(chart, layout, order) {
|
|
|
4163
4243
|
chart,
|
|
4164
4244
|
align: left ? "left" : "center"
|
|
4165
4245
|
}),
|
|
4166
|
-
prop: editable ?
|
|
4246
|
+
prop: editable ? chunkQL7MNEMT_cjs.categoryProp(index) : void 0
|
|
4167
4247
|
};
|
|
4168
4248
|
});
|
|
4169
4249
|
}
|
|
4170
4250
|
function buildSeriesXAxisTicks(chart, layout, order) {
|
|
4171
4251
|
const count = Math.max(1, chart.series.length);
|
|
4172
4252
|
const slotWidth = layout.plot.width / count;
|
|
4253
|
+
const tilt = chunkQL7MNEMT_cjs.labelTilt(chart);
|
|
4173
4254
|
return chart.series.map((series, index) => {
|
|
4174
4255
|
const centerX = layout.plot.x + (index + 0.5) * slotWidth;
|
|
4256
|
+
if (tilt > 0) {
|
|
4257
|
+
const text = series.label || series.id;
|
|
4258
|
+
const { frame, rotation } = chunkQL7MNEMT_cjs.labelBelowFrame(chart, text, tilt, {
|
|
4259
|
+
x: centerX,
|
|
4260
|
+
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart)
|
|
4261
|
+
});
|
|
4262
|
+
return {
|
|
4263
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4264
|
+
role: "axis",
|
|
4265
|
+
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4266
|
+
order: order + index,
|
|
4267
|
+
bounds: layout.bounds,
|
|
4268
|
+
frame,
|
|
4269
|
+
text,
|
|
4270
|
+
chart,
|
|
4271
|
+
align: "right",
|
|
4272
|
+
rotation
|
|
4273
|
+
}),
|
|
4274
|
+
prop: chunkQL7MNEMT_cjs.seriesLabelProp(series.id)
|
|
4275
|
+
};
|
|
4276
|
+
}
|
|
4175
4277
|
return {
|
|
4176
|
-
...
|
|
4278
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4177
4279
|
role: "axis",
|
|
4178
4280
|
id: `chart-x-tick-${chart.id}-${index}`,
|
|
4179
4281
|
order: order + index,
|
|
4180
4282
|
bounds: layout.bounds,
|
|
4181
4283
|
frame: {
|
|
4182
4284
|
x: centerX - slotWidth / 2,
|
|
4183
|
-
y: layout.plot.y + layout.plot.height + 4 +
|
|
4285
|
+
y: layout.plot.y + layout.plot.height + 4 + xLabelOffset(chart),
|
|
4184
4286
|
width: slotWidth,
|
|
4185
4287
|
height: 18
|
|
4186
4288
|
},
|
|
@@ -4188,21 +4290,21 @@ function buildSeriesXAxisTicks(chart, layout, order) {
|
|
|
4188
4290
|
chart,
|
|
4189
4291
|
align: "center"
|
|
4190
4292
|
}),
|
|
4191
|
-
prop:
|
|
4293
|
+
prop: chunkQL7MNEMT_cjs.seriesLabelProp(series.id)
|
|
4192
4294
|
};
|
|
4193
4295
|
});
|
|
4194
4296
|
}
|
|
4195
4297
|
|
|
4196
4298
|
// src/renderScene/charts/decorations/numericXAxis.ts
|
|
4197
4299
|
function buildNumericXAxisTicks(chart, layout, order) {
|
|
4198
|
-
return
|
|
4199
|
-
const x = layout.plot.x +
|
|
4200
|
-
return
|
|
4300
|
+
return chunkQL7MNEMT_cjs.chartTicks(chart.axisX).map((tick, index) => {
|
|
4301
|
+
const x = layout.plot.x + chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisX, layout.plot.width);
|
|
4302
|
+
return chunkQL7MNEMT_cjs.chartText({
|
|
4201
4303
|
role: "axis",
|
|
4202
4304
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
4203
4305
|
order: order + index,
|
|
4204
4306
|
bounds: layout.bounds,
|
|
4205
|
-
frame: { x: x - 20, y: layout.plot.y + layout.plot.height + 10 +
|
|
4307
|
+
frame: { x: x - 20, y: layout.plot.y + layout.plot.height + 10 + xLabelOffset(chart), width: 40, height: 18 },
|
|
4206
4308
|
text: String(tick),
|
|
4207
4309
|
chart,
|
|
4208
4310
|
align: "center"
|
|
@@ -4212,14 +4314,14 @@ function buildNumericXAxisTicks(chart, layout, order) {
|
|
|
4212
4314
|
|
|
4213
4315
|
// src/renderScene/charts/decorations/numericYAxis.ts
|
|
4214
4316
|
function buildNumericYAxisTicks(chart, layout, order) {
|
|
4215
|
-
return
|
|
4216
|
-
const y = layout.plot.y + layout.plot.height -
|
|
4217
|
-
return
|
|
4317
|
+
return chunkQL7MNEMT_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
4318
|
+
const y = layout.plot.y + layout.plot.height - chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisY, layout.plot.height);
|
|
4319
|
+
return chunkQL7MNEMT_cjs.chartText({
|
|
4218
4320
|
role: "axis",
|
|
4219
4321
|
id: `chart-y-tick-${chart.id}-${tick}`,
|
|
4220
4322
|
order: order + index,
|
|
4221
4323
|
bounds: layout.bounds,
|
|
4222
|
-
frame: { x: chart.x, y: y - 6, width: layout.padLeft - 14 -
|
|
4324
|
+
frame: { x: chart.x, y: y - 6, width: layout.padLeft - 14 - yLabelOffset(chart), height: 18 },
|
|
4223
4325
|
text: String(tick),
|
|
4224
4326
|
chart,
|
|
4225
4327
|
align: "right"
|
|
@@ -4249,10 +4351,10 @@ function buildYAxisTicks(chart, layout, order) {
|
|
|
4249
4351
|
function xTickPositions(chart, layout) {
|
|
4250
4352
|
const { plot } = layout;
|
|
4251
4353
|
if (chart.chartType === "bar") {
|
|
4252
|
-
const count =
|
|
4354
|
+
const count = chunkQL7MNEMT_cjs.barCategoryCount(chart);
|
|
4253
4355
|
return Array.from({ length: count }, (_value, index) => plot.x + (index + 0.5) * plot.width / count);
|
|
4254
4356
|
}
|
|
4255
|
-
return
|
|
4357
|
+
return chunkQL7MNEMT_cjs.chartTicks(chart.axisX).map((tick) => plot.x + chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisX, plot.width));
|
|
4256
4358
|
}
|
|
4257
4359
|
function axisLineDash(chart, width) {
|
|
4258
4360
|
if (chart.axisLineStyle === "dashed") {
|
|
@@ -4261,8 +4363,8 @@ function axisLineDash(chart, width) {
|
|
|
4261
4363
|
return chart.axisLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : {};
|
|
4262
4364
|
}
|
|
4263
4365
|
function buildAxisLines(chart, layout, order) {
|
|
4264
|
-
const lineWidth =
|
|
4265
|
-
const tickLength =
|
|
4366
|
+
const lineWidth = chunkQL7MNEMT_cjs.finite(chart.axisLineWidth, 0);
|
|
4367
|
+
const tickLength = chunkQL7MNEMT_cjs.finite(chart.tickLength, 0);
|
|
4266
4368
|
if (lineWidth <= 0 && tickLength <= 0) {
|
|
4267
4369
|
return [];
|
|
4268
4370
|
}
|
|
@@ -4283,20 +4385,20 @@ function buildAxisLines(chart, layout, order) {
|
|
|
4283
4385
|
}
|
|
4284
4386
|
add("line-x", `M ${plot.x} ${bottom} L ${plot.x + plot.width} ${bottom}`);
|
|
4285
4387
|
}
|
|
4286
|
-
if (tickLength > 0 &&
|
|
4287
|
-
|
|
4288
|
-
const x = plot.x +
|
|
4388
|
+
if (tickLength > 0 && chunkQL7MNEMT_cjs.isHorizontalBar(chart)) {
|
|
4389
|
+
chunkQL7MNEMT_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4390
|
+
const x = plot.x + chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4289
4391
|
add(`tick-v-${tick}`, `M ${x} ${bottom} L ${x} ${bottom + tickLength}`);
|
|
4290
4392
|
});
|
|
4291
|
-
const rows =
|
|
4393
|
+
const rows = chunkQL7MNEMT_cjs.horizontalRows(chart, plot);
|
|
4292
4394
|
for (let index = 0; index < rows.count; index++) {
|
|
4293
|
-
const y =
|
|
4395
|
+
const y = chunkQL7MNEMT_cjs.rowTop(rows, plot, index) + rows.labelRow + rows.barsHeight / 2;
|
|
4294
4396
|
add(`tick-c-${index}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
4295
4397
|
}
|
|
4296
4398
|
}
|
|
4297
|
-
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !
|
|
4298
|
-
|
|
4299
|
-
const y = bottom -
|
|
4399
|
+
if (tickLength > 0 && !isHorizontalBoxplot2(chart) && !chunkQL7MNEMT_cjs.isHorizontalBar(chart)) {
|
|
4400
|
+
chunkQL7MNEMT_cjs.chartTicks(chart.axisY).forEach((tick) => {
|
|
4401
|
+
const y = bottom - chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
4300
4402
|
add(`tick-y-${tick}`, `M ${plot.x - tickLength} ${y} L ${plot.x} ${y}`);
|
|
4301
4403
|
});
|
|
4302
4404
|
xTickPositions(chart, layout).forEach((x, index) => {
|
|
@@ -4311,14 +4413,14 @@ function categoryNames(chart, count) {
|
|
|
4311
4413
|
}
|
|
4312
4414
|
function buildHorizontalBarAxes(chart, layout, order) {
|
|
4313
4415
|
const { plot, bounds } = layout;
|
|
4314
|
-
const rows =
|
|
4416
|
+
const rows = chunkQL7MNEMT_cjs.horizontalRows(chart, plot);
|
|
4315
4417
|
const above = chart.categoryAlign === "left";
|
|
4316
4418
|
const inside = chart.categoryAlign === "inside";
|
|
4317
4419
|
const editable = Boolean(chart.config?.categories?.length);
|
|
4318
4420
|
const nodes = categoryNames(chart, rows.count).map((name, index) => {
|
|
4319
|
-
const top =
|
|
4421
|
+
const top = chunkQL7MNEMT_cjs.rowTop(rows, plot, index);
|
|
4320
4422
|
return {
|
|
4321
|
-
...
|
|
4423
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4322
4424
|
role: "axis",
|
|
4323
4425
|
id: `chart-y-category-${chart.id}-${index}`,
|
|
4324
4426
|
order: order + index,
|
|
@@ -4328,19 +4430,19 @@ function buildHorizontalBarAxes(chart, layout, order) {
|
|
|
4328
4430
|
chart,
|
|
4329
4431
|
align: above || inside ? "left" : "right"
|
|
4330
4432
|
}),
|
|
4331
|
-
prop: editable ?
|
|
4433
|
+
prop: editable ? chunkQL7MNEMT_cjs.categoryProp(index) : void 0
|
|
4332
4434
|
};
|
|
4333
4435
|
});
|
|
4334
4436
|
if (chart.showValueAxis !== false) {
|
|
4335
|
-
|
|
4336
|
-
const x = plot.x +
|
|
4437
|
+
chunkQL7MNEMT_cjs.chartTicks(chart.axisY).forEach((tick, index) => {
|
|
4438
|
+
const x = plot.x + chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4337
4439
|
nodes.push(
|
|
4338
|
-
|
|
4440
|
+
chunkQL7MNEMT_cjs.chartText({
|
|
4339
4441
|
role: "axis",
|
|
4340
4442
|
id: `chart-x-tick-${chart.id}-${tick}`,
|
|
4341
4443
|
order: order + rows.count + index,
|
|
4342
4444
|
bounds,
|
|
4343
|
-
frame: { x: x - 20, y: plot.y + plot.height + 4 +
|
|
4445
|
+
frame: { x: x - 20, y: plot.y + plot.height + 4 + chunkQL7MNEMT_cjs.finite(chart.tickLength, 0), width: 40, height: 18 },
|
|
4344
4446
|
text: String(tick),
|
|
4345
4447
|
chart,
|
|
4346
4448
|
align: "center"
|
|
@@ -4359,7 +4461,7 @@ function buildChartAxes(chart, layout, order) {
|
|
|
4359
4461
|
return lines;
|
|
4360
4462
|
}
|
|
4361
4463
|
order += lines.length;
|
|
4362
|
-
if (
|
|
4464
|
+
if (chunkQL7MNEMT_cjs.isHorizontalBar(chart)) {
|
|
4363
4465
|
return [...lines, ...buildHorizontalBarAxes(chart, layout, order)];
|
|
4364
4466
|
}
|
|
4365
4467
|
const xTicks = buildXAxisTicks(chart, layout, order);
|
|
@@ -4437,7 +4539,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4437
4539
|
const centerX = plot.x + plot.width / 2;
|
|
4438
4540
|
const centerY = plot.y + plot.height / 2;
|
|
4439
4541
|
const radius = Math.max(0, Math.min(plot.width, plot.height) / 2);
|
|
4440
|
-
const width =
|
|
4542
|
+
const width = chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1);
|
|
4441
4543
|
if (chart.gridLineStyle === "dotted") {
|
|
4442
4544
|
return buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width);
|
|
4443
4545
|
}
|
|
@@ -4448,7 +4550,7 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4448
4550
|
...gridLineDashStyle(chart, width)
|
|
4449
4551
|
};
|
|
4450
4552
|
const nodes = [];
|
|
4451
|
-
|
|
4553
|
+
chunkQL7MNEMT_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min).forEach((tick) => {
|
|
4452
4554
|
const ringRadius = radius * ringRatio(chart, tick);
|
|
4453
4555
|
nodes.push({
|
|
4454
4556
|
type: "ellipse",
|
|
@@ -4462,8 +4564,8 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4462
4564
|
style
|
|
4463
4565
|
});
|
|
4464
4566
|
});
|
|
4465
|
-
|
|
4466
|
-
const angle =
|
|
4567
|
+
chunkQL7MNEMT_cjs.chartTicks(chart.axisX).forEach((tick) => {
|
|
4568
|
+
const angle = chunkQL7MNEMT_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, tick);
|
|
4467
4569
|
const edgeX = centerX + Math.cos(angle) * radius;
|
|
4468
4570
|
const edgeY = centerY + Math.sin(angle) * radius;
|
|
4469
4571
|
nodes.push({
|
|
@@ -4478,13 +4580,13 @@ function buildCircularChartGrid(chart, plot, bounds, order) {
|
|
|
4478
4580
|
return nodes;
|
|
4479
4581
|
}
|
|
4480
4582
|
function buildDottedCircularGrid(chart, bounds, order, centerX, centerY, radius, width) {
|
|
4481
|
-
const yTicks =
|
|
4482
|
-
const xTicks =
|
|
4583
|
+
const yTicks = chunkQL7MNEMT_cjs.chartTicks(chart.axisY).filter((tick) => tick > chart.axisY.min);
|
|
4584
|
+
const xTicks = chunkQL7MNEMT_cjs.chartTicks(chart.axisX);
|
|
4483
4585
|
const nodes = [];
|
|
4484
4586
|
yTicks.forEach((yTick) => {
|
|
4485
4587
|
const ringRadius = radius * ringRatio(chart, yTick);
|
|
4486
4588
|
xTicks.forEach((xTick) => {
|
|
4487
|
-
const angle =
|
|
4589
|
+
const angle = chunkQL7MNEMT_cjs.angleForAxisValue(chart.axisX.min, chart.axisX.max, xTick);
|
|
4488
4590
|
const x = centerX + Math.cos(angle) * ringRadius;
|
|
4489
4591
|
const y = centerY + Math.sin(angle) * ringRadius;
|
|
4490
4592
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
@@ -4506,8 +4608,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4506
4608
|
if (chart.gridShape === "circle" && CIRCULAR_GRID_CHART_TYPES.has(chart.chartType)) {
|
|
4507
4609
|
return buildCircularChartGrid(chart, plot, bounds, order);
|
|
4508
4610
|
}
|
|
4509
|
-
const width =
|
|
4510
|
-
if (
|
|
4611
|
+
const width = chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1);
|
|
4612
|
+
if (chunkQL7MNEMT_cjs.isHorizontalBar(chart)) {
|
|
4511
4613
|
return buildHorizontalBarGrid(chart, plot, bounds, order, width);
|
|
4512
4614
|
}
|
|
4513
4615
|
const clip = chart.chartType === "field" ? fieldSurfaceClip(chart, plot) : void 0;
|
|
@@ -4522,8 +4624,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4522
4624
|
clip
|
|
4523
4625
|
};
|
|
4524
4626
|
const nodes = [];
|
|
4525
|
-
(chart.gridAxes === "y" ? [] :
|
|
4526
|
-
const x = plot.x +
|
|
4627
|
+
(chart.gridAxes === "y" ? [] : chunkQL7MNEMT_cjs.chartTicks(chart.axisX)).forEach((tick) => {
|
|
4628
|
+
const x = plot.x + chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisX, plot.width);
|
|
4527
4629
|
nodes.push({
|
|
4528
4630
|
type: "path",
|
|
4529
4631
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -4533,8 +4635,8 @@ function buildChartGrid(chart, plot, bounds, order) {
|
|
|
4533
4635
|
style
|
|
4534
4636
|
});
|
|
4535
4637
|
});
|
|
4536
|
-
(chart.gridAxes === "x" ? [] :
|
|
4537
|
-
const y = plot.y + plot.height -
|
|
4638
|
+
(chart.gridAxes === "x" ? [] : chunkQL7MNEMT_cjs.chartTicks(chart.axisY)).forEach((tick) => {
|
|
4639
|
+
const y = plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisY, plot.height);
|
|
4538
4640
|
nodes.push({
|
|
4539
4641
|
type: "path",
|
|
4540
4642
|
id: `chart-grid-y-${chart.id}-${tick}`,
|
|
@@ -4556,8 +4658,8 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
4556
4658
|
strokeWidth: width,
|
|
4557
4659
|
...chart.gridLineStyle === "dotted" ? { dash: [0.1, width * 3], lineCap: "round" } : gridLineDashStyle(chart, width)
|
|
4558
4660
|
};
|
|
4559
|
-
return
|
|
4560
|
-
const x = plot.x +
|
|
4661
|
+
return chunkQL7MNEMT_cjs.chartTicks(chart.axisY).map((tick, index) => {
|
|
4662
|
+
const x = plot.x + chunkQL7MNEMT_cjs.mapChartValue(tick, chart.axisY, plot.width);
|
|
4561
4663
|
return {
|
|
4562
4664
|
type: "path",
|
|
4563
4665
|
id: `chart-grid-x-${chart.id}-${tick}`,
|
|
@@ -4569,13 +4671,13 @@ function buildHorizontalBarGrid(chart, plot, bounds, order, width) {
|
|
|
4569
4671
|
});
|
|
4570
4672
|
}
|
|
4571
4673
|
function buildDottedRectGrid(chart, plot, bounds, order, width, clip) {
|
|
4572
|
-
const xTicks =
|
|
4573
|
-
const yTicks =
|
|
4674
|
+
const xTicks = chunkQL7MNEMT_cjs.chartTicks(chart.axisX);
|
|
4675
|
+
const yTicks = chunkQL7MNEMT_cjs.chartTicks(chart.axisY);
|
|
4574
4676
|
const nodes = [];
|
|
4575
4677
|
xTicks.forEach((xTick) => {
|
|
4576
|
-
const x = plot.x +
|
|
4678
|
+
const x = plot.x + chunkQL7MNEMT_cjs.mapChartValue(xTick, chart.axisX, plot.width);
|
|
4577
4679
|
yTicks.forEach((yTick) => {
|
|
4578
|
-
const y = plot.y + plot.height -
|
|
4680
|
+
const y = plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(yTick, chart.axisY, plot.height);
|
|
4579
4681
|
const id = `chart-grid-dot-${chart.id}-${xTick}-${yTick}`;
|
|
4580
4682
|
nodes.push(createGridDot(chart, id, order + nodes.length, bounds, x, y, width, clip));
|
|
4581
4683
|
});
|
|
@@ -4598,7 +4700,7 @@ function createChartRuleMarks(render2) {
|
|
|
4598
4700
|
return {
|
|
4599
4701
|
rule,
|
|
4600
4702
|
color: rule.color || render2.chart.strokeColor || "#475569",
|
|
4601
|
-
y: render2.plot.y + render2.plot.height -
|
|
4703
|
+
y: render2.plot.y + render2.plot.height - chunkQL7MNEMT_cjs.mapChartValue(rule.at, render2.chart.axisY, render2.plot.height),
|
|
4602
4704
|
lineOrder,
|
|
4603
4705
|
labelOrder
|
|
4604
4706
|
};
|
|
@@ -4618,7 +4720,7 @@ function createChartRuleLine(render2, mark) {
|
|
|
4618
4720
|
order: mark.lineOrder,
|
|
4619
4721
|
bounds: render2.bounds,
|
|
4620
4722
|
d: `M ${render2.plot.x} ${mark.y} L ${render2.plot.x + render2.plot.width} ${mark.y}`,
|
|
4621
|
-
prop:
|
|
4723
|
+
prop: chunkQL7MNEMT_cjs.ruleAtProp(mark.rule.id),
|
|
4622
4724
|
propKind: "value",
|
|
4623
4725
|
style: {
|
|
4624
4726
|
fill: { kind: "none" },
|
|
@@ -4629,9 +4731,9 @@ function createChartRuleLine(render2, mark) {
|
|
|
4629
4731
|
};
|
|
4630
4732
|
}
|
|
4631
4733
|
function createChartRuleLabel(render2, mark) {
|
|
4632
|
-
const fontSize = Math.max(9,
|
|
4734
|
+
const fontSize = Math.max(9, chunkQL7MNEMT_cjs.finite(render2.chart.fontSize, 12) - 2);
|
|
4633
4735
|
return {
|
|
4634
|
-
...
|
|
4736
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4635
4737
|
id: `chart-rule-label-${render2.chart.id}-${mark.rule.id}`,
|
|
4636
4738
|
order: mark.labelOrder ?? mark.lineOrder + 1,
|
|
4637
4739
|
bounds: render2.bounds,
|
|
@@ -4640,19 +4742,19 @@ function createChartRuleLabel(render2, mark) {
|
|
|
4640
4742
|
chart: render2.chart
|
|
4641
4743
|
}),
|
|
4642
4744
|
color: mark.color,
|
|
4643
|
-
prop:
|
|
4745
|
+
prop: chunkQL7MNEMT_cjs.ruleTextProp(mark.rule.id)
|
|
4644
4746
|
};
|
|
4645
4747
|
}
|
|
4646
4748
|
|
|
4647
4749
|
// src/renderScene/charts/chartBackdrop.ts
|
|
4648
4750
|
function chartImageRect(chart) {
|
|
4649
|
-
const inset =
|
|
4751
|
+
const inset = chunkQL7MNEMT_cjs.finite(chart.strokeWidth, 1) / 2;
|
|
4650
4752
|
return {
|
|
4651
4753
|
x: chart.x + inset,
|
|
4652
4754
|
y: chart.y + inset,
|
|
4653
4755
|
width: Math.max(1, chart.width - inset * 2),
|
|
4654
4756
|
height: Math.max(1, chart.height - inset * 2),
|
|
4655
|
-
rx: Math.max(0,
|
|
4757
|
+
rx: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.cornerRadius, 12) - inset)
|
|
4656
4758
|
};
|
|
4657
4759
|
}
|
|
4658
4760
|
function buildChartBackdrop(chart, bounds, order) {
|
|
@@ -4694,7 +4796,7 @@ function buildChartBackdrop(chart, bounds, order) {
|
|
|
4694
4796
|
// src/renderScene/charts/renderers/bar/glass.ts
|
|
4695
4797
|
function createGlassBackdropNodes(context, id, d) {
|
|
4696
4798
|
const { chart, bounds, nextOrder } = context;
|
|
4697
|
-
const blur =
|
|
4799
|
+
const blur = chunkQL7MNEMT_cjs.finite(chart.config?.barGlassBlur, 0);
|
|
4698
4800
|
if (blur <= 0 || !chart.fillImage) {
|
|
4699
4801
|
return [];
|
|
4700
4802
|
}
|
|
@@ -4712,7 +4814,7 @@ function createGlassBackdropNodes(context, id, d) {
|
|
|
4712
4814
|
href: chart.fillImage.url,
|
|
4713
4815
|
style: {
|
|
4714
4816
|
blur,
|
|
4715
|
-
saturate:
|
|
4817
|
+
saturate: chunkQL7MNEMT_cjs.finite(chart.config?.barGlassSaturation, 1),
|
|
4716
4818
|
clip: { type: "path", d },
|
|
4717
4819
|
pointerEvents: "none"
|
|
4718
4820
|
}
|
|
@@ -4763,8 +4865,8 @@ function createBarGlowNode(context, id, d, color, glow, bounds = context.bounds)
|
|
|
4763
4865
|
bounds,
|
|
4764
4866
|
d,
|
|
4765
4867
|
style: {
|
|
4766
|
-
fill:
|
|
4767
|
-
shadow: { color:
|
|
4868
|
+
fill: chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id),
|
|
4869
|
+
shadow: { color: chunkQL7MNEMT_cjs.representativeColor(color, "#ffffff"), opacity: 0.9, blur: glow, dx: 0, dy: 0 },
|
|
4768
4870
|
pointerEvents: "none"
|
|
4769
4871
|
}
|
|
4770
4872
|
};
|
|
@@ -4775,14 +4877,14 @@ function barLabelsEnabled(context) {
|
|
|
4775
4877
|
return context.chart.config?.showBarLabels === true;
|
|
4776
4878
|
}
|
|
4777
4879
|
function resolvePlacement(target, size) {
|
|
4778
|
-
const fits = target.frame.height >= size.height +
|
|
4880
|
+
const fits = target.frame.height >= size.height + chunkQL7MNEMT_cjs.BAR_LABEL.gap * 2;
|
|
4779
4881
|
return target.placement !== "outside" && !fits ? "outside" : target.placement;
|
|
4780
4882
|
}
|
|
4781
4883
|
function labelTop(placement, frame, height) {
|
|
4782
4884
|
if (placement === "outside") {
|
|
4783
|
-
return frame.y - height -
|
|
4885
|
+
return frame.y - height - chunkQL7MNEMT_cjs.BAR_LABEL.gap;
|
|
4784
4886
|
}
|
|
4785
|
-
return placement === "inside" ? frame.y +
|
|
4887
|
+
return placement === "inside" ? frame.y + chunkQL7MNEMT_cjs.BAR_LABEL.gap : frame.y + frame.height / 2 - height / 2;
|
|
4786
4888
|
}
|
|
4787
4889
|
function createPillNode(context, id, box, color) {
|
|
4788
4890
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
@@ -4792,11 +4894,11 @@ function createPillNode(context, id, box, color) {
|
|
|
4792
4894
|
id: `${id}-pill`,
|
|
4793
4895
|
order: nextOrder(),
|
|
4794
4896
|
bounds,
|
|
4795
|
-
d:
|
|
4897
|
+
d: chunkQL7MNEMT_cjs.pillPath(box.left, box.top, box.width, box.height),
|
|
4796
4898
|
style: {
|
|
4797
|
-
fill: config?.barLabelPillColor ?
|
|
4798
|
-
stroke:
|
|
4799
|
-
strokeWidth:
|
|
4899
|
+
fill: config?.barLabelPillColor ? chunkQL7MNEMT_cjs.paint(config.barLabelPillColor, diagnostics, chart.id) : { kind: "none" },
|
|
4900
|
+
stroke: chunkQL7MNEMT_cjs.paint(config?.barLabelBorderColor ?? color, diagnostics, chart.id),
|
|
4901
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(config?.barLabelBorderWidth, 1),
|
|
4800
4902
|
pointerEvents: "none"
|
|
4801
4903
|
}
|
|
4802
4904
|
};
|
|
@@ -4805,7 +4907,7 @@ function createTextNode(context, id, box, text, placement, fontSize, color) {
|
|
|
4805
4907
|
const { chart, bounds, nextOrder } = context;
|
|
4806
4908
|
const config = chart.config;
|
|
4807
4909
|
return {
|
|
4808
|
-
...
|
|
4910
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4809
4911
|
id,
|
|
4810
4912
|
order: nextOrder(),
|
|
4811
4913
|
bounds,
|
|
@@ -4826,7 +4928,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4826
4928
|
const config = chart.config;
|
|
4827
4929
|
const top = plot.y + plot.height + 4 + 16 + Math.max(0, chart.tickLength ?? 0);
|
|
4828
4930
|
return {
|
|
4829
|
-
...
|
|
4931
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
4830
4932
|
id: target.id,
|
|
4831
4933
|
order: nextOrder(),
|
|
4832
4934
|
bounds,
|
|
@@ -4835,7 +4937,7 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4835
4937
|
y: target.frame.y + target.frame.height / 2 - fontSize * 0.6,
|
|
4836
4938
|
width: plot.width - 14,
|
|
4837
4939
|
height: fontSize * 1.2
|
|
4838
|
-
} : { x: plot.x, y: target.frame.y -
|
|
4940
|
+
} : { x: plot.x, y: target.frame.y - chunkQL7MNEMT_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 },
|
|
4839
4941
|
text,
|
|
4840
4942
|
chart,
|
|
4841
4943
|
align: target.horizontal ? "right" : chart.categoryAlign === "left" ? "left" : "center"
|
|
@@ -4849,24 +4951,24 @@ function createAxisValueNode(context, target, text, fontSize) {
|
|
|
4849
4951
|
}
|
|
4850
4952
|
function horizontalPlacement(target, size) {
|
|
4851
4953
|
const requested = target.placement === "axis" ? "outside" : target.placement;
|
|
4852
|
-
const fits = target.frame.width >= size.width +
|
|
4954
|
+
const fits = target.frame.width >= size.width + chunkQL7MNEMT_cjs.BAR_LABEL.gap * 2;
|
|
4853
4955
|
return requested !== "outside" && !fits ? "outside" : requested;
|
|
4854
4956
|
}
|
|
4855
4957
|
function horizontalBox(target, size, placement) {
|
|
4856
4958
|
const { frame } = target;
|
|
4857
|
-
const left = placement === "outside" ? frame.x + frame.width +
|
|
4959
|
+
const left = placement === "outside" ? frame.x + frame.width + chunkQL7MNEMT_cjs.BAR_LABEL.gap : placement === "inside" ? frame.x + frame.width - size.width - chunkQL7MNEMT_cjs.BAR_LABEL.gap : frame.x + frame.width / 2 - size.width / 2;
|
|
4858
4960
|
return { ...size, left, top: frame.y + frame.height / 2 - size.height / 2 };
|
|
4859
4961
|
}
|
|
4860
4962
|
function createBarLabelNodes(context, target) {
|
|
4861
4963
|
const { chart } = context;
|
|
4862
4964
|
const config = chart.config;
|
|
4863
|
-
const fontSize = Math.max(8,
|
|
4864
|
-
const text =
|
|
4965
|
+
const fontSize = Math.max(8, chunkQL7MNEMT_cjs.finite(config?.barLabelFontSize, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12)));
|
|
4966
|
+
const text = chunkQL7MNEMT_cjs.formatBarLabel(target.value, config?.barLabelFormat);
|
|
4865
4967
|
if (target.placement === "axis") {
|
|
4866
4968
|
return [createAxisValueNode(context, target, text, fontSize)];
|
|
4867
4969
|
}
|
|
4868
4970
|
const pill = config?.barLabelPill === true;
|
|
4869
|
-
const size =
|
|
4971
|
+
const size = chunkQL7MNEMT_cjs.barLabelSize(text, fontSize, pill);
|
|
4870
4972
|
const placement = target.horizontal ? horizontalPlacement(target, size) : resolvePlacement(target, size);
|
|
4871
4973
|
const box = target.horizontal ? horizontalBox(target, size, placement) : {
|
|
4872
4974
|
...size,
|
|
@@ -4907,7 +5009,7 @@ function barTrackClip(context, frame) {
|
|
|
4907
5009
|
}
|
|
4908
5010
|
return {
|
|
4909
5011
|
type: "path",
|
|
4910
|
-
d:
|
|
5012
|
+
d: chunkQL7MNEMT_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, context.chart.config?.barCornerRadius ?? 2)
|
|
4911
5013
|
};
|
|
4912
5014
|
}
|
|
4913
5015
|
function barTrackEnabled(context) {
|
|
@@ -4917,8 +5019,8 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
4917
5019
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
4918
5020
|
const config = chart.config;
|
|
4919
5021
|
const radius = config?.barCornerRadius ?? 2;
|
|
4920
|
-
const segments =
|
|
4921
|
-
const d = segments > 0 ?
|
|
5022
|
+
const segments = chunkQL7MNEMT_cjs.finite(config?.barSegments, 0);
|
|
5023
|
+
const d = segments > 0 ? chunkQL7MNEMT_cjs.segmentedBarPath(frame, orientation, segments, chunkQL7MNEMT_cjs.finite(config?.barSegmentGap, 4), radius, 1, true) : chunkQL7MNEMT_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, radius);
|
|
4922
5024
|
const nodes = [
|
|
4923
5025
|
{
|
|
4924
5026
|
type: "path",
|
|
@@ -4927,7 +5029,7 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
4927
5029
|
bounds,
|
|
4928
5030
|
d,
|
|
4929
5031
|
style: {
|
|
4930
|
-
fill:
|
|
5032
|
+
fill: chunkQL7MNEMT_cjs.paint(config?.barTrackColor ?? chart.gridColor ?? "#e2e8f0", diagnostics, chart.id),
|
|
4931
5033
|
pointerEvents: "none"
|
|
4932
5034
|
}
|
|
4933
5035
|
}
|
|
@@ -4943,13 +5045,13 @@ function createBarTrackNodes(context, id, frame, orientation = "vertical") {
|
|
|
4943
5045
|
frame.y,
|
|
4944
5046
|
frame.width,
|
|
4945
5047
|
frame.height,
|
|
4946
|
-
|
|
4947
|
-
Math.max(MIN_HATCH_SPACING,
|
|
5048
|
+
chunkQL7MNEMT_cjs.finite(config.barTrackHatchAngle, DEFAULT_HATCH.angle),
|
|
5049
|
+
Math.max(MIN_HATCH_SPACING, chunkQL7MNEMT_cjs.finite(config.barTrackHatchSpacing, DEFAULT_HATCH.spacing))
|
|
4948
5050
|
),
|
|
4949
5051
|
style: {
|
|
4950
5052
|
fill: { kind: "none" },
|
|
4951
|
-
stroke:
|
|
4952
|
-
strokeWidth:
|
|
5053
|
+
stroke: chunkQL7MNEMT_cjs.paint(config.barTrackHatchColor ?? chart.gridColor ?? "#cbd5e1", diagnostics, chart.id),
|
|
5054
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(config.barTrackHatchWidth, DEFAULT_HATCH.width),
|
|
4953
5055
|
pointerEvents: "none",
|
|
4954
5056
|
clip: { type: "path", d }
|
|
4955
5057
|
}
|
|
@@ -4996,23 +5098,23 @@ function groupedShape(context, frame) {
|
|
|
4996
5098
|
const { chart, plot } = context;
|
|
4997
5099
|
const config = chart.config;
|
|
4998
5100
|
const radius = config?.barCornerRadius ?? 2;
|
|
4999
|
-
const segments =
|
|
5101
|
+
const segments = chunkQL7MNEMT_cjs.finite(config?.barSegments, 0);
|
|
5000
5102
|
if (segments > 0) {
|
|
5001
|
-
return
|
|
5103
|
+
return chunkQL7MNEMT_cjs.segmentedBarPath(
|
|
5002
5104
|
{ x: frame.x, y: plot.y, width: frame.width, height: plot.height },
|
|
5003
5105
|
"vertical",
|
|
5004
5106
|
segments,
|
|
5005
|
-
|
|
5107
|
+
chunkQL7MNEMT_cjs.finite(config?.barSegmentGap, 4),
|
|
5006
5108
|
radius,
|
|
5007
5109
|
frame.height / plot.height,
|
|
5008
5110
|
config?.barSegmentSnap !== false
|
|
5009
5111
|
);
|
|
5010
5112
|
}
|
|
5011
|
-
return
|
|
5113
|
+
return chunkQL7MNEMT_cjs.barPath(frame.x, frame.y, frame.width, frame.height, radius, config?.barRoundedBottom === true);
|
|
5012
5114
|
}
|
|
5013
5115
|
function createGroupedGlow(context, mark) {
|
|
5014
5116
|
const { chart } = context;
|
|
5015
|
-
const glow =
|
|
5117
|
+
const glow = chunkQL7MNEMT_cjs.finite(chart.config?.barGlow, 0);
|
|
5016
5118
|
if (glow <= 0 || mark.frame.height <= 0) {
|
|
5017
5119
|
return [];
|
|
5018
5120
|
}
|
|
@@ -5023,10 +5125,10 @@ function createGroupedGlow(context, mark) {
|
|
|
5023
5125
|
}
|
|
5024
5126
|
function createGroupedBarLayout(context) {
|
|
5025
5127
|
const { chart, plot } = context;
|
|
5026
|
-
const valueCount =
|
|
5128
|
+
const valueCount = chunkQL7MNEMT_cjs.barCategoryCount(chart);
|
|
5027
5129
|
const slotWidth = plot.width / valueCount;
|
|
5028
|
-
const groupGap = Math.min(Math.max(0,
|
|
5029
|
-
const barGap = Math.max(0,
|
|
5130
|
+
const groupGap = Math.min(Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
5131
|
+
const barGap = Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.barGap, 2));
|
|
5030
5132
|
return {
|
|
5031
5133
|
slotWidth,
|
|
5032
5134
|
seriesWidth: Math.max(1, (slotWidth - groupGap) / Math.max(1, chart.series.length)),
|
|
@@ -5036,10 +5138,10 @@ function createGroupedBarLayout(context) {
|
|
|
5036
5138
|
}
|
|
5037
5139
|
function createSeriesBarMarks(context, layout, series, seriesIndex) {
|
|
5038
5140
|
const { chart, plot } = context;
|
|
5039
|
-
const seriesColor2 = series.color ??
|
|
5141
|
+
const seriesColor2 = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
5040
5142
|
return series.values.map((value, valueIndex) => {
|
|
5041
5143
|
const numericValue = Array.isArray(value) ? value[1] : value;
|
|
5042
|
-
const height = Math.max(0,
|
|
5144
|
+
const height = Math.max(0, chunkQL7MNEMT_cjs.mapChartValue(numericValue, chart.axisY, plot.height));
|
|
5043
5145
|
return {
|
|
5044
5146
|
seriesId: series.id,
|
|
5045
5147
|
valueIndex,
|
|
@@ -5073,10 +5175,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
5073
5175
|
const radius = chart.config?.barCornerRadius ?? 2;
|
|
5074
5176
|
const { x, width } = mark.frame;
|
|
5075
5177
|
const path = groupedShape(context, mark.frame);
|
|
5076
|
-
const fill2 =
|
|
5077
|
-
const stroke =
|
|
5078
|
-
const strokeWidth =
|
|
5079
|
-
const shadow =
|
|
5178
|
+
const fill2 = chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5179
|
+
const stroke = chunkQL7MNEMT_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5180
|
+
const strokeWidth = chunkQL7MNEMT_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5181
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5080
5182
|
const shadowCaster = shadow ? {
|
|
5081
5183
|
type: "path",
|
|
5082
5184
|
id: `chart-bar-shadow-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
@@ -5106,10 +5208,10 @@ function createGroupedBarNodes(context, mark) {
|
|
|
5106
5208
|
valueIndex: mark.valueIndex,
|
|
5107
5209
|
mark: "bar",
|
|
5108
5210
|
radius,
|
|
5109
|
-
colorProp:
|
|
5211
|
+
colorProp: chunkQL7MNEMT_cjs.seriesValueColorProp(mark.seriesId, mark.valueIndex),
|
|
5110
5212
|
hasColorOverride: mark.hasColorOverride
|
|
5111
5213
|
},
|
|
5112
|
-
prop:
|
|
5214
|
+
prop: chunkQL7MNEMT_cjs.seriesValueProp(mark.seriesId, mark.valueIndex),
|
|
5113
5215
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
5114
5216
|
};
|
|
5115
5217
|
const glass = createGlassBackdropNodes(context, `${mark.seriesId}-${mark.valueIndex}`, path);
|
|
@@ -5120,15 +5222,15 @@ function createGroupedBarError(context, mark) {
|
|
|
5120
5222
|
return null;
|
|
5121
5223
|
}
|
|
5122
5224
|
const { chart, plot, bounds, nextOrder } = context;
|
|
5123
|
-
const [lower, upper] =
|
|
5124
|
-
return
|
|
5225
|
+
const [lower, upper] = chunkQL7MNEMT_cjs.errorBarRange(mark.value, mark.error);
|
|
5226
|
+
return chunkQL7MNEMT_cjs.createVerticalErrorWhiskerNode({
|
|
5125
5227
|
id: `chart-bar-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
5126
5228
|
order: nextOrder(),
|
|
5127
5229
|
bounds,
|
|
5128
5230
|
geometry: {
|
|
5129
5231
|
centerX: mark.frame.x + mark.frame.width / 2,
|
|
5130
|
-
startY: plot.y + plot.height -
|
|
5131
|
-
endY: plot.y + plot.height -
|
|
5232
|
+
startY: plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
5233
|
+
endY: plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
5132
5234
|
},
|
|
5133
5235
|
color: chart.textColor ?? "#0f172a",
|
|
5134
5236
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -5138,9 +5240,9 @@ function createGroupedBarError(context, mark) {
|
|
|
5138
5240
|
// src/renderScene/charts/renderers/bar/horizontal.ts
|
|
5139
5241
|
function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
5140
5242
|
const { chart, plot } = context;
|
|
5141
|
-
const top =
|
|
5243
|
+
const top = chunkQL7MNEMT_cjs.rowTop(rows, plot, valueIndex) + rows.labelRow;
|
|
5142
5244
|
if (context.stackedMode) {
|
|
5143
|
-
const segment =
|
|
5245
|
+
const segment = chunkQL7MNEMT_cjs.stackedSegment(chart, context.stackedMode, valueIndex, seriesIndex, plot.width);
|
|
5144
5246
|
const start = Math.min(segment.pixelStart, segment.pixelEnd);
|
|
5145
5247
|
return {
|
|
5146
5248
|
x: plot.x + start,
|
|
@@ -5149,27 +5251,27 @@ function barFrame(context, rows, seriesIndex, valueIndex, value) {
|
|
|
5149
5251
|
height: rows.barsHeight
|
|
5150
5252
|
};
|
|
5151
5253
|
}
|
|
5152
|
-
const barGap = Math.max(0,
|
|
5254
|
+
const barGap = Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.barGap, 2));
|
|
5153
5255
|
const seriesHeight = rows.barsHeight / Math.max(1, chart.series.length);
|
|
5154
|
-
const width = Math.max(0,
|
|
5256
|
+
const width = Math.max(0, chunkQL7MNEMT_cjs.mapChartValue(value, chart.axisY, plot.width));
|
|
5155
5257
|
return { x: plot.x, y: top + seriesIndex * seriesHeight, width, height: Math.max(1, seriesHeight - barGap) };
|
|
5156
5258
|
}
|
|
5157
5259
|
function barPath2(context, frame) {
|
|
5158
5260
|
const { chart, plot } = context;
|
|
5159
5261
|
const config = chart.config;
|
|
5160
|
-
const segments = context.stackedMode && chart.series.length > 1 ? 0 :
|
|
5262
|
+
const segments = context.stackedMode && chart.series.length > 1 ? 0 : chunkQL7MNEMT_cjs.finite(config?.barSegments, 0);
|
|
5161
5263
|
if (segments > 0) {
|
|
5162
|
-
return
|
|
5264
|
+
return chunkQL7MNEMT_cjs.segmentedBarPath(
|
|
5163
5265
|
{ x: plot.x, y: frame.y, width: plot.width, height: frame.height },
|
|
5164
5266
|
"horizontal",
|
|
5165
5267
|
segments,
|
|
5166
|
-
|
|
5268
|
+
chunkQL7MNEMT_cjs.finite(config?.barSegmentGap, 4),
|
|
5167
5269
|
config?.barCornerRadius ?? 2,
|
|
5168
5270
|
frame.width / plot.width,
|
|
5169
5271
|
config?.barSegmentSnap !== false
|
|
5170
5272
|
);
|
|
5171
5273
|
}
|
|
5172
|
-
return
|
|
5274
|
+
return chunkQL7MNEMT_cjs.roundedBarPath(frame.x, frame.y, frame.width, frame.height, config?.barCornerRadius ?? 2);
|
|
5173
5275
|
}
|
|
5174
5276
|
function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
5175
5277
|
const { plot } = context;
|
|
@@ -5189,16 +5291,16 @@ function markOf(context, rows, series, seriesIndex, valueIndex, value) {
|
|
|
5189
5291
|
maxY: frame.y + frame.height
|
|
5190
5292
|
},
|
|
5191
5293
|
path: barPath2(context, frame),
|
|
5192
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5294
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length]
|
|
5193
5295
|
};
|
|
5194
5296
|
}
|
|
5195
5297
|
function barNodes(context, mark) {
|
|
5196
5298
|
const { chart, diagnostics, nextOrder } = context;
|
|
5197
5299
|
const config = chart.config;
|
|
5198
|
-
const stroke =
|
|
5199
|
-
const strokeWidth =
|
|
5200
|
-
const shadow =
|
|
5201
|
-
const fill2 =
|
|
5300
|
+
const stroke = chunkQL7MNEMT_cjs.paint(config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5301
|
+
const strokeWidth = chunkQL7MNEMT_cjs.finite(config?.barBorderWidth, 0);
|
|
5302
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5303
|
+
const fill2 = chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5202
5304
|
const nodes = [...createGlassBackdropNodes(context, mark.id, mark.path)];
|
|
5203
5305
|
if (shadow) {
|
|
5204
5306
|
nodes.push({
|
|
@@ -5222,7 +5324,7 @@ function barNodes(context, mark) {
|
|
|
5222
5324
|
valueIndex: mark.valueIndex,
|
|
5223
5325
|
mark: "bar",
|
|
5224
5326
|
radius: config?.barCornerRadius ?? 2,
|
|
5225
|
-
colorProp:
|
|
5327
|
+
colorProp: chunkQL7MNEMT_cjs.seriesValueColorProp(mark.series.id, mark.valueIndex),
|
|
5226
5328
|
hasColorOverride: mark.series.colors?.[mark.valueIndex] != null
|
|
5227
5329
|
},
|
|
5228
5330
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
@@ -5252,7 +5354,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
5252
5354
|
layers.tracks.push(...createBarTrackNodes(context, mark.id, mark.trackFrame, "horizontal"));
|
|
5253
5355
|
}
|
|
5254
5356
|
layers.bars.push(...barNodes(context, mark));
|
|
5255
|
-
const glow =
|
|
5357
|
+
const glow = chunkQL7MNEMT_cjs.finite(chart.config?.barGlow, 0);
|
|
5256
5358
|
if (glow > 0 && mark.frame.width > 0) {
|
|
5257
5359
|
layers.glows.push(
|
|
5258
5360
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${mark.id}`, mark.path, mark.color, glow, mark.bounds)
|
|
@@ -5261,7 +5363,7 @@ function pushBar(context, rows, layers, series, seriesIndex, valueIndex, value,
|
|
|
5261
5363
|
layers.labels.push(...labelNodes2(context, mark, highest));
|
|
5262
5364
|
}
|
|
5263
5365
|
function renderHorizontalBars(context) {
|
|
5264
|
-
const rows =
|
|
5366
|
+
const rows = chunkQL7MNEMT_cjs.horizontalRows(context.chart, context.plot);
|
|
5265
5367
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
5266
5368
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
5267
5369
|
const numeric = series.values.map((value) => typeof value === "number" ? value : value[1]);
|
|
@@ -5276,8 +5378,8 @@ function renderHorizontalBars(context) {
|
|
|
5276
5378
|
// src/renderScene/charts/renderers/bar/stacked.ts
|
|
5277
5379
|
function slotOf(context, mode) {
|
|
5278
5380
|
const { chart, plot } = context;
|
|
5279
|
-
const slotWidth = plot.width /
|
|
5280
|
-
const groupGap = Math.min(Math.max(0,
|
|
5381
|
+
const slotWidth = plot.width / chunkQL7MNEMT_cjs.barCategoryCount(chart);
|
|
5382
|
+
const groupGap = Math.min(Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.barGroupGap, 8)), Math.max(0, slotWidth - 1));
|
|
5281
5383
|
return {
|
|
5282
5384
|
slotWidth,
|
|
5283
5385
|
groupGap,
|
|
@@ -5288,19 +5390,19 @@ function slotOf(context, mode) {
|
|
|
5288
5390
|
}
|
|
5289
5391
|
function pathOf(context, x, y, height, slot, radius) {
|
|
5290
5392
|
const { chart, plot } = context;
|
|
5291
|
-
const segments = chart.series.length === 1 ?
|
|
5393
|
+
const segments = chart.series.length === 1 ? chunkQL7MNEMT_cjs.finite(chart.config?.barSegments, 0) : 0;
|
|
5292
5394
|
if (segments > 0) {
|
|
5293
|
-
return
|
|
5395
|
+
return chunkQL7MNEMT_cjs.segmentedBarPath(
|
|
5294
5396
|
{ x, y: plot.y, width: slot.barWidth, height: plot.height },
|
|
5295
5397
|
"vertical",
|
|
5296
5398
|
segments,
|
|
5297
|
-
|
|
5399
|
+
chunkQL7MNEMT_cjs.finite(chart.config?.barSegmentGap, 4),
|
|
5298
5400
|
radius,
|
|
5299
5401
|
height / plot.height,
|
|
5300
5402
|
chart.config?.barSegmentSnap !== false
|
|
5301
5403
|
);
|
|
5302
5404
|
}
|
|
5303
|
-
return
|
|
5405
|
+
return chunkQL7MNEMT_cjs.barPath(x, y, slot.barWidth, height, radius, chart.config?.barRoundedBottom === true);
|
|
5304
5406
|
}
|
|
5305
5407
|
function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame) {
|
|
5306
5408
|
const { chart } = context;
|
|
@@ -5322,7 +5424,7 @@ function pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame
|
|
|
5322
5424
|
}
|
|
5323
5425
|
function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
5324
5426
|
const { chart, plot } = context;
|
|
5325
|
-
const segment =
|
|
5427
|
+
const segment = chunkQL7MNEMT_cjs.stackedSegment(chart, mode, valueIndex, seriesIndex, plot.height);
|
|
5326
5428
|
const radius = slot.outerSeriesIndex === null || seriesIndex === slot.outerSeriesIndex ? slot.cornerRadius : 0;
|
|
5327
5429
|
const x = plot.x + valueIndex * slot.slotWidth + slot.groupGap / 2;
|
|
5328
5430
|
const y = plot.y + plot.height - Math.max(segment.pixelStart, segment.pixelEnd);
|
|
@@ -5331,7 +5433,7 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
5331
5433
|
series,
|
|
5332
5434
|
valueIndex,
|
|
5333
5435
|
radius,
|
|
5334
|
-
color: series.colors?.[valueIndex] ?? series.color ??
|
|
5436
|
+
color: series.colors?.[valueIndex] ?? series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length],
|
|
5335
5437
|
x,
|
|
5336
5438
|
y,
|
|
5337
5439
|
height,
|
|
@@ -5342,10 +5444,10 @@ function markOf2(context, mode, slot, series, seriesIndex, valueIndex) {
|
|
|
5342
5444
|
function segmentNodes(context, mark) {
|
|
5343
5445
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
5344
5446
|
const { series, valueIndex, path } = mark;
|
|
5345
|
-
const fill2 =
|
|
5346
|
-
const stroke =
|
|
5347
|
-
const strokeWidth =
|
|
5348
|
-
const shadow =
|
|
5447
|
+
const fill2 = chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id);
|
|
5448
|
+
const stroke = chunkQL7MNEMT_cjs.paint(chart.config?.barBorderColor || "#000000", diagnostics, chart.id);
|
|
5449
|
+
const strokeWidth = chunkQL7MNEMT_cjs.finite(chart.config?.barBorderWidth, 0);
|
|
5450
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
5349
5451
|
const nodes = [];
|
|
5350
5452
|
if (shadow) {
|
|
5351
5453
|
const plotClip = `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z`;
|
|
@@ -5377,10 +5479,10 @@ function segmentNodes(context, mark) {
|
|
|
5377
5479
|
valueIndex,
|
|
5378
5480
|
mark: "bar",
|
|
5379
5481
|
radius: mark.radius,
|
|
5380
|
-
colorProp:
|
|
5482
|
+
colorProp: chunkQL7MNEMT_cjs.seriesValueColorProp(series.id, valueIndex),
|
|
5381
5483
|
hasColorOverride: series.colors?.[valueIndex] != null
|
|
5382
5484
|
},
|
|
5383
|
-
prop:
|
|
5485
|
+
prop: chunkQL7MNEMT_cjs.seriesValueProp(series.id, valueIndex),
|
|
5384
5486
|
style: { fill: fill2, stroke, strokeWidth, innerShadow: shadow }
|
|
5385
5487
|
});
|
|
5386
5488
|
return nodes;
|
|
@@ -5394,7 +5496,7 @@ function pushSegment(context, mode, layers, slot, series, seriesIndex, valueInde
|
|
|
5394
5496
|
layers.bars.push(...segmentNodes(context, mark));
|
|
5395
5497
|
const frame = { x: mark.x, y: mark.y, width: slot.barWidth, height: mark.height };
|
|
5396
5498
|
pushLabel(context, layers, series, seriesIndex, valueIndex, slot, frame);
|
|
5397
|
-
const glow =
|
|
5499
|
+
const glow = chunkQL7MNEMT_cjs.finite(chart.config?.barGlow, 0);
|
|
5398
5500
|
if (glow > 0) {
|
|
5399
5501
|
layers.glows.push(
|
|
5400
5502
|
createBarGlowNode(context, `chart-bar-glow-${chart.id}-${series.id}-${valueIndex}`, mark.path, mark.color, glow)
|
|
@@ -5405,7 +5507,7 @@ function renderStackedBars(context, mode) {
|
|
|
5405
5507
|
const { chart } = context;
|
|
5406
5508
|
const layers = { tracks: [], bars: [], glows: [], labels: [] };
|
|
5407
5509
|
const slot = slotOf(context, mode);
|
|
5408
|
-
const valueCount =
|
|
5510
|
+
const valueCount = chunkQL7MNEMT_cjs.barCategoryCount(chart);
|
|
5409
5511
|
for (let valueIndex = 0; valueIndex < valueCount; valueIndex++) {
|
|
5410
5512
|
chart.series.forEach((series, seriesIndex) => {
|
|
5411
5513
|
pushSegment(context, mode, layers, slot, series, seriesIndex, valueIndex);
|
|
@@ -5420,7 +5522,7 @@ function isSeriesMax2(values, index) {
|
|
|
5420
5522
|
|
|
5421
5523
|
// src/renderScene/charts/renderers/bar.ts
|
|
5422
5524
|
function renderBar(context) {
|
|
5423
|
-
if (
|
|
5525
|
+
if (chunkQL7MNEMT_cjs.isHorizontalBar(context.chart)) {
|
|
5424
5526
|
return renderHorizontalBars(context);
|
|
5425
5527
|
}
|
|
5426
5528
|
if (context.stackedMode) {
|
|
@@ -5435,7 +5537,7 @@ function createBoxplotLayout(context) {
|
|
|
5435
5537
|
const orientation = chart.config?.orientation ?? "vertical";
|
|
5436
5538
|
const boxCount = Math.max(1, chart.series.length);
|
|
5437
5539
|
const slotWidth = (orientation === "horizontal" ? plot.height : plot.width) / boxCount;
|
|
5438
|
-
const borderColor =
|
|
5540
|
+
const borderColor = chunkQL7MNEMT_cjs.representativeColor(chart.config?.barBorderColor, "#000000");
|
|
5439
5541
|
const widthFraction = Math.min(1, Math.max(0.05, chart.config?.boxWidth ?? 0.6));
|
|
5440
5542
|
return {
|
|
5441
5543
|
orientation,
|
|
@@ -5444,15 +5546,15 @@ function createBoxplotLayout(context) {
|
|
|
5444
5546
|
cornerRadius: chart.config?.barCornerRadius ?? 2,
|
|
5445
5547
|
showPoints: chart.config?.showBoxplotPoints ?? true,
|
|
5446
5548
|
borderColor,
|
|
5447
|
-
borderWidth:
|
|
5448
|
-
whiskerWidth: Math.max(0,
|
|
5449
|
-
medianWidth: Math.max(0,
|
|
5549
|
+
borderWidth: chunkQL7MNEMT_cjs.finite(chart.config?.barBorderWidth, 1),
|
|
5550
|
+
whiskerWidth: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.boxWhiskerWidth, 1)),
|
|
5551
|
+
medianWidth: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.boxMedianWidth, 2)),
|
|
5450
5552
|
medianColor: chart.config?.boxMedianColor ?? borderColor,
|
|
5451
5553
|
whiskerColor: chart.config?.boxWhiskerColor,
|
|
5452
|
-
capSize: Math.max(0,
|
|
5453
|
-
pointSize: Math.max(0,
|
|
5454
|
-
pointOpacity: Math.min(1, Math.max(0,
|
|
5455
|
-
jitter: Math.max(0,
|
|
5554
|
+
capSize: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.boxCapSize, 0.4)),
|
|
5555
|
+
pointSize: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.boxPointSize, 3)),
|
|
5556
|
+
pointOpacity: Math.min(1, Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.boxPointOpacity, 0.7))),
|
|
5557
|
+
jitter: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.boxJitter, 1))
|
|
5456
5558
|
};
|
|
5457
5559
|
}
|
|
5458
5560
|
|
|
@@ -5463,7 +5565,7 @@ function boxplotPoint(orientation, center, value) {
|
|
|
5463
5565
|
function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
5464
5566
|
const { chart, plot } = context;
|
|
5465
5567
|
const { orientation } = layout;
|
|
5466
|
-
const valueAt = (value) => orientation === "horizontal" ? plot.x +
|
|
5568
|
+
const valueAt = (value) => orientation === "horizontal" ? plot.x + chunkQL7MNEMT_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
5467
5569
|
const center = plot[orientation === "horizontal" ? "y" : "x"] + seriesIndex * layout.slotWidth + layout.slotWidth / 2;
|
|
5468
5570
|
return {
|
|
5469
5571
|
center,
|
|
@@ -5478,7 +5580,7 @@ function createBoxplotGeometry(context, layout, seriesIndex, stats) {
|
|
|
5478
5580
|
// src/renderScene/charts/renderers/boxplot/points.ts
|
|
5479
5581
|
function renderSamplePoints(context, layout, mark) {
|
|
5480
5582
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
5481
|
-
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x +
|
|
5583
|
+
const valueAt = (value) => layout.orientation === "horizontal" ? plot.x + chunkQL7MNEMT_cjs.mapChartValue(value, chart.axisX, plot.width) : plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(value, chart.axisY, plot.height);
|
|
5482
5584
|
if (layout.pointSize <= 0) {
|
|
5483
5585
|
return [];
|
|
5484
5586
|
}
|
|
@@ -5494,7 +5596,7 @@ function renderSamplePoints(context, layout, mark) {
|
|
|
5494
5596
|
cy: y,
|
|
5495
5597
|
rx: layout.pointSize,
|
|
5496
5598
|
ry: layout.pointSize,
|
|
5497
|
-
style: { fill:
|
|
5599
|
+
style: { fill: chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id), opacity: layout.pointOpacity }
|
|
5498
5600
|
};
|
|
5499
5601
|
});
|
|
5500
5602
|
}
|
|
@@ -5518,7 +5620,7 @@ function renderBoxAndWhiskers(context, layout, mark) {
|
|
|
5518
5620
|
}
|
|
5519
5621
|
function whiskerColor(layout, mark) {
|
|
5520
5622
|
if (layout.whiskerColor === "series") {
|
|
5521
|
-
return
|
|
5623
|
+
return chunkQL7MNEMT_cjs.representativeColor(mark.color, layout.borderColor);
|
|
5522
5624
|
}
|
|
5523
5625
|
return layout.whiskerColor;
|
|
5524
5626
|
}
|
|
@@ -5600,7 +5702,7 @@ function createBoxNode(context, layout, mark) {
|
|
|
5600
5702
|
height,
|
|
5601
5703
|
rx: layout.cornerRadius,
|
|
5602
5704
|
style: {
|
|
5603
|
-
fill:
|
|
5705
|
+
fill: chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id),
|
|
5604
5706
|
stroke: { kind: "solid", color: layout.borderColor },
|
|
5605
5707
|
strokeWidth: layout.borderWidth
|
|
5606
5708
|
}
|
|
@@ -5609,12 +5711,12 @@ function createBoxNode(context, layout, mark) {
|
|
|
5609
5711
|
|
|
5610
5712
|
// src/renderScene/charts/renderers/boxplot/series.ts
|
|
5611
5713
|
function renderBoxplotSeries(context, layout, series, seriesIndex) {
|
|
5612
|
-
const stats =
|
|
5714
|
+
const stats = chunkQL7MNEMT_cjs.computeBoxplotStats(series.values);
|
|
5613
5715
|
if (!stats) {
|
|
5614
5716
|
return [];
|
|
5615
5717
|
}
|
|
5616
5718
|
const geometry = createBoxplotGeometry(context, layout, seriesIndex, stats);
|
|
5617
|
-
const color = series.color ??
|
|
5719
|
+
const color = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
5618
5720
|
const mark = {
|
|
5619
5721
|
id: `${context.chart.id}-${series.id}`,
|
|
5620
5722
|
series,
|
|
@@ -5676,21 +5778,21 @@ function metricComponent(chart, point) {
|
|
|
5676
5778
|
}
|
|
5677
5779
|
function customPointPosition(context, value) {
|
|
5678
5780
|
return {
|
|
5679
|
-
x: context.plot.x +
|
|
5680
|
-
y: context.plot.y + context.plot.height -
|
|
5781
|
+
x: context.plot.x + chunkQL7MNEMT_cjs.mapChartValue(value[0], context.chart.axisX, context.plot.width),
|
|
5782
|
+
y: context.plot.y + context.plot.height - chunkQL7MNEMT_cjs.mapChartValue(value[1], context.chart.axisY, context.plot.height)
|
|
5681
5783
|
};
|
|
5682
5784
|
}
|
|
5683
5785
|
function customSeriesStyle(context, series, seriesIndex) {
|
|
5684
|
-
const color = series.color ??
|
|
5786
|
+
const color = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
5685
5787
|
return {
|
|
5686
|
-
fill:
|
|
5788
|
+
fill: chunkQL7MNEMT_cjs.paint(color, context.diagnostics, context.chart.id),
|
|
5687
5789
|
stroke: series.stroke ? { kind: "solid", color: series.stroke } : void 0,
|
|
5688
|
-
strokeWidth: series.stroke ?
|
|
5790
|
+
strokeWidth: series.stroke ? chunkQL7MNEMT_cjs.finite(series.strokeWidth, 1) : void 0
|
|
5689
5791
|
};
|
|
5690
5792
|
}
|
|
5691
5793
|
function createCustomSymbolMark(context, mark) {
|
|
5692
5794
|
const symbol = mark.series.symbol;
|
|
5693
|
-
const size =
|
|
5795
|
+
const size = chunkQL7MNEMT_cjs.finite(mark.series.size, 3);
|
|
5694
5796
|
const scale = symbol?.normalized ? size * 2 : 1;
|
|
5695
5797
|
const offset = symbol?.normalized ? 0.5 : 0;
|
|
5696
5798
|
const points = (symbol?.points ?? []).map(([x, y]) => ({
|
|
@@ -5702,12 +5804,12 @@ function createCustomSymbolMark(context, mark) {
|
|
|
5702
5804
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
5703
5805
|
order: context.nextOrder(),
|
|
5704
5806
|
bounds: context.bounds,
|
|
5705
|
-
d:
|
|
5807
|
+
d: chunkQL7MNEMT_cjs.freeformPathData({ points, tension: chunkQL7MNEMT_cjs.finite(symbol?.tension, 0), closed: true }),
|
|
5706
5808
|
style: mark.style
|
|
5707
5809
|
};
|
|
5708
5810
|
}
|
|
5709
5811
|
function createCustomPointMark(context, mark) {
|
|
5710
|
-
const radius =
|
|
5812
|
+
const radius = chunkQL7MNEMT_cjs.finite(mark.series.size, 3);
|
|
5711
5813
|
return {
|
|
5712
5814
|
type: "ellipse",
|
|
5713
5815
|
id: customMarkId(context.chart, mark.series, mark.valueIndex),
|
|
@@ -5731,7 +5833,7 @@ function renderConnectedPairs(context) {
|
|
|
5731
5833
|
const zones = chart.config?.zones ?? [];
|
|
5732
5834
|
const betterColor = zones[0]?.color ?? "#10b981";
|
|
5733
5835
|
const worseColor = zones[1]?.color ?? "#ec4899";
|
|
5734
|
-
const tieColor = zones[2]?.color ??
|
|
5836
|
+
const tieColor = zones[2]?.color ?? chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL;
|
|
5735
5837
|
const reverse = Boolean(chart.config?.reverseComparison);
|
|
5736
5838
|
const count = Math.min(beforeValues.length, afterValues.length);
|
|
5737
5839
|
const categories = chart.config?.categories ?? [];
|
|
@@ -5746,7 +5848,7 @@ function renderConnectedPairs(context) {
|
|
|
5746
5848
|
const better = reverse ? afterMetric < beforeMetric : afterMetric > beforeMetric;
|
|
5747
5849
|
const worse = reverse ? afterMetric > beforeMetric : afterMetric < beforeMetric;
|
|
5748
5850
|
const comparisonColor = better ? betterColor : worse ? worseColor : tieColor;
|
|
5749
|
-
const radius =
|
|
5851
|
+
const radius = chunkQL7MNEMT_cjs.finite(afterSeries.size, 3);
|
|
5750
5852
|
nodes.push(createConnectorLine(context, index, beforePoint, afterPoint, comparisonColor));
|
|
5751
5853
|
nodes.push(
|
|
5752
5854
|
createCustomPointMark(context, {
|
|
@@ -5754,9 +5856,9 @@ function renderConnectedPairs(context) {
|
|
|
5754
5856
|
valueIndex: index,
|
|
5755
5857
|
point: beforePoint,
|
|
5756
5858
|
style: {
|
|
5757
|
-
fill:
|
|
5859
|
+
fill: chunkQL7MNEMT_cjs.paint(chart.config?.customBeforeFill ?? chart.gridColor ?? "#e2e8f0", context.diagnostics, chart.id),
|
|
5758
5860
|
stroke: { kind: "solid", color: chart.config?.customBeforeStroke ?? HOLLOW_POINT_STROKE },
|
|
5759
|
-
strokeWidth:
|
|
5861
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.config?.customBeforeStrokeWidth, 1.5)
|
|
5760
5862
|
}
|
|
5761
5863
|
})
|
|
5762
5864
|
);
|
|
@@ -5766,7 +5868,7 @@ function renderConnectedPairs(context) {
|
|
|
5766
5868
|
valueIndex: index,
|
|
5767
5869
|
point: afterPoint,
|
|
5768
5870
|
style: {
|
|
5769
|
-
fill:
|
|
5871
|
+
fill: chunkQL7MNEMT_cjs.paint(comparisonColor, context.diagnostics, chart.id),
|
|
5770
5872
|
stroke: void 0,
|
|
5771
5873
|
strokeWidth: void 0
|
|
5772
5874
|
}
|
|
@@ -5793,7 +5895,7 @@ function createConnectorLine(context, index, from, to, color) {
|
|
|
5793
5895
|
style: {
|
|
5794
5896
|
fill: { kind: "none" },
|
|
5795
5897
|
stroke: { kind: "solid", color },
|
|
5796
|
-
strokeWidth:
|
|
5898
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.config?.customConnectorWidth, 2),
|
|
5797
5899
|
opacity: chart.config?.customConnectorOpacity,
|
|
5798
5900
|
dash: connectorDash(chart.config?.customConnectorDash)
|
|
5799
5901
|
}
|
|
@@ -5814,7 +5916,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
5814
5916
|
height: 16
|
|
5815
5917
|
};
|
|
5816
5918
|
return {
|
|
5817
|
-
...
|
|
5919
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
5818
5920
|
id: `chart-custom-label-${chart.id}-${index}`,
|
|
5819
5921
|
order: nextOrder(),
|
|
5820
5922
|
bounds,
|
|
@@ -5823,7 +5925,7 @@ function createConnectorLabel(context, index, beforePoint, afterPoint, radius, t
|
|
|
5823
5925
|
chart,
|
|
5824
5926
|
align: horizontal ? "left" : "center"
|
|
5825
5927
|
}),
|
|
5826
|
-
fontSize: Math.max(6,
|
|
5928
|
+
fontSize: Math.max(6, chunkQL7MNEMT_cjs.finite(chart.config?.customLabelSize, Math.max(9, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
5827
5929
|
...chart.config?.customLabelColor ? { color: chart.config.customLabelColor } : {}
|
|
5828
5930
|
};
|
|
5829
5931
|
}
|
|
@@ -5835,8 +5937,8 @@ function classifyFieldData(context) {
|
|
|
5835
5937
|
const vectorSeries = chart.series.filter((series) => tupleSize(series.values[0]) === 4);
|
|
5836
5938
|
const scalarSamples = scalarSeries.flatMap(
|
|
5837
5939
|
(series) => series.values.map(([x, y, value]) => ({
|
|
5838
|
-
x:
|
|
5839
|
-
y: plot.height -
|
|
5940
|
+
x: chunkQL7MNEMT_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
5941
|
+
y: plot.height - chunkQL7MNEMT_cjs.mapChartValue(y, chart.axisY, plot.height),
|
|
5840
5942
|
value
|
|
5841
5943
|
}))
|
|
5842
5944
|
);
|
|
@@ -5900,20 +6002,20 @@ function createLegendLabels(context, minimum, maximum, geometry) {
|
|
|
5900
6002
|
const { chart, bounds, nextOrder } = context;
|
|
5901
6003
|
const y = geometry.y + geometry.height + 3;
|
|
5902
6004
|
return [
|
|
5903
|
-
|
|
6005
|
+
chunkQL7MNEMT_cjs.chartText({
|
|
5904
6006
|
id: `chart-field-colorbar-min-${chart.id}`,
|
|
5905
6007
|
order: nextOrder(),
|
|
5906
6008
|
bounds,
|
|
5907
6009
|
frame: { x: geometry.x, y, width: 80, height: 16 },
|
|
5908
|
-
text:
|
|
6010
|
+
text: chunkQL7MNEMT_cjs.formatFieldValue(minimum),
|
|
5909
6011
|
chart
|
|
5910
6012
|
}),
|
|
5911
|
-
|
|
6013
|
+
chunkQL7MNEMT_cjs.chartText({
|
|
5912
6014
|
id: `chart-field-colorbar-max-${chart.id}`,
|
|
5913
6015
|
order: nextOrder(),
|
|
5914
6016
|
bounds,
|
|
5915
6017
|
frame: { x: geometry.x + geometry.width - 80, y, width: 80, height: 16 },
|
|
5916
|
-
text:
|
|
6018
|
+
text: chunkQL7MNEMT_cjs.formatFieldValue(maximum),
|
|
5917
6019
|
chart,
|
|
5918
6020
|
align: "right"
|
|
5919
6021
|
})
|
|
@@ -5926,7 +6028,7 @@ function colorAtRamp(ramp, value) {
|
|
|
5926
6028
|
if (!ramp?.stops.length) {
|
|
5927
6029
|
return RAMP_FALLBACK_COLOR;
|
|
5928
6030
|
}
|
|
5929
|
-
return
|
|
6031
|
+
return chunkQL7MNEMT_cjs.interpolateHexColorStops(ramp.stops, value);
|
|
5930
6032
|
}
|
|
5931
6033
|
|
|
5932
6034
|
// src/renderScene/charts/field/isolines.ts
|
|
@@ -6136,7 +6238,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
6136
6238
|
}
|
|
6137
6239
|
const chains = stitchIsolineSegments(segments);
|
|
6138
6240
|
const path = chains.map(
|
|
6139
|
-
(chain) =>
|
|
6241
|
+
(chain) => chunkQL7MNEMT_cjs.linePathData(
|
|
6140
6242
|
chain.map(([x, y]) => ({ x: plot.x + x, y: plot.y + y })),
|
|
6141
6243
|
ISOLINE_TENSION
|
|
6142
6244
|
)
|
|
@@ -6160,7 +6262,7 @@ function createIsoline(context, grid, threshold, thresholdIndex) {
|
|
|
6160
6262
|
function renderVectorField(context, seriesList) {
|
|
6161
6263
|
const nodes = [];
|
|
6162
6264
|
seriesList.forEach((series, seriesIndex) => {
|
|
6163
|
-
const color = series.color ??
|
|
6265
|
+
const color = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
6164
6266
|
series.values.forEach((vector, vectorIndex) => {
|
|
6165
6267
|
nodes.push(createVectorNode(context, series.id, vector, vectorIndex, color));
|
|
6166
6268
|
});
|
|
@@ -6170,10 +6272,10 @@ function renderVectorField(context, seriesList) {
|
|
|
6170
6272
|
function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
6171
6273
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
6172
6274
|
const [x, y, angle, magnitude] = vector;
|
|
6173
|
-
const startX = plot.x +
|
|
6174
|
-
const startY = plot.y + plot.height -
|
|
6175
|
-
const endX = plot.x +
|
|
6176
|
-
const endY = plot.y + plot.height -
|
|
6275
|
+
const startX = plot.x + chunkQL7MNEMT_cjs.mapChartValue(x, chart.axisX, plot.width);
|
|
6276
|
+
const startY = plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(y, chart.axisY, plot.height);
|
|
6277
|
+
const endX = plot.x + chunkQL7MNEMT_cjs.mapChartValue(x + Math.cos(angle) * magnitude, chart.axisX, plot.width);
|
|
6278
|
+
const endY = plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(y + Math.sin(angle) * magnitude, chart.axisY, plot.height);
|
|
6177
6279
|
return {
|
|
6178
6280
|
type: "path",
|
|
6179
6281
|
id: `chart-field-vector-${chart.id}-${seriesId}-${vectorIndex}`,
|
|
@@ -6183,7 +6285,7 @@ function createVectorNode(context, seriesId, vector, vectorIndex, color) {
|
|
|
6183
6285
|
markerEnd: "filled_arrow",
|
|
6184
6286
|
style: {
|
|
6185
6287
|
fill: { kind: "none" },
|
|
6186
|
-
stroke:
|
|
6288
|
+
stroke: chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id),
|
|
6187
6289
|
strokeWidth: 2
|
|
6188
6290
|
}
|
|
6189
6291
|
};
|
|
@@ -6230,7 +6332,7 @@ function createHeatmapCell(layout, series, rowIndex, columnIndex) {
|
|
|
6230
6332
|
};
|
|
6231
6333
|
}
|
|
6232
6334
|
function colorForValue(value, layout) {
|
|
6233
|
-
return
|
|
6335
|
+
return chunkQL7MNEMT_cjs.zoneColorAtValue(value, layout.bands, layout.zones);
|
|
6234
6336
|
}
|
|
6235
6337
|
function renderHeatmapCell(context, layout, cell) {
|
|
6236
6338
|
const background = createCellBackground(context, layout, cell);
|
|
@@ -6245,7 +6347,7 @@ function createCellBackground(context, layout, cell) {
|
|
|
6245
6347
|
const style = {
|
|
6246
6348
|
fill: { kind: "solid", color: cell.color },
|
|
6247
6349
|
stroke: { kind: "solid", color: chart.config?.cellStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
6248
|
-
strokeWidth:
|
|
6350
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.config?.cellStrokeWidth, chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1))
|
|
6249
6351
|
};
|
|
6250
6352
|
if (chart.config?.cellShape === "circle") {
|
|
6251
6353
|
return {
|
|
@@ -6272,9 +6374,9 @@ function createCellBackground(context, layout, cell) {
|
|
|
6272
6374
|
}
|
|
6273
6375
|
function createCellValueLabel(context, layout, cell) {
|
|
6274
6376
|
const { chart, bounds, nextOrder } = context;
|
|
6275
|
-
const size = Math.max(6,
|
|
6377
|
+
const size = Math.max(6, chunkQL7MNEMT_cjs.finite(chart.config?.cellValueSize, layout.fontSize));
|
|
6276
6378
|
return {
|
|
6277
|
-
...
|
|
6379
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
6278
6380
|
id: `chart-heatmap-value-${chart.id}-${cell.seriesId}-${cell.columnIndex}`,
|
|
6279
6381
|
order: nextOrder(),
|
|
6280
6382
|
bounds,
|
|
@@ -6289,98 +6391,80 @@ function createCellValueLabel(context, layout, cell) {
|
|
|
6289
6391
|
align: "center"
|
|
6290
6392
|
}),
|
|
6291
6393
|
...chart.config?.cellValueSize === void 0 ? {} : { fontSize: size },
|
|
6292
|
-
color: chart.config?.cellValueColor ??
|
|
6394
|
+
color: chart.config?.cellValueColor ?? chunkQL7MNEMT_cjs.contrastTextColor(cell.color)
|
|
6293
6395
|
};
|
|
6294
6396
|
}
|
|
6295
6397
|
|
|
6296
|
-
// src/renderScene/charts/renderers/heatmap/headers.ts
|
|
6297
|
-
function renderHeatmapHeaders(context, layout) {
|
|
6298
|
-
return [...renderRowHeaders(context, layout), ...renderColumnHeaders(context, layout)];
|
|
6299
|
-
}
|
|
6300
|
-
function renderRowHeaders(context, layout) {
|
|
6301
|
-
if (layout.reservedSpace.rowHeaders <= 0) {
|
|
6302
|
-
return [];
|
|
6303
|
-
}
|
|
6304
|
-
return layout.rows.map((series, rowIndex) => createRowHeader(context, layout, series, rowIndex));
|
|
6305
|
-
}
|
|
6306
|
-
function createRowHeader(context, layout, series, rowIndex) {
|
|
6307
|
-
const { chart, plot, bounds, nextOrder } = context;
|
|
6308
|
-
return chunkKXYSO6GC_cjs.chartText({
|
|
6309
|
-
id: `chart-heatmap-row-${chart.id}-${series.id}`,
|
|
6310
|
-
order: nextOrder(),
|
|
6311
|
-
bounds,
|
|
6312
|
-
frame: {
|
|
6313
|
-
x: plot.x,
|
|
6314
|
-
y: layout.grid.y + rowIndex * layout.grid.cellHeight + layout.grid.cellHeight / 2 - layout.fontSize / 2,
|
|
6315
|
-
width: layout.reservedSpace.rowHeaders - 8,
|
|
6316
|
-
height: layout.fontSize + 2
|
|
6317
|
-
},
|
|
6318
|
-
text: series.label,
|
|
6319
|
-
chart
|
|
6320
|
-
});
|
|
6321
|
-
}
|
|
6322
|
-
function renderColumnHeaders(context, layout) {
|
|
6323
|
-
if (layout.reservedSpace.columnHeaders <= 0) {
|
|
6324
|
-
return [];
|
|
6325
|
-
}
|
|
6326
|
-
return layout.columns.map((label, columnIndex) => createColumnHeader(context, layout, label, columnIndex));
|
|
6327
|
-
}
|
|
6328
|
-
function createColumnHeader(context, layout, label, columnIndex) {
|
|
6329
|
-
const { chart, plot, bounds, nextOrder } = context;
|
|
6330
|
-
return chunkKXYSO6GC_cjs.chartText({
|
|
6331
|
-
id: `chart-heatmap-col-${chart.id}-${columnIndex}`,
|
|
6332
|
-
order: nextOrder(),
|
|
6333
|
-
bounds,
|
|
6334
|
-
frame: {
|
|
6335
|
-
x: layout.grid.x + columnIndex * layout.grid.cellWidth,
|
|
6336
|
-
y: plot.y,
|
|
6337
|
-
width: layout.grid.cellWidth,
|
|
6338
|
-
height: layout.fontSize + 2
|
|
6339
|
-
},
|
|
6340
|
-
text: label,
|
|
6341
|
-
chart,
|
|
6342
|
-
align: "center"
|
|
6343
|
-
});
|
|
6344
|
-
}
|
|
6345
|
-
|
|
6346
6398
|
// src/renderScene/charts/renderers/heatmap/layout.ts
|
|
6347
6399
|
function createHeatmapLayout(context) {
|
|
6348
6400
|
const { chart } = context;
|
|
6349
6401
|
const columns = heatmapColumns(context);
|
|
6350
|
-
const
|
|
6402
|
+
const sides = heatmapSides(context);
|
|
6403
|
+
const reservedSpace = heatmapReservedSpace(context, sides);
|
|
6351
6404
|
return {
|
|
6352
6405
|
rows: chart.series,
|
|
6353
6406
|
columns,
|
|
6354
|
-
bands:
|
|
6355
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
6356
|
-
fontSize: Math.max(9,
|
|
6407
|
+
bands: chunkQL7MNEMT_cjs.axisBands(chart.axisY),
|
|
6408
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkQL7MNEMT_cjs.DEFAULT_HEATMAP_ZONES,
|
|
6409
|
+
fontSize: Math.max(9, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12)),
|
|
6410
|
+
headerFontSize: headerFontSize(chart),
|
|
6411
|
+
legendGap: legendGap(chart),
|
|
6412
|
+
sides,
|
|
6357
6413
|
reservedSpace,
|
|
6358
|
-
grid: createHeatmapGrid(context, reservedSpace, columns.length)
|
|
6414
|
+
grid: createHeatmapGrid(context, reservedSpace, sides, columns.length)
|
|
6415
|
+
};
|
|
6416
|
+
}
|
|
6417
|
+
var headerFontSize = (chart) => Math.max(9, chunkQL7MNEMT_cjs.finite(chart.axisFontSize ?? chart.fontSize, 12));
|
|
6418
|
+
var rowGap = (chart) => Math.min(120, Math.max(0, chunkQL7MNEMT_cjs.finite(chart.yLabelGap, 6)));
|
|
6419
|
+
var columnGap = (chart) => Math.min(120, Math.max(0, chunkQL7MNEMT_cjs.finite(chart.xLabelGap, 4)));
|
|
6420
|
+
var legendGap = (chart) => Math.min(80, Math.max(0, chunkQL7MNEMT_cjs.finite(chart.legendGap, 6)));
|
|
6421
|
+
function heatmapSides(context) {
|
|
6422
|
+
const { chart } = context;
|
|
6423
|
+
return {
|
|
6424
|
+
rows: chart.rowLabelSide === "right" ? "right" : "left",
|
|
6425
|
+
columns: chart.columnLabelSide === "bottom" ? "bottom" : "top",
|
|
6426
|
+
legend: chart.legendSide ?? "bottom"
|
|
6359
6427
|
};
|
|
6360
6428
|
}
|
|
6361
6429
|
function heatmapColumns(context) {
|
|
6362
6430
|
const { chart } = context;
|
|
6363
6431
|
return chart.config?.categories?.length ? chart.config.categories : chart.series[0]?.values?.map((_, index) => String(index + 1)) ?? [];
|
|
6364
6432
|
}
|
|
6365
|
-
|
|
6433
|
+
var LEGEND_ACROSS = 32;
|
|
6434
|
+
var LEGEND_BESIDE = 56;
|
|
6435
|
+
function heatmapReservedSpace(context, sides) {
|
|
6366
6436
|
const { chart } = context;
|
|
6367
|
-
const fontSize =
|
|
6437
|
+
const fontSize = headerFontSize(chart);
|
|
6368
6438
|
const longestLabel = chart.series.reduce(
|
|
6369
|
-
(max, series) => Math.max(max,
|
|
6439
|
+
(max, series) => Math.max(max, chunkQL7MNEMT_cjs.estimateTextWidth(series.label ?? "", fontSize, false)),
|
|
6370
6440
|
0
|
|
6371
6441
|
);
|
|
6442
|
+
const vertical = sides.legend === "left" || sides.legend === "right";
|
|
6372
6443
|
return {
|
|
6373
|
-
|
|
6374
|
-
|
|
6375
|
-
|
|
6444
|
+
// The names get the room they ask for, or as much as the longest needs. They never take more than most of the plot.
|
|
6445
|
+
rowHeaders: context.showLabels ? Math.min(
|
|
6446
|
+
context.plot.width * 0.7,
|
|
6447
|
+
chart.axisLabelSpace && chart.axisLabelSpace > 0 ? chart.axisLabelSpace : longestLabel + 6 + rowGap(chart)
|
|
6448
|
+
) : 0,
|
|
6449
|
+
columnHeaders: context.showLabels ? columnHeaderRoom(context) : 0,
|
|
6450
|
+
legend: context.showLegend ? (vertical ? LEGEND_BESIDE : LEGEND_ACROSS) + legendGap(chart) : 0
|
|
6376
6451
|
};
|
|
6377
6452
|
}
|
|
6378
|
-
function
|
|
6453
|
+
function columnHeaderRoom(context) {
|
|
6379
6454
|
const { chart } = context;
|
|
6380
|
-
const
|
|
6381
|
-
|
|
6455
|
+
const tilt = chunkQL7MNEMT_cjs.labelTilt(chart);
|
|
6456
|
+
return tilt > 0 ? Math.min(context.plot.height * 0.4, chunkQL7MNEMT_cjs.tiltedLabelRoom(chart, heatmapColumns(context), tilt) + columnGap(chart) + 4) : headerFontSize(chart) + 2 + columnGap(chart) + 6;
|
|
6457
|
+
}
|
|
6458
|
+
function createHeatmapGrid(context, reservedSpace, sides, columnCount) {
|
|
6459
|
+
const { chart } = context;
|
|
6460
|
+
const left = (sides.rows === "left" ? reservedSpace.rowHeaders : 0) + (sides.legend === "left" ? reservedSpace.legend : 0);
|
|
6461
|
+
const right = (sides.rows === "right" ? reservedSpace.rowHeaders : 0) + (sides.legend === "right" ? reservedSpace.legend : 0);
|
|
6462
|
+
const top = (sides.columns === "top" ? reservedSpace.columnHeaders : 0) + (sides.legend === "top" ? reservedSpace.legend : 0);
|
|
6463
|
+
const bottom = (sides.columns === "bottom" ? reservedSpace.columnHeaders : 0) + (sides.legend === "bottom" ? reservedSpace.legend : 0);
|
|
6464
|
+
const width = Math.max(1, context.plot.width - left - right);
|
|
6465
|
+
const height = Math.max(1, context.plot.height - top - bottom);
|
|
6382
6466
|
const rowCount = chart.series.length;
|
|
6383
|
-
const cellGap = Math.max(0,
|
|
6467
|
+
const cellGap = Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.cellGap, 0));
|
|
6384
6468
|
let cellWidth = columnCount ? width / columnCount : width;
|
|
6385
6469
|
let cellHeight = rowCount ? height / rowCount : height;
|
|
6386
6470
|
let gridWidth = width;
|
|
@@ -6393,100 +6477,245 @@ function createHeatmapGrid(context, reservedSpace, columnCount) {
|
|
|
6393
6477
|
gridHeight = cellSize * rowCount;
|
|
6394
6478
|
}
|
|
6395
6479
|
return {
|
|
6396
|
-
x: context.plot.x +
|
|
6397
|
-
y: context.plot.y +
|
|
6480
|
+
x: context.plot.x + left,
|
|
6481
|
+
y: context.plot.y + top,
|
|
6398
6482
|
width: gridWidth,
|
|
6399
6483
|
height: gridHeight,
|
|
6400
6484
|
cellWidth,
|
|
6401
6485
|
cellHeight,
|
|
6402
6486
|
cellGap,
|
|
6403
|
-
cellRadius: Math.max(0,
|
|
6487
|
+
cellRadius: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.barCornerRadius, cellGap))
|
|
6404
6488
|
};
|
|
6405
6489
|
}
|
|
6406
6490
|
|
|
6491
|
+
// src/renderScene/charts/renderers/heatmap/headers.ts
|
|
6492
|
+
function renderHeatmapHeaders(context, layout) {
|
|
6493
|
+
return [...renderRowHeaders(context, layout), ...renderColumnHeaders(context, layout)];
|
|
6494
|
+
}
|
|
6495
|
+
function renderRowHeaders(context, layout) {
|
|
6496
|
+
if (layout.reservedSpace.rowHeaders <= 0) {
|
|
6497
|
+
return [];
|
|
6498
|
+
}
|
|
6499
|
+
return layout.rows.map((series, rowIndex) => createRowHeader(context, layout, series, rowIndex));
|
|
6500
|
+
}
|
|
6501
|
+
function createRowHeader(context, layout, series, rowIndex) {
|
|
6502
|
+
const { chart, bounds, nextOrder } = context;
|
|
6503
|
+
const room = layout.reservedSpace.rowHeaders;
|
|
6504
|
+
const gap = rowGap(chart);
|
|
6505
|
+
const x = layout.sides.rows === "left" ? layout.grid.x - room : layout.grid.x + layout.grid.width + gap;
|
|
6506
|
+
return chunkQL7MNEMT_cjs.chartText({
|
|
6507
|
+
id: `chart-heatmap-row-${chart.id}-${series.id}`,
|
|
6508
|
+
order: nextOrder(),
|
|
6509
|
+
bounds,
|
|
6510
|
+
frame: {
|
|
6511
|
+
x,
|
|
6512
|
+
y: layout.grid.y + rowIndex * layout.grid.cellHeight + layout.grid.cellHeight / 2 - layout.headerFontSize / 2,
|
|
6513
|
+
width: Math.max(1, room - gap),
|
|
6514
|
+
height: layout.headerFontSize + 2
|
|
6515
|
+
},
|
|
6516
|
+
text: series.label,
|
|
6517
|
+
chart,
|
|
6518
|
+
align: chart.axisLabelAlign ?? "left",
|
|
6519
|
+
role: "axis"
|
|
6520
|
+
});
|
|
6521
|
+
}
|
|
6522
|
+
function renderColumnHeaders(context, layout) {
|
|
6523
|
+
if (layout.reservedSpace.columnHeaders <= 0) {
|
|
6524
|
+
return [];
|
|
6525
|
+
}
|
|
6526
|
+
return layout.columns.map((label, columnIndex) => createColumnHeader(context, layout, label, columnIndex));
|
|
6527
|
+
}
|
|
6528
|
+
function createColumnHeader(context, layout, label, columnIndex) {
|
|
6529
|
+
const { chart, bounds, nextOrder } = context;
|
|
6530
|
+
const above = layout.sides.columns === "top";
|
|
6531
|
+
const centerX = layout.grid.x + (columnIndex + 0.5) * layout.grid.cellWidth;
|
|
6532
|
+
const tilt = chunkQL7MNEMT_cjs.labelTilt(chart);
|
|
6533
|
+
const gap = columnGap(chart);
|
|
6534
|
+
const id = `chart-heatmap-col-${chart.id}-${columnIndex}`;
|
|
6535
|
+
if (tilt > 0) {
|
|
6536
|
+
const { frame, rotation } = above ? chunkQL7MNEMT_cjs.labelAboveFrame(chart, label, tilt, { x: centerX, y: layout.grid.y - gap }) : chunkQL7MNEMT_cjs.labelBelowFrame(chart, label, tilt, { x: centerX, y: layout.grid.y + layout.grid.height + gap });
|
|
6537
|
+
return chunkQL7MNEMT_cjs.chartText({
|
|
6538
|
+
id,
|
|
6539
|
+
order: nextOrder(),
|
|
6540
|
+
bounds,
|
|
6541
|
+
frame,
|
|
6542
|
+
text: label,
|
|
6543
|
+
chart,
|
|
6544
|
+
align: above ? "left" : "right",
|
|
6545
|
+
rotation,
|
|
6546
|
+
role: "axis"
|
|
6547
|
+
});
|
|
6548
|
+
}
|
|
6549
|
+
return chunkQL7MNEMT_cjs.chartText({
|
|
6550
|
+
id,
|
|
6551
|
+
order: nextOrder(),
|
|
6552
|
+
bounds,
|
|
6553
|
+
frame: {
|
|
6554
|
+
x: layout.grid.x + columnIndex * layout.grid.cellWidth,
|
|
6555
|
+
y: above ? layout.grid.y - gap - (layout.headerFontSize + 2) : layout.grid.y + layout.grid.height + gap,
|
|
6556
|
+
width: layout.grid.cellWidth,
|
|
6557
|
+
height: layout.headerFontSize + 2
|
|
6558
|
+
},
|
|
6559
|
+
text: label,
|
|
6560
|
+
chart,
|
|
6561
|
+
align: "center",
|
|
6562
|
+
role: "axis"
|
|
6563
|
+
});
|
|
6564
|
+
}
|
|
6565
|
+
|
|
6407
6566
|
// src/renderScene/charts/renderers/heatmap/legend.ts
|
|
6408
|
-
var
|
|
6409
|
-
var
|
|
6567
|
+
var BAR_THICKNESS = 10;
|
|
6568
|
+
var TICK_LENGTH2 = 4;
|
|
6410
6569
|
var ROW_GAP = 2;
|
|
6570
|
+
var LABEL_WIDTH = 48;
|
|
6571
|
+
function barPlace(layout) {
|
|
6572
|
+
const { grid, sides, reservedSpace, legendGap: legendGap2 } = layout;
|
|
6573
|
+
const rowRoom = reservedSpace.rowHeaders;
|
|
6574
|
+
const columnRoom = reservedSpace.columnHeaders;
|
|
6575
|
+
switch (sides.legend) {
|
|
6576
|
+
case "top": {
|
|
6577
|
+
const edge = grid.y - (sides.columns === "top" ? columnRoom : 0);
|
|
6578
|
+
return {
|
|
6579
|
+
x: grid.x,
|
|
6580
|
+
y: edge - legendGap2 - BAR_THICKNESS,
|
|
6581
|
+
width: grid.width,
|
|
6582
|
+
height: BAR_THICKNESS,
|
|
6583
|
+
vertical: false,
|
|
6584
|
+
numbers: "top"
|
|
6585
|
+
};
|
|
6586
|
+
}
|
|
6587
|
+
case "left": {
|
|
6588
|
+
const edge = grid.x - (sides.rows === "left" ? rowRoom : 0);
|
|
6589
|
+
return {
|
|
6590
|
+
x: edge - legendGap2 - BAR_THICKNESS,
|
|
6591
|
+
y: grid.y,
|
|
6592
|
+
width: BAR_THICKNESS,
|
|
6593
|
+
height: grid.height,
|
|
6594
|
+
vertical: true,
|
|
6595
|
+
numbers: "left"
|
|
6596
|
+
};
|
|
6597
|
+
}
|
|
6598
|
+
case "right": {
|
|
6599
|
+
const edge = grid.x + grid.width + (sides.rows === "right" ? rowRoom : 0);
|
|
6600
|
+
return {
|
|
6601
|
+
x: edge + legendGap2,
|
|
6602
|
+
y: grid.y,
|
|
6603
|
+
width: BAR_THICKNESS,
|
|
6604
|
+
height: grid.height,
|
|
6605
|
+
vertical: true,
|
|
6606
|
+
numbers: "right"
|
|
6607
|
+
};
|
|
6608
|
+
}
|
|
6609
|
+
default: {
|
|
6610
|
+
const edge = grid.y + grid.height + (sides.columns === "bottom" ? columnRoom : 0);
|
|
6611
|
+
return {
|
|
6612
|
+
x: grid.x,
|
|
6613
|
+
y: edge + legendGap2,
|
|
6614
|
+
width: grid.width,
|
|
6615
|
+
height: BAR_THICKNESS,
|
|
6616
|
+
vertical: false,
|
|
6617
|
+
numbers: "bottom"
|
|
6618
|
+
};
|
|
6619
|
+
}
|
|
6620
|
+
}
|
|
6621
|
+
}
|
|
6411
6622
|
function renderHeatmapLegend(context, layout) {
|
|
6412
6623
|
if (layout.reservedSpace.legend <= 0 || layout.zones.length === 0) {
|
|
6413
6624
|
return [];
|
|
6414
6625
|
}
|
|
6415
|
-
const
|
|
6416
|
-
const
|
|
6417
|
-
|
|
6418
|
-
const barY = layout.grid.y + layout.grid.height + 6;
|
|
6419
|
-
const barBounds = chunkKXYSO6GC_cjs.boxBounds({ x: barX, y: barY, width: barWidth, height: BAR_HEIGHT });
|
|
6420
|
-
return [
|
|
6421
|
-
createGradientBar(context, layout, barX, barY, barWidth, barBounds),
|
|
6422
|
-
...createBoundaryTicks(context, layout, barX, barY, barWidth, labelHeight)
|
|
6423
|
-
];
|
|
6626
|
+
const place = barPlace(layout);
|
|
6627
|
+
const barBounds = chunkQL7MNEMT_cjs.boxBounds({ x: place.x, y: place.y, width: place.width, height: place.height });
|
|
6628
|
+
return [createGradientBar(context, layout, place, barBounds), ...createBoundaryTicks(context, layout, place)];
|
|
6424
6629
|
}
|
|
6425
6630
|
function bandRatio(layout, value) {
|
|
6426
6631
|
const first = layout.bands[0];
|
|
6427
6632
|
const last = layout.bands[layout.bands.length - 1];
|
|
6428
6633
|
return last === first ? 0 : (value - first) / (last - first);
|
|
6429
6634
|
}
|
|
6430
|
-
function createGradientBar(context, layout,
|
|
6635
|
+
function createGradientBar(context, layout, place, barBounds) {
|
|
6431
6636
|
const { chart, nextOrder } = context;
|
|
6432
6637
|
const bandCount = Math.max(0, layout.bands.length - 1);
|
|
6433
6638
|
const zones = layout.zones.slice(0, bandCount);
|
|
6434
6639
|
const stops = zones.map((zone, index) => ({
|
|
6435
6640
|
offset: bandRatio(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
6436
|
-
color: zone.color ??
|
|
6641
|
+
color: zone.color ?? chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL
|
|
6437
6642
|
}));
|
|
6438
6643
|
return {
|
|
6439
6644
|
type: "rect",
|
|
6440
6645
|
id: `chart-heatmap-legend-bar-${chart.id}`,
|
|
6441
6646
|
order: nextOrder(),
|
|
6442
6647
|
bounds: barBounds,
|
|
6443
|
-
x:
|
|
6444
|
-
y:
|
|
6445
|
-
width:
|
|
6446
|
-
height:
|
|
6648
|
+
x: place.x,
|
|
6649
|
+
y: place.y,
|
|
6650
|
+
width: place.width,
|
|
6651
|
+
height: place.height,
|
|
6447
6652
|
rx: 3,
|
|
6448
6653
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
6449
6654
|
style: {
|
|
6450
|
-
|
|
6655
|
+
// Across the grid it runs from the lowest value on the left; beside it from the lowest at the bottom.
|
|
6656
|
+
fill: stops.length ? { kind: "linear-gradient", angle: place.vertical ? 270 : 0, stops } : { kind: "solid", color: chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL },
|
|
6451
6657
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
6452
6658
|
strokeWidth: 1
|
|
6453
6659
|
}
|
|
6454
6660
|
};
|
|
6455
6661
|
}
|
|
6456
|
-
function createBoundaryTicks(context, layout,
|
|
6662
|
+
function createBoundaryTicks(context, layout, place) {
|
|
6457
6663
|
const { chart, bounds, nextOrder } = context;
|
|
6458
|
-
const
|
|
6459
|
-
const
|
|
6664
|
+
const labelHeight = layout.fontSize + 2;
|
|
6665
|
+
const lastIndex = layout.bands.length - 1;
|
|
6460
6666
|
return layout.bands.flatMap((value, index) => {
|
|
6461
|
-
const
|
|
6667
|
+
const ratio = bandRatio(layout, value);
|
|
6668
|
+
const at = place.vertical ? place.y + place.height - ratio * place.height : place.x + ratio * place.width;
|
|
6669
|
+
const tickPath = tickPathAt(place, at);
|
|
6462
6670
|
const tick = {
|
|
6463
6671
|
type: "path",
|
|
6464
6672
|
id: `chart-heatmap-legend-tick-${chart.id}-${index}`,
|
|
6465
6673
|
order: nextOrder(),
|
|
6466
6674
|
bounds,
|
|
6467
|
-
d:
|
|
6675
|
+
d: tickPath,
|
|
6468
6676
|
style: {
|
|
6469
6677
|
fill: { kind: "none" },
|
|
6470
6678
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
6471
6679
|
strokeWidth: 1
|
|
6472
6680
|
}
|
|
6473
6681
|
};
|
|
6474
|
-
const
|
|
6475
|
-
const isLast = index === layout.bands.length - 1;
|
|
6476
|
-
const align = isFirst ? "left" : isLast ? "right" : "center";
|
|
6477
|
-
const frameX = isFirst ? x : isLast ? x - labelWidth : x - labelWidth / 2;
|
|
6478
|
-
const label = chunkKXYSO6GC_cjs.chartText({
|
|
6682
|
+
const label = chunkQL7MNEMT_cjs.chartText({
|
|
6479
6683
|
id: `chart-heatmap-legend-tick-label-${chart.id}-${index}`,
|
|
6480
6684
|
order: nextOrder(),
|
|
6481
6685
|
bounds,
|
|
6482
|
-
|
|
6483
|
-
text:
|
|
6484
|
-
chart
|
|
6485
|
-
align
|
|
6686
|
+
...labelAt(place, at, index === 0, index === lastIndex, labelHeight),
|
|
6687
|
+
text: chunkQL7MNEMT_cjs.formatFieldValue(value),
|
|
6688
|
+
chart
|
|
6486
6689
|
});
|
|
6487
6690
|
return [tick, label];
|
|
6488
6691
|
});
|
|
6489
6692
|
}
|
|
6693
|
+
function tickPathAt(place, at) {
|
|
6694
|
+
if (place.vertical) {
|
|
6695
|
+
const from2 = place.numbers === "right" ? place.x + place.width : place.x;
|
|
6696
|
+
const to2 = place.numbers === "right" ? from2 + TICK_LENGTH2 : from2 - TICK_LENGTH2;
|
|
6697
|
+
return `M ${from2} ${at} L ${to2} ${at}`;
|
|
6698
|
+
}
|
|
6699
|
+
const from = place.numbers === "bottom" ? place.y + place.height : place.y;
|
|
6700
|
+
const to = place.numbers === "bottom" ? from + TICK_LENGTH2 : from - TICK_LENGTH2;
|
|
6701
|
+
return `M ${at} ${from} L ${at} ${to}`;
|
|
6702
|
+
}
|
|
6703
|
+
function labelAt(place, at, first, last, labelHeight) {
|
|
6704
|
+
if (place.vertical) {
|
|
6705
|
+
const onRight = place.numbers === "right";
|
|
6706
|
+
const x2 = onRight ? place.x + place.width + TICK_LENGTH2 + ROW_GAP : place.x - TICK_LENGTH2 - ROW_GAP - LABEL_WIDTH;
|
|
6707
|
+
return {
|
|
6708
|
+
frame: { x: x2, y: at - labelHeight / 2, width: LABEL_WIDTH, height: labelHeight },
|
|
6709
|
+
align: onRight ? "left" : "right"
|
|
6710
|
+
};
|
|
6711
|
+
}
|
|
6712
|
+
const y = place.numbers === "bottom" ? place.y + place.height + TICK_LENGTH2 + ROW_GAP : place.y - TICK_LENGTH2 - ROW_GAP - labelHeight;
|
|
6713
|
+
const x = first ? at : last ? at - LABEL_WIDTH : at - LABEL_WIDTH / 2;
|
|
6714
|
+
return {
|
|
6715
|
+
frame: { x, y, width: LABEL_WIDTH, height: labelHeight },
|
|
6716
|
+
align: first ? "left" : last ? "right" : "center"
|
|
6717
|
+
};
|
|
6718
|
+
}
|
|
6490
6719
|
|
|
6491
6720
|
// src/renderScene/charts/renderers/heatmap.ts
|
|
6492
6721
|
function renderHeatmap(context) {
|
|
@@ -6822,22 +7051,22 @@ function renderHexbin(context) {
|
|
|
6822
7051
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
6823
7052
|
const nodes = [];
|
|
6824
7053
|
const config = chart.config;
|
|
6825
|
-
const hexRadius = Math.max(1, config?.hexRadius ??
|
|
7054
|
+
const hexRadius = Math.max(1, config?.hexRadius ?? chunkQL7MNEMT_cjs.DEFAULT_HEX_RADIUS);
|
|
6826
7055
|
const drawRadius = Math.max(0.5, hexRadius - Math.max(0, config?.hexGap ?? 0) * GAP_TO_RADIUS);
|
|
6827
7056
|
const strokeWidth = config?.hexStrokeWidth ?? 0;
|
|
6828
7057
|
const minOpacity = Math.min(1, Math.max(0, config?.hexMinOpacity ?? DEFAULT_MIN_OPACITY));
|
|
6829
|
-
const shadow =
|
|
7058
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
6830
7059
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
6831
7060
|
chart.series.forEach((series, seriesIndex) => {
|
|
6832
7061
|
const explicit = series.values.length > 0 && Array.isArray(series.values[0]);
|
|
6833
7062
|
const pairs = explicit ? series.values : series.values.map((y, i) => [chart.axisX.min + i * chart.axisX.step, y]);
|
|
6834
7063
|
const pixelPoints2 = pairs.map(([vx, vy]) => ({
|
|
6835
|
-
x:
|
|
6836
|
-
y: plot.height -
|
|
7064
|
+
x: chunkQL7MNEMT_cjs.mapChartValue(vx, chart.axisX, plot.width),
|
|
7065
|
+
y: plot.height - chunkQL7MNEMT_cjs.mapChartValue(vy, chart.axisY, plot.height)
|
|
6837
7066
|
}));
|
|
6838
7067
|
const bins = computeHexBins(pixelPoints2, hexRadius);
|
|
6839
7068
|
const maxCount = Math.max(1, ...bins.map((bin) => bin.count));
|
|
6840
|
-
const color = series.color ??
|
|
7069
|
+
const color = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
6841
7070
|
const ramp = config?.scale;
|
|
6842
7071
|
bins.forEach((bin, i) => {
|
|
6843
7072
|
const share = bin.count / maxCount;
|
|
@@ -6849,8 +7078,8 @@ function renderHexbin(context) {
|
|
|
6849
7078
|
bounds,
|
|
6850
7079
|
d: hexPath(plot.x + bin.cx, plot.y + bin.cy, drawRadius),
|
|
6851
7080
|
style: {
|
|
6852
|
-
fill:
|
|
6853
|
-
stroke: strokeWidth > 0 ?
|
|
7081
|
+
fill: chunkQL7MNEMT_cjs.paint(fill2, diagnostics, chart.id),
|
|
7082
|
+
stroke: strokeWidth > 0 ? chunkQL7MNEMT_cjs.paint(config?.hexStrokeColor ?? fill2, diagnostics, chart.id) : void 0,
|
|
6854
7083
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
6855
7084
|
opacity: ramp ? void 0 : Math.max(minOpacity, share),
|
|
6856
7085
|
shadow,
|
|
@@ -6872,8 +7101,8 @@ function seriesValuePairs(chart, series) {
|
|
|
6872
7101
|
function pixelPoints(context, pairs) {
|
|
6873
7102
|
const { chart, plot } = context;
|
|
6874
7103
|
return pairs.map(([x, y]) => ({
|
|
6875
|
-
x: plot.x +
|
|
6876
|
-
y: plot.y + plot.height -
|
|
7104
|
+
x: plot.x + chunkQL7MNEMT_cjs.mapChartValue(x, chart.axisX, plot.width),
|
|
7105
|
+
y: plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(y, chart.axisY, plot.height)
|
|
6877
7106
|
}));
|
|
6878
7107
|
}
|
|
6879
7108
|
|
|
@@ -6883,7 +7112,7 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
6883
7112
|
const baselineY = plot.y + plot.height;
|
|
6884
7113
|
const first = points[0];
|
|
6885
7114
|
const last = points[points.length - 1];
|
|
6886
|
-
const d = `${
|
|
7115
|
+
const d = `${chunkQL7MNEMT_cjs.linePathData(points, tension)} L ${last.x} ${baselineY} L ${first.x} ${baselineY} Z`;
|
|
6887
7116
|
const top = Math.min(...points.map((point) => point.y));
|
|
6888
7117
|
const centerX = (Math.min(...points.map((point) => point.x)) + Math.max(...points.map((point) => point.x))) / 2;
|
|
6889
7118
|
const halfHeight = (baselineY - top) / 2;
|
|
@@ -6905,8 +7134,8 @@ function createLineAreaFill(context, series, points, color, tension, areaOpacity
|
|
|
6905
7134
|
kind: "linear-gradient",
|
|
6906
7135
|
angle: 90,
|
|
6907
7136
|
stops: [
|
|
6908
|
-
{ offset: 0, color:
|
|
6909
|
-
{ offset: 100, color:
|
|
7137
|
+
{ offset: 0, color: chunkQL7MNEMT_cjs.colorWithAlpha(color, areaOpacity) },
|
|
7138
|
+
{ offset: 100, color: chunkQL7MNEMT_cjs.colorWithAlpha(color, 0) }
|
|
6910
7139
|
]
|
|
6911
7140
|
},
|
|
6912
7141
|
stroke: { kind: "none" },
|
|
@@ -6929,7 +7158,7 @@ function guideNode(context, mark) {
|
|
|
6929
7158
|
d: `M ${mark.point.x} ${mark.point.y} V ${plot.y + plot.height}`,
|
|
6930
7159
|
style: {
|
|
6931
7160
|
fill: { kind: "none" },
|
|
6932
|
-
stroke:
|
|
7161
|
+
stroke: chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id),
|
|
6933
7162
|
strokeWidth: 1,
|
|
6934
7163
|
dash: [3, 4],
|
|
6935
7164
|
opacity: 0.55,
|
|
@@ -6950,7 +7179,7 @@ function dotNode(context, mark) {
|
|
|
6950
7179
|
rx: mark.radius,
|
|
6951
7180
|
ry: mark.radius,
|
|
6952
7181
|
style: {
|
|
6953
|
-
fill:
|
|
7182
|
+
fill: chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id),
|
|
6954
7183
|
shadow: glow ? { color: mark.color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : void 0,
|
|
6955
7184
|
pointerEvents: "none"
|
|
6956
7185
|
}
|
|
@@ -6963,7 +7192,7 @@ function labelNode3(context, mark, value) {
|
|
|
6963
7192
|
const text = formatHighlight(config?.highlightLabelFormat, config?.categories?.[mark.index] ?? "", value);
|
|
6964
7193
|
const width = Math.max(48, text.length * fontSize * 0.62);
|
|
6965
7194
|
return {
|
|
6966
|
-
...
|
|
7195
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
6967
7196
|
id: `chart-highlight-label-${mark.key}`,
|
|
6968
7197
|
order: nextOrder(),
|
|
6969
7198
|
bounds,
|
|
@@ -7043,15 +7272,15 @@ function createLineError(context, mark) {
|
|
|
7043
7272
|
return null;
|
|
7044
7273
|
}
|
|
7045
7274
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7046
|
-
const [lower, upper] =
|
|
7047
|
-
return
|
|
7275
|
+
const [lower, upper] = chunkQL7MNEMT_cjs.errorBarRange(mark.value, mark.error);
|
|
7276
|
+
return chunkQL7MNEMT_cjs.createVerticalErrorWhiskerNode({
|
|
7048
7277
|
id: `chart-line-error-${chart.id}-${mark.seriesId}-${mark.valueIndex}`,
|
|
7049
7278
|
order: nextOrder(),
|
|
7050
7279
|
bounds,
|
|
7051
7280
|
geometry: {
|
|
7052
7281
|
centerX: mark.position.x,
|
|
7053
|
-
startY: plot.y + plot.height -
|
|
7054
|
-
endY: plot.y + plot.height -
|
|
7282
|
+
startY: plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(lower, chart.axisY, plot.height),
|
|
7283
|
+
endY: plot.y + plot.height - chunkQL7MNEMT_cjs.mapChartValue(upper, chart.axisY, plot.height)
|
|
7055
7284
|
},
|
|
7056
7285
|
color: mark.color,
|
|
7057
7286
|
valueReference: { seriesId: mark.seriesId, valueIndex: mark.valueIndex }
|
|
@@ -7075,8 +7304,8 @@ function createLinePoint(context, mark) {
|
|
|
7075
7304
|
ry: visible ? radius : 6,
|
|
7076
7305
|
detail: { of: "chartValue", series: mark.seriesId, valueIndex: mark.valueIndex },
|
|
7077
7306
|
style: {
|
|
7078
|
-
fill: visible ?
|
|
7079
|
-
stroke: visible && strokeWidth > 0 ?
|
|
7307
|
+
fill: visible ? chunkQL7MNEMT_cjs.paint(fill2, diagnostics, chart.id) : { kind: "none" },
|
|
7308
|
+
stroke: visible && strokeWidth > 0 ? chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id) : void 0,
|
|
7080
7309
|
strokeWidth: visible && strokeWidth > 0 ? strokeWidth : void 0,
|
|
7081
7310
|
pointerEvents: visible ? void 0 : "all"
|
|
7082
7311
|
}
|
|
@@ -7096,22 +7325,22 @@ function createLinePath(context, series, points, color, tension) {
|
|
|
7096
7325
|
order: nextOrder(),
|
|
7097
7326
|
bounds: gradient ? { minX: plot.x, maxX: plot.x + plot.width, minY: plot.y, maxY: plot.y + plot.height } : bounds,
|
|
7098
7327
|
detail: { of: "chartSeries", series: series.id, lineTension: tension || void 0 },
|
|
7099
|
-
d:
|
|
7328
|
+
d: chunkQL7MNEMT_cjs.linePathData(points, tension),
|
|
7100
7329
|
style: {
|
|
7101
7330
|
fill: { kind: "none" },
|
|
7102
|
-
stroke:
|
|
7331
|
+
stroke: chunkQL7MNEMT_cjs.paint(gradient ?? color, diagnostics, chart.id),
|
|
7103
7332
|
strokeWidth: series.strokeWidth ?? config?.lineWidth ?? 2,
|
|
7104
7333
|
dash: series.dash,
|
|
7105
7334
|
lineCap: config?.lineWidth === void 0 ? void 0 : "round",
|
|
7106
7335
|
lineJoin: "round",
|
|
7107
|
-
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } :
|
|
7336
|
+
shadow: glow ? { color, opacity: 0.9, blur: glow, dx: 0, dy: 0 } : chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle)
|
|
7108
7337
|
}
|
|
7109
7338
|
};
|
|
7110
7339
|
}
|
|
7111
7340
|
|
|
7112
7341
|
// src/renderScene/charts/renderers/line/series.ts
|
|
7113
7342
|
function seriesColor(series, seriesIndex) {
|
|
7114
|
-
return
|
|
7343
|
+
return chunkQL7MNEMT_cjs.representativeColor(series.color, chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length]);
|
|
7115
7344
|
}
|
|
7116
7345
|
function renderLineSeriesArea(context, series, seriesIndex) {
|
|
7117
7346
|
const areaOpacity = context.chart.config?.areaOpacity;
|
|
@@ -7175,7 +7404,7 @@ function renderGridLines(context, layout) {
|
|
|
7175
7404
|
style: {
|
|
7176
7405
|
fill: { kind: "none" },
|
|
7177
7406
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
7178
|
-
strokeWidth:
|
|
7407
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1)
|
|
7179
7408
|
}
|
|
7180
7409
|
};
|
|
7181
7410
|
});
|
|
@@ -7183,7 +7412,7 @@ function renderGridLines(context, layout) {
|
|
|
7183
7412
|
function renderPercentageLabels(context, layout) {
|
|
7184
7413
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7185
7414
|
return PERCENT_TICKS.map((percent) => ({
|
|
7186
|
-
...
|
|
7415
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
7187
7416
|
id: `chart-mekko-pct-${chart.id}-${percent}`,
|
|
7188
7417
|
order: nextOrder(),
|
|
7189
7418
|
bounds,
|
|
@@ -7215,7 +7444,7 @@ function renderMekkoColumnLabels(context, layout, columnIndex, column) {
|
|
|
7215
7444
|
function createTotalLabel(context, layout, columnIndex, column) {
|
|
7216
7445
|
const { chart, plot, bounds, nextOrder } = context;
|
|
7217
7446
|
return {
|
|
7218
|
-
...
|
|
7447
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
7219
7448
|
id: `chart-mekko-total-${chart.id}-${columnIndex}`,
|
|
7220
7449
|
order: nextOrder(),
|
|
7221
7450
|
bounds,
|
|
@@ -7236,7 +7465,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
7236
7465
|
const { chart, bounds, nextOrder } = context;
|
|
7237
7466
|
const { label, width } = column;
|
|
7238
7467
|
return {
|
|
7239
|
-
...
|
|
7468
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
7240
7469
|
id: `chart-mekko-col-label-${chart.id}-${columnIndex}`,
|
|
7241
7470
|
order: nextOrder(),
|
|
7242
7471
|
bounds,
|
|
@@ -7250,7 +7479,7 @@ function createColumnLabel(context, layout, columnIndex, column) {
|
|
|
7250
7479
|
chart,
|
|
7251
7480
|
align: "center"
|
|
7252
7481
|
}),
|
|
7253
|
-
lines:
|
|
7482
|
+
lines: chunkQL7MNEMT_cjs.wrapText(label, width, layout.smallFontSize),
|
|
7254
7483
|
fontSize: layout.smallFontSize
|
|
7255
7484
|
};
|
|
7256
7485
|
}
|
|
@@ -7260,17 +7489,17 @@ function createMekkoLayout(context) {
|
|
|
7260
7489
|
const labels = mekkoColumnLabels(context);
|
|
7261
7490
|
const labelGutterWidth = context.showLabels ? 30 : 0;
|
|
7262
7491
|
const grid = createMekkoGrid(context, labelGutterWidth);
|
|
7263
|
-
const fontSize = Math.max(9,
|
|
7264
|
-
const
|
|
7492
|
+
const fontSize = Math.max(9, chunkQL7MNEMT_cjs.finite(context.chart.fontSize, 12));
|
|
7493
|
+
const columnGap2 = Math.max(0, chunkQL7MNEMT_cjs.finite(context.chart.config?.mekkoColumnGap, 4));
|
|
7265
7494
|
const smallFontSize = Math.max(8, fontSize - 1);
|
|
7266
7495
|
return {
|
|
7267
|
-
columns: createMekkoColumns(context, grid, labels,
|
|
7496
|
+
columns: createMekkoColumns(context, grid, labels, columnGap2),
|
|
7268
7497
|
fontSize,
|
|
7269
7498
|
smallFontSize,
|
|
7270
7499
|
labelGutterWidth,
|
|
7271
|
-
columnGap,
|
|
7272
|
-
labelSize: Math.max(6,
|
|
7273
|
-
valueSize: Math.max(6,
|
|
7500
|
+
columnGap: columnGap2,
|
|
7501
|
+
labelSize: Math.max(6, chunkQL7MNEMT_cjs.finite(context.chart.config?.mekkoLabelSize, smallFontSize)),
|
|
7502
|
+
valueSize: Math.max(6, chunkQL7MNEMT_cjs.finite(context.chart.config?.mekkoValueSize, smallFontSize)),
|
|
7274
7503
|
grid
|
|
7275
7504
|
};
|
|
7276
7505
|
}
|
|
@@ -7288,20 +7517,20 @@ function createMekkoGrid(context, labelGutterWidth) {
|
|
|
7288
7517
|
height: Math.max(1, context.plot.height - topGutter - bottomGutter)
|
|
7289
7518
|
};
|
|
7290
7519
|
}
|
|
7291
|
-
function createMekkoColumns(context, grid, labels,
|
|
7520
|
+
function createMekkoColumns(context, grid, labels, columnGap2) {
|
|
7292
7521
|
const totals = labels.map(
|
|
7293
7522
|
(_, columnIndex) => context.chart.series.reduce((sum, series) => sum + (series.values[columnIndex] ?? 0), 0)
|
|
7294
7523
|
);
|
|
7295
7524
|
const grandTotal = totals.reduce((sum, total) => sum + total, 0);
|
|
7296
7525
|
const maximumTotal = Math.max(1, ...totals);
|
|
7297
|
-
const availableWidth = Math.max(1, grid.width -
|
|
7526
|
+
const availableWidth = Math.max(1, grid.width - columnGap2 * Math.max(0, labels.length - 1));
|
|
7298
7527
|
let nextX = grid.x;
|
|
7299
7528
|
return labels.map((label, index) => {
|
|
7300
7529
|
const total = totals[index];
|
|
7301
7530
|
const width = grandTotal > 0 ? total / grandTotal * availableWidth : availableWidth / labels.length;
|
|
7302
7531
|
const height = context.chart.config?.mekkoVaryHeight ? grid.height * (total / maximumTotal) : grid.height;
|
|
7303
7532
|
const column = { label, total, x: nextX, y: grid.y + grid.height - height, width, height };
|
|
7304
|
-
nextX += width +
|
|
7533
|
+
nextX += width + columnGap2;
|
|
7305
7534
|
return column;
|
|
7306
7535
|
});
|
|
7307
7536
|
}
|
|
@@ -7327,12 +7556,12 @@ function createColumnBackdrop(context, layout, columnIndex) {
|
|
|
7327
7556
|
id: `chart-mekko-column-backdrop-${chart.id}-${columnIndex}`,
|
|
7328
7557
|
order: nextOrder(),
|
|
7329
7558
|
bounds,
|
|
7330
|
-
d:
|
|
7331
|
-
style: { fill:
|
|
7559
|
+
d: chunkQL7MNEMT_cjs.barShapePath(column.x, layout.grid.y, column.width, layout.grid.height, cornerRadius),
|
|
7560
|
+
style: { fill: chunkQL7MNEMT_cjs.paint(chart.gridColor ?? "#e2e8f0", diagnostics, chart.id), opacity: BACKDROP_OPACITY }
|
|
7332
7561
|
};
|
|
7333
7562
|
}
|
|
7334
7563
|
function mekkoCornerRadius(context) {
|
|
7335
|
-
return Math.max(0,
|
|
7564
|
+
return Math.max(0, chunkQL7MNEMT_cjs.finite(context.chart.config?.barCornerRadius, 2));
|
|
7336
7565
|
}
|
|
7337
7566
|
function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
7338
7567
|
const segments = [];
|
|
@@ -7343,7 +7572,7 @@ function calculateColumnSegments(seriesList, layout, columnIndex) {
|
|
|
7343
7572
|
const height = (column.total > 0 ? value / column.total : 0) * column.height;
|
|
7344
7573
|
const y = column.y + cumulativeHeight;
|
|
7345
7574
|
cumulativeHeight += height;
|
|
7346
|
-
const color = series.color ??
|
|
7575
|
+
const color = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
7347
7576
|
segments.push({
|
|
7348
7577
|
columnIndex,
|
|
7349
7578
|
seriesId: series.id,
|
|
@@ -7366,12 +7595,12 @@ function renderSegment(context, layout, segment, nextColor) {
|
|
|
7366
7595
|
}
|
|
7367
7596
|
function createSegmentNode(context, segment, nextColor) {
|
|
7368
7597
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
7369
|
-
const shadow =
|
|
7598
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7370
7599
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
7371
7600
|
const config = chart.config;
|
|
7372
7601
|
const radius = segment.isTop || config?.mekkoRoundAll ? mekkoCornerRadius(context) : 0;
|
|
7373
7602
|
const { x, y, width, height } = segment.frame;
|
|
7374
|
-
const segmentGap = Math.max(0,
|
|
7603
|
+
const segmentGap = Math.max(0, chunkQL7MNEMT_cjs.finite(config?.mekkoSegmentGap, 0));
|
|
7375
7604
|
const fallback = "#94a3b8";
|
|
7376
7605
|
const gradientBounds = {
|
|
7377
7606
|
minX: x + width / 2 - height / 2,
|
|
@@ -7383,20 +7612,20 @@ function createSegmentNode(context, segment, nextColor) {
|
|
|
7383
7612
|
kind: "linear-gradient",
|
|
7384
7613
|
angle: 90,
|
|
7385
7614
|
stops: [
|
|
7386
|
-
{ offset: 0, color:
|
|
7387
|
-
{ offset: 100, color:
|
|
7615
|
+
{ offset: 0, color: chunkQL7MNEMT_cjs.representativeColor(segment.color, fallback) },
|
|
7616
|
+
{ offset: 100, color: chunkQL7MNEMT_cjs.representativeColor(nextColor, fallback) }
|
|
7388
7617
|
]
|
|
7389
|
-
} :
|
|
7618
|
+
} : chunkQL7MNEMT_cjs.paint(segment.color, diagnostics, chart.id);
|
|
7390
7619
|
return {
|
|
7391
7620
|
type: "path",
|
|
7392
7621
|
id: `chart-mekko-seg-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
7393
7622
|
order: nextOrder(),
|
|
7394
7623
|
bounds: nextColor ? gradientBounds : bounds,
|
|
7395
|
-
d:
|
|
7624
|
+
d: chunkQL7MNEMT_cjs.barPath(x, y + segmentGap / 2, width, Math.max(0, height - segmentGap), radius, Boolean(config?.mekkoRoundAll)),
|
|
7396
7625
|
style: {
|
|
7397
7626
|
fill: fill2,
|
|
7398
7627
|
stroke: { kind: "solid", color: config?.mekkoSegmentStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
7399
|
-
strokeWidth:
|
|
7628
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(config?.mekkoSegmentStrokeWidth, chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1)),
|
|
7400
7629
|
shadow,
|
|
7401
7630
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
7402
7631
|
}
|
|
@@ -7412,17 +7641,17 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
7412
7641
|
const innerHeight = Math.max(1, height - 6);
|
|
7413
7642
|
const lineHeight = layout.labelSize * 1.2;
|
|
7414
7643
|
const valueHeight = layout.valueSize * 1.2;
|
|
7415
|
-
const labelLines =
|
|
7416
|
-
(line) =>
|
|
7644
|
+
const labelLines = chunkQL7MNEMT_cjs.wrapText(segment.seriesLabel, innerWidth, layout.labelSize).map(
|
|
7645
|
+
(line) => chunkQL7MNEMT_cjs.ellipsizeToWidth(line, innerWidth, layout.labelSize, true)
|
|
7417
7646
|
);
|
|
7418
7647
|
if (labelLines.length * lineHeight + valueHeight > innerHeight) {
|
|
7419
7648
|
return [];
|
|
7420
7649
|
}
|
|
7421
|
-
const textColor = chart.config?.mekkoTextColor ??
|
|
7650
|
+
const textColor = chart.config?.mekkoTextColor ?? chunkQL7MNEMT_cjs.contrastTextColor(chunkQL7MNEMT_cjs.representativeColor(segment.color, "#ffffff"));
|
|
7422
7651
|
const columnTotal = layout.columns[segment.columnIndex]?.total ?? 0;
|
|
7423
7652
|
const valueText = chart.config?.mekkoValueFormat === "percent" ? `${columnTotal > 0 ? Math.round(segment.value / columnTotal * 100) : 0}%` : String(segment.value);
|
|
7424
7653
|
const label = {
|
|
7425
|
-
...
|
|
7654
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
7426
7655
|
id: `chart-mekko-seg-label-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
7427
7656
|
order: nextOrder(),
|
|
7428
7657
|
bounds,
|
|
@@ -7436,7 +7665,7 @@ function createSegmentLabel(context, layout, segment) {
|
|
|
7436
7665
|
color: textColor
|
|
7437
7666
|
};
|
|
7438
7667
|
const valueNode = {
|
|
7439
|
-
...
|
|
7668
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
7440
7669
|
id: `chart-mekko-seg-value-${chart.id}-${segment.columnIndex}-${segment.seriesId}`,
|
|
7441
7670
|
order: nextOrder(),
|
|
7442
7671
|
bounds,
|
|
@@ -7469,7 +7698,7 @@ function renderMekko(context) {
|
|
|
7469
7698
|
|
|
7470
7699
|
// src/renderScene/charts/renderers/pie/center.ts
|
|
7471
7700
|
function fill(template, chart) {
|
|
7472
|
-
const values = chart.series.map((series) => Math.max(0,
|
|
7701
|
+
const values = chart.series.map((series) => Math.max(0, chunkQL7MNEMT_cjs.finite(series.values[0], 0)));
|
|
7473
7702
|
const total = values.reduce((sum, value) => sum + value, 0);
|
|
7474
7703
|
const first = values[0] ?? 0;
|
|
7475
7704
|
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 ?? "");
|
|
@@ -7481,7 +7710,7 @@ function renderPieCenter(context, geometry) {
|
|
|
7481
7710
|
return [];
|
|
7482
7711
|
}
|
|
7483
7712
|
const lines = fill(template, chart).split(/\\n|\n/);
|
|
7484
|
-
const fontSize =
|
|
7713
|
+
const fontSize = chunkQL7MNEMT_cjs.finite(chart.config?.pieCenterSize, Math.max(14, Math.min(40, geometry.outerRadius * 0.3)));
|
|
7485
7714
|
const lineHeight = fontSize * 1.2;
|
|
7486
7715
|
const width = Math.max(40, (geometry.innerRadius > 0 ? geometry.innerRadius : geometry.outerRadius * 0.6) * 2);
|
|
7487
7716
|
const text = {
|
|
@@ -7494,7 +7723,7 @@ function renderPieCenter(context, geometry) {
|
|
|
7494
7723
|
width,
|
|
7495
7724
|
height: lineHeight * lines.length,
|
|
7496
7725
|
lines,
|
|
7497
|
-
fontFamily: chart.fontFamily ??
|
|
7726
|
+
fontFamily: chart.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
7498
7727
|
fontSize,
|
|
7499
7728
|
fontWeight: "bold",
|
|
7500
7729
|
align: "center",
|
|
@@ -7514,14 +7743,14 @@ var radians = (degrees) => degrees * Math.PI / 180;
|
|
|
7514
7743
|
function renderPieSlices(context, geometry) {
|
|
7515
7744
|
const config = context.chart.config;
|
|
7516
7745
|
const marks = createPieSliceMarks(context.chart.series, geometry.total, {
|
|
7517
|
-
start: TOP + radians(
|
|
7518
|
-
sweep: Math.min(FULL, Math.max(radians(1), radians(
|
|
7519
|
-
explode: Math.max(0,
|
|
7746
|
+
start: TOP + radians(chunkQL7MNEMT_cjs.finite(config?.pieStartAngle, 0)),
|
|
7747
|
+
sweep: Math.min(FULL, Math.max(radians(1), radians(chunkQL7MNEMT_cjs.finite(config?.pieSweep, 360)))),
|
|
7748
|
+
explode: Math.max(0, chunkQL7MNEMT_cjs.finite(config?.pieExplode, 0))
|
|
7520
7749
|
});
|
|
7521
7750
|
const gapPx = config?.pieSliceGap ?? 0;
|
|
7522
7751
|
return [
|
|
7523
7752
|
...marks.flatMap((mark) => createSliceNodes(context, shiftGeometry(geometry, mark), mark, gapPx)),
|
|
7524
|
-
...
|
|
7753
|
+
...chunkQL7MNEMT_cjs.renderPieLabels(
|
|
7525
7754
|
context,
|
|
7526
7755
|
geometry,
|
|
7527
7756
|
marks.map((mark) => ({
|
|
@@ -7553,20 +7782,20 @@ function createPieSliceMarks(seriesList, total, layout) {
|
|
|
7553
7782
|
const marks = [];
|
|
7554
7783
|
let angle = layout.start;
|
|
7555
7784
|
seriesList.forEach((series, seriesIndex) => {
|
|
7556
|
-
const value = Math.max(0,
|
|
7785
|
+
const value = Math.max(0, chunkQL7MNEMT_cjs.finite(series.values[0], 0));
|
|
7557
7786
|
const sweep = value / total * layout.sweep;
|
|
7558
7787
|
marks.push({
|
|
7559
7788
|
seriesId: series.id,
|
|
7560
7789
|
label: series.label,
|
|
7561
|
-
color: series.color ??
|
|
7790
|
+
color: series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length],
|
|
7562
7791
|
stroke: series.stroke,
|
|
7563
7792
|
strokeWidth: series.strokeWidth,
|
|
7564
7793
|
value,
|
|
7565
7794
|
share: value / total,
|
|
7566
7795
|
angles: { start: angle, end: angle + Math.min(sweep, layout.sweep >= FULL ? MAXIMUM_SWEEP : layout.sweep) },
|
|
7567
|
-
explode: Math.max(0,
|
|
7568
|
-
labelOffsetX:
|
|
7569
|
-
labelOffsetY:
|
|
7796
|
+
explode: Math.max(0, chunkQL7MNEMT_cjs.finite(series.offset, layout.explode)),
|
|
7797
|
+
labelOffsetX: chunkQL7MNEMT_cjs.finite(series.labelOffsetX, 0),
|
|
7798
|
+
labelOffsetY: chunkQL7MNEMT_cjs.finite(series.labelOffsetY, 0)
|
|
7570
7799
|
});
|
|
7571
7800
|
angle += sweep;
|
|
7572
7801
|
});
|
|
@@ -7589,14 +7818,14 @@ function pieOuterShadow(shadow, gapPx) {
|
|
|
7589
7818
|
function sliceCornerRadius(geometry, mark, gapPx) {
|
|
7590
7819
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
7591
7820
|
const rawSweep = mark.angles.end - mark.angles.start;
|
|
7592
|
-
const usesInnerArc =
|
|
7593
|
-
const gapSweep = 2 *
|
|
7821
|
+
const usesInnerArc = chunkQL7MNEMT_cjs.pieUsesInnerArc(geometry, mark.angles, gapPx);
|
|
7822
|
+
const gapSweep = 2 * chunkQL7MNEMT_cjs.gapInsetAngle(halfGap, geometry.outerRadius);
|
|
7594
7823
|
const availableSweep = Math.max(0, rawSweep - gapSweep);
|
|
7595
7824
|
return Math.min(
|
|
7596
7825
|
geometry.cornerRadius,
|
|
7597
|
-
usesInnerArc ?
|
|
7826
|
+
usesInnerArc ? chunkQL7MNEMT_cjs.maxPieCornerRadius(geometry.outerRadius, geometry.innerRadius, availableSweep) : chunkQL7MNEMT_cjs.maxApexCornerRadius(
|
|
7598
7827
|
geometry.outerRadius,
|
|
7599
|
-
|
|
7828
|
+
chunkQL7MNEMT_cjs.pieApexRadius(halfGap, rawSweep, geometry.outerRadius),
|
|
7600
7829
|
availableSweep
|
|
7601
7830
|
)
|
|
7602
7831
|
);
|
|
@@ -7609,14 +7838,14 @@ function sliceStroke(context, mark) {
|
|
|
7609
7838
|
}
|
|
7610
7839
|
return {
|
|
7611
7840
|
stroke: { kind: "solid", color: strokeColor },
|
|
7612
|
-
strokeWidth:
|
|
7841
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(mark.strokeWidth, chunkQL7MNEMT_cjs.finite(config?.pieStrokeWidth, 1))
|
|
7613
7842
|
};
|
|
7614
7843
|
}
|
|
7615
7844
|
function createSliceNodes(context, geometry, mark, gapPx) {
|
|
7616
7845
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
7617
|
-
const fill2 =
|
|
7618
|
-
const slicePath =
|
|
7619
|
-
const shadow =
|
|
7846
|
+
const fill2 = chunkQL7MNEMT_cjs.paint(mark.color, diagnostics, chart.id);
|
|
7847
|
+
const slicePath = chunkQL7MNEMT_cjs.createPieSlicePath(geometry, mark.angles, sliceCornerRadius(geometry, mark, gapPx), gapPx);
|
|
7848
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7620
7849
|
const strokeStyle = sliceStroke(context, mark);
|
|
7621
7850
|
const glow = chart.config?.pieGlow;
|
|
7622
7851
|
const shadowCaster = shadow ? {
|
|
@@ -7647,12 +7876,12 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
7647
7876
|
pieEnd: mark.angles.end,
|
|
7648
7877
|
pieValue: mark.value
|
|
7649
7878
|
},
|
|
7650
|
-
prop:
|
|
7879
|
+
prop: chunkQL7MNEMT_cjs.seriesValueProp(mark.seriesId, 0),
|
|
7651
7880
|
style: {
|
|
7652
7881
|
fill: fill2,
|
|
7653
7882
|
...strokeStyle,
|
|
7654
7883
|
innerShadow: shadow,
|
|
7655
|
-
shadow: glow ? { color:
|
|
7884
|
+
shadow: glow ? { color: chunkQL7MNEMT_cjs.representativeColor(mark.color, "#ffffff"), opacity: 0.85, blur: glow, dx: 0, dy: 0 } : void 0
|
|
7656
7885
|
}
|
|
7657
7886
|
};
|
|
7658
7887
|
return shadowCaster ? [shadowCaster, slice] : [slice];
|
|
@@ -7660,7 +7889,7 @@ function createSliceNodes(context, geometry, mark, gapPx) {
|
|
|
7660
7889
|
|
|
7661
7890
|
// src/renderScene/charts/renderers/pie.ts
|
|
7662
7891
|
function renderPie(context) {
|
|
7663
|
-
const geometry =
|
|
7892
|
+
const geometry = chunkQL7MNEMT_cjs.createPieGeometry(context);
|
|
7664
7893
|
return [...renderPieSlices(context, geometry), ...renderPieCenter(context, geometry)];
|
|
7665
7894
|
}
|
|
7666
7895
|
|
|
@@ -7668,7 +7897,7 @@ function renderPie(context) {
|
|
|
7668
7897
|
var TOP2 = -Math.PI / 2;
|
|
7669
7898
|
var TRACK_COLOR_FALLBACK = "#e2e8f0";
|
|
7670
7899
|
var MIN_LABEL_SWEEP = 14 * Math.PI / 180;
|
|
7671
|
-
var
|
|
7900
|
+
var LABEL_WIDTH2 = 80;
|
|
7672
7901
|
var LABEL_RADIUS_FRACTION = 0.62;
|
|
7673
7902
|
var OUTSIDE_GAP = 14;
|
|
7674
7903
|
var LEADER_INSET = 3;
|
|
@@ -7677,18 +7906,18 @@ var OUTSIDE_FALLBACK_COLOR = "#334155";
|
|
|
7677
7906
|
function layoutOf(context) {
|
|
7678
7907
|
const { chart, plot } = context;
|
|
7679
7908
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
7680
|
-
const axisMin =
|
|
7909
|
+
const axisMin = chunkQL7MNEMT_cjs.finite(chart.axisY.min, 0);
|
|
7681
7910
|
return {
|
|
7682
7911
|
centerX: plot.x + plot.width / 2,
|
|
7683
7912
|
centerY: plot.y + plot.height / 2,
|
|
7684
7913
|
maxRadius,
|
|
7685
|
-
innerRadius: Math.max(0, Math.min(
|
|
7686
|
-
cornerRadius: Math.max(0,
|
|
7687
|
-
gapPx: Math.max(0,
|
|
7914
|
+
innerRadius: Math.max(0, Math.min(chunkQL7MNEMT_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1)),
|
|
7915
|
+
cornerRadius: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.pieCornerRadius, 0)),
|
|
7916
|
+
gapPx: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.pieSliceGap, 0)),
|
|
7688
7917
|
axisMin,
|
|
7689
|
-
range:
|
|
7918
|
+
range: chunkQL7MNEMT_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
7690
7919
|
sweep: chart.series.length > 0 ? Math.PI * 2 / chart.series.length : 0,
|
|
7691
|
-
start: TOP2 +
|
|
7920
|
+
start: TOP2 + chunkQL7MNEMT_cjs.finite(chart.config?.pieStartAngle, 0) * Math.PI / 180
|
|
7692
7921
|
};
|
|
7693
7922
|
}
|
|
7694
7923
|
function clampedCorner(layout, outerRadius, angles) {
|
|
@@ -7696,19 +7925,19 @@ function clampedCorner(layout, outerRadius, angles) {
|
|
|
7696
7925
|
const geometry = { centerX, centerY, outerRadius, innerRadius };
|
|
7697
7926
|
const halfGap = Math.max(0, gapPx) / 2;
|
|
7698
7927
|
const rawSweep = angles.end - angles.start;
|
|
7699
|
-
const availableSweep = Math.max(0, rawSweep - 2 *
|
|
7700
|
-
if (
|
|
7701
|
-
return Math.min(cornerRadius,
|
|
7928
|
+
const availableSweep = Math.max(0, rawSweep - 2 * chunkQL7MNEMT_cjs.gapInsetAngle(halfGap, outerRadius));
|
|
7929
|
+
if (chunkQL7MNEMT_cjs.pieUsesInnerArc(geometry, angles, gapPx)) {
|
|
7930
|
+
return Math.min(cornerRadius, chunkQL7MNEMT_cjs.maxPieCornerRadius(outerRadius, innerRadius, availableSweep));
|
|
7702
7931
|
}
|
|
7703
|
-
const apexRadius =
|
|
7704
|
-
return Math.min(cornerRadius,
|
|
7932
|
+
const apexRadius = chunkQL7MNEMT_cjs.pieApexRadius(halfGap, rawSweep, outerRadius);
|
|
7933
|
+
return Math.min(cornerRadius, chunkQL7MNEMT_cjs.maxApexCornerRadius(outerRadius, apexRadius, availableSweep));
|
|
7705
7934
|
}
|
|
7706
7935
|
function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor) {
|
|
7707
7936
|
const { chart, bounds, diagnostics, nextOrder } = context;
|
|
7708
7937
|
const { centerX, centerY, innerRadius, maxRadius, gapPx } = layout;
|
|
7709
|
-
const color =
|
|
7710
|
-
const shadow =
|
|
7711
|
-
const trackPath =
|
|
7938
|
+
const color = chunkQL7MNEMT_cjs.paint(rawColor, diagnostics, chart.id);
|
|
7939
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
7940
|
+
const trackPath = chunkQL7MNEMT_cjs.createPieSlicePath(
|
|
7712
7941
|
{ centerX, centerY, outerRadius: maxRadius, innerRadius },
|
|
7713
7942
|
angles,
|
|
7714
7943
|
clampedCorner(layout, maxRadius, angles),
|
|
@@ -7721,12 +7950,12 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
7721
7950
|
bounds,
|
|
7722
7951
|
d: trackPath,
|
|
7723
7952
|
style: {
|
|
7724
|
-
fill:
|
|
7953
|
+
fill: chunkQL7MNEMT_cjs.paint(chart.gridColor ?? TRACK_COLOR_FALLBACK, diagnostics, chart.id),
|
|
7725
7954
|
opacity: chart.config?.polarTrackOpacity,
|
|
7726
7955
|
...trackStroke(context)
|
|
7727
7956
|
}
|
|
7728
7957
|
};
|
|
7729
|
-
const wedgePath =
|
|
7958
|
+
const wedgePath = chunkQL7MNEMT_cjs.createPieSlicePath(
|
|
7730
7959
|
{ centerX, centerY, outerRadius, innerRadius },
|
|
7731
7960
|
angles,
|
|
7732
7961
|
clampedCorner(layout, outerRadius, angles),
|
|
@@ -7755,7 +7984,7 @@ function wedgeNodes(context, layout, series, angles, outerRadius, value, rawColo
|
|
|
7755
7984
|
pieEnd: angles.end,
|
|
7756
7985
|
pieValue: value
|
|
7757
7986
|
},
|
|
7758
|
-
prop:
|
|
7987
|
+
prop: chunkQL7MNEMT_cjs.seriesValueProp(series.id, 0),
|
|
7759
7988
|
style: { fill: color, innerShadow: shadow, ...wedgeStroke(context) }
|
|
7760
7989
|
};
|
|
7761
7990
|
return shadowCaster ? [track, shadowCaster, wedge] : [track, wedge];
|
|
@@ -7768,7 +7997,7 @@ function trackStroke(context) {
|
|
|
7768
7997
|
const dash = (config.polarTrackDash ?? "").split(/[ ,]+/).map(Number).filter((part) => Number.isFinite(part) && part > 0);
|
|
7769
7998
|
return {
|
|
7770
7999
|
stroke: { kind: "solid", color: config.polarTrackStroke },
|
|
7771
|
-
strokeWidth:
|
|
8000
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(config.polarTrackStrokeWidth, 1),
|
|
7772
8001
|
dash: dash.length > 0 ? dash : void 0
|
|
7773
8002
|
};
|
|
7774
8003
|
}
|
|
@@ -7779,7 +8008,7 @@ function wedgeStroke(context) {
|
|
|
7779
8008
|
}
|
|
7780
8009
|
return {
|
|
7781
8010
|
stroke: { kind: "solid", color: config.pieStroke },
|
|
7782
|
-
strokeWidth:
|
|
8011
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(config.pieStrokeWidth, 1)
|
|
7783
8012
|
};
|
|
7784
8013
|
}
|
|
7785
8014
|
function ringNodes(context, layout) {
|
|
@@ -7787,7 +8016,7 @@ function ringNodes(context, layout) {
|
|
|
7787
8016
|
if (!chart.config?.polarRings || layout.range <= 0) {
|
|
7788
8017
|
return [];
|
|
7789
8018
|
}
|
|
7790
|
-
return
|
|
8019
|
+
return chunkQL7MNEMT_cjs.chartTicks(chart.axisY).filter((tick) => tick > layout.axisMin && tick < layout.axisMin + layout.range).map((tick) => {
|
|
7791
8020
|
const radius = layout.innerRadius + (layout.maxRadius - layout.innerRadius) * (tick - layout.axisMin) / layout.range;
|
|
7792
8021
|
return {
|
|
7793
8022
|
type: "ellipse",
|
|
@@ -7801,7 +8030,7 @@ function ringNodes(context, layout) {
|
|
|
7801
8030
|
style: {
|
|
7802
8031
|
fill: { kind: "none" },
|
|
7803
8032
|
stroke: { kind: "solid", color: chart.textColor ?? "#334155" },
|
|
7804
|
-
strokeWidth:
|
|
8033
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1),
|
|
7805
8034
|
opacity: 0.25
|
|
7806
8035
|
}
|
|
7807
8036
|
};
|
|
@@ -7813,10 +8042,10 @@ function renderPolarArea(context) {
|
|
|
7813
8042
|
const showLabels = context.showLabels && sweep >= MIN_LABEL_SWEEP;
|
|
7814
8043
|
const wedges = context.chart.series.flatMap((series, index) => {
|
|
7815
8044
|
const angles = { start: start + index * sweep, end: start + (index + 1) * sweep };
|
|
7816
|
-
const value = Math.max(0,
|
|
8045
|
+
const value = Math.max(0, chunkQL7MNEMT_cjs.finite(series.values[0], 0));
|
|
7817
8046
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
7818
8047
|
const outerRadius = Math.max(innerRadius + 1, innerRadius + (maxRadius - innerRadius) * fraction);
|
|
7819
|
-
const rawColor = series.color ??
|
|
8048
|
+
const rawColor = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[index % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
7820
8049
|
const nodes = wedgeNodes(context, layout, series, angles, outerRadius, value, rawColor);
|
|
7821
8050
|
if (!showLabels) {
|
|
7822
8051
|
return nodes;
|
|
@@ -7827,10 +8056,10 @@ function renderPolarArea(context) {
|
|
|
7827
8056
|
return [...wedges, ...ringNodes(context, layout)];
|
|
7828
8057
|
}
|
|
7829
8058
|
function labelSizes(chart) {
|
|
7830
|
-
const base = Math.max(9,
|
|
8059
|
+
const base = Math.max(9, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12));
|
|
7831
8060
|
return {
|
|
7832
|
-
nameSize: Math.max(6,
|
|
7833
|
-
valueSize: Math.max(6,
|
|
8061
|
+
nameSize: Math.max(6, chunkQL7MNEMT_cjs.finite(chart.config?.polarNameSize, base)),
|
|
8062
|
+
valueSize: Math.max(6, chunkQL7MNEMT_cjs.finite(chart.config?.polarValueSize, base))
|
|
7834
8063
|
};
|
|
7835
8064
|
}
|
|
7836
8065
|
function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
@@ -7838,22 +8067,22 @@ function labelPlacement2(context, geometry, angles, series, fillColor) {
|
|
|
7838
8067
|
const { nameSize, valueSize } = labelSizes(context.chart);
|
|
7839
8068
|
const lineHeight = (nameSize + valueSize) * 1.2 / 2;
|
|
7840
8069
|
const ringThickness = geometry.outerRadius - geometry.innerRadius;
|
|
7841
|
-
const labelOffsetX =
|
|
7842
|
-
const labelOffsetY =
|
|
8070
|
+
const labelOffsetX = chunkQL7MNEMT_cjs.finite(series.labelOffsetX, 0);
|
|
8071
|
+
const labelOffsetY = chunkQL7MNEMT_cjs.finite(series.labelOffsetY, 0);
|
|
7843
8072
|
const hasManualOffset = labelOffsetX !== 0 || labelOffsetY !== 0;
|
|
7844
8073
|
const tooThin = ringThickness < lineHeight * 2 + 6;
|
|
7845
8074
|
const chordWidth = 2 * geometry.outerRadius * Math.sin(Math.abs(angles.end - angles.start) / 2);
|
|
7846
|
-
const fitsInline = !tooThin && chordWidth >=
|
|
8075
|
+
const fitsInline = !tooThin && chordWidth >= LABEL_WIDTH2;
|
|
7847
8076
|
const outsideLabels = context.chart.config?.polarOutsideLabels ?? false;
|
|
7848
8077
|
if (!fitsInline && !hasManualOffset && !outsideLabels) {
|
|
7849
8078
|
return void 0;
|
|
7850
8079
|
}
|
|
7851
8080
|
const outside = hasManualOffset || !fitsInline;
|
|
7852
|
-
const tickStart =
|
|
7853
|
-
const point = outside ? hasManualOffset ? addOffset(
|
|
7854
|
-
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor :
|
|
7855
|
-
|
|
7856
|
-
|
|
8081
|
+
const tickStart = chunkQL7MNEMT_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + LEADER_INSET);
|
|
8082
|
+
const point = outside ? hasManualOffset ? addOffset(chunkQL7MNEMT_cjs.pieArcPoint(geometry, mid, geometry.outerRadius), labelOffsetX, labelOffsetY) : chunkQL7MNEMT_cjs.pieArcPoint(geometry, mid, geometry.outerRadius + OUTSIDE_GAP) : chunkQL7MNEMT_cjs.pieArcPoint(geometry, mid, geometry.innerRadius + ringThickness * LABEL_RADIUS_FRACTION);
|
|
8083
|
+
const color = outside ? outsideLabels && context.chart.textColor ? context.chart.textColor : chunkQL7MNEMT_cjs.sameHueTint(chunkQL7MNEMT_cjs.representativeColor(fillColor, OUTSIDE_FALLBACK_COLOR), OUTSIDE_TINT_LIGHTNESS) ?? OUTSIDE_FALLBACK_COLOR : chunkQL7MNEMT_cjs.sameHueContrastColor(
|
|
8084
|
+
chunkQL7MNEMT_cjs.representativeColor(fillColor, "#0f172a"),
|
|
8085
|
+
chunkQL7MNEMT_cjs.contrastTextColor(chunkQL7MNEMT_cjs.representativeColor(fillColor, "#0f172a"))
|
|
7857
8086
|
);
|
|
7858
8087
|
return { point, color, outside, mid, tickStart };
|
|
7859
8088
|
}
|
|
@@ -7866,7 +8095,7 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7866
8095
|
const { point, color, outside, mid, tickStart } = placement;
|
|
7867
8096
|
const { nameSize, valueSize } = labelSizes(chart);
|
|
7868
8097
|
const lineHeight = Math.max(nameSize, valueSize) * 1.2;
|
|
7869
|
-
const tickEnd = outside ?
|
|
8098
|
+
const tickEnd = outside ? chunkQL7MNEMT_cjs.clipSegmentToRect(tickStart, point, LABEL_WIDTH2 / 2, lineHeight) : tickStart;
|
|
7870
8099
|
const tick = {
|
|
7871
8100
|
type: "path",
|
|
7872
8101
|
id: `chart-polar-area-label-tick-${chart.id}-${series.id}`,
|
|
@@ -7886,9 +8115,9 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7886
8115
|
};
|
|
7887
8116
|
const base = {
|
|
7888
8117
|
bounds,
|
|
7889
|
-
x: point.x -
|
|
7890
|
-
width:
|
|
7891
|
-
fontFamily: chart.fontFamily ??
|
|
8118
|
+
x: point.x - LABEL_WIDTH2 / 2,
|
|
8119
|
+
width: LABEL_WIDTH2,
|
|
8120
|
+
fontFamily: chart.fontFamily ?? chunkQL7MNEMT_cjs.DEFAULT_FONT,
|
|
7892
8121
|
align: "center",
|
|
7893
8122
|
verticalAlign: "middle",
|
|
7894
8123
|
lineHeight: 1.2,
|
|
@@ -7911,7 +8140,7 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7911
8140
|
lines: [series.label],
|
|
7912
8141
|
fontWeight: valueFirst ? "normal" : "bold",
|
|
7913
8142
|
detail,
|
|
7914
|
-
prop:
|
|
8143
|
+
prop: chunkQL7MNEMT_cjs.seriesLabelProp(series.id)
|
|
7915
8144
|
};
|
|
7916
8145
|
const valueText = {
|
|
7917
8146
|
type: "text",
|
|
@@ -7921,10 +8150,10 @@ function createWedgeLabel(context, geometry, angles, series, value, fillColor) {
|
|
|
7921
8150
|
y: valueY,
|
|
7922
8151
|
height: valueSize * 1.2,
|
|
7923
8152
|
fontSize: valueSize,
|
|
7924
|
-
lines: [
|
|
8153
|
+
lines: [chunkQL7MNEMT_cjs.formatFieldValue(value)],
|
|
7925
8154
|
fontWeight: valueFirst ? "bold" : "normal",
|
|
7926
8155
|
detail,
|
|
7927
|
-
prop:
|
|
8156
|
+
prop: chunkQL7MNEMT_cjs.seriesValueProp(series.id, 0),
|
|
7928
8157
|
propKind: "value"
|
|
7929
8158
|
};
|
|
7930
8159
|
return [tick, nameText, valueText];
|
|
@@ -7942,10 +8171,10 @@ function radarFrameFor(context) {
|
|
|
7942
8171
|
return {
|
|
7943
8172
|
centerX: plot.x + plot.width / 2,
|
|
7944
8173
|
centerY: plot.y + plot.height / 2,
|
|
7945
|
-
radius:
|
|
8174
|
+
radius: chunkQL7MNEMT_cjs.radarRadius(plot.width, plot.height, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12), context.showLabels),
|
|
7946
8175
|
min: chart.axisY.min,
|
|
7947
8176
|
max: chart.axisY.max,
|
|
7948
|
-
count:
|
|
8177
|
+
count: chunkQL7MNEMT_cjs.radarCategoryCount(configuredCount, dataCount),
|
|
7949
8178
|
curved: chart.chartType === "radial",
|
|
7950
8179
|
tension: chart.config?.radarTension
|
|
7951
8180
|
};
|
|
@@ -7955,7 +8184,7 @@ function createRadarGeometry(context) {
|
|
|
7955
8184
|
const configuredCategories = chart.config?.categories?.filter(Boolean) ?? [];
|
|
7956
8185
|
const frame = radarFrameFor(context);
|
|
7957
8186
|
const categories = createCategories(configuredCategories, frame.count);
|
|
7958
|
-
const pointAt = (pointRadius, pointIndex) =>
|
|
8187
|
+
const pointAt = (pointRadius, pointIndex) => chunkQL7MNEMT_cjs.radarPointAt(frame, pointIndex, pointRadius);
|
|
7959
8188
|
return {
|
|
7960
8189
|
circular: frame.curved,
|
|
7961
8190
|
areaOpacity: Math.max(0, Math.min(1, chart.config?.areaOpacity ?? 0.16)),
|
|
@@ -7967,9 +8196,9 @@ function createRadarGeometry(context) {
|
|
|
7967
8196
|
centerX: frame.centerX,
|
|
7968
8197
|
centerY: frame.centerY,
|
|
7969
8198
|
radius: frame.radius,
|
|
7970
|
-
radiusForValue: (value) =>
|
|
8199
|
+
radiusForValue: (value) => chunkQL7MNEMT_cjs.radarRadiusForValue(frame, value),
|
|
7971
8200
|
pointAt,
|
|
7972
|
-
polygonPath: (pointRadius) =>
|
|
8201
|
+
polygonPath: (pointRadius) => chunkQL7MNEMT_cjs.radarSeriesPath(
|
|
7973
8202
|
categories.map((_, index) => pointAt(pointRadius, index)),
|
|
7974
8203
|
false
|
|
7975
8204
|
)
|
|
@@ -7990,7 +8219,7 @@ function renderRadarGrid(context, geometry) {
|
|
|
7990
8219
|
return [...renderRings(context, geometry), ...geometry.showSpokes ? renderSpokes(context, geometry) : []];
|
|
7991
8220
|
}
|
|
7992
8221
|
function renderRings(context, geometry) {
|
|
7993
|
-
return
|
|
8222
|
+
return chunkQL7MNEMT_cjs.chartTicks(context.chart.axisY).filter((tick) => tick > context.chart.axisY.min).map((tick) => createRingNode(context, geometry, tick));
|
|
7994
8223
|
}
|
|
7995
8224
|
function createRingNode(context, geometry, tick) {
|
|
7996
8225
|
const { chart, bounds, nextOrder } = context;
|
|
@@ -7998,7 +8227,7 @@ function createRingNode(context, geometry, tick) {
|
|
|
7998
8227
|
const style = {
|
|
7999
8228
|
fill: { kind: "none" },
|
|
8000
8229
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8001
|
-
strokeWidth:
|
|
8230
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1)
|
|
8002
8231
|
};
|
|
8003
8232
|
if (geometry.circular) {
|
|
8004
8233
|
return {
|
|
@@ -8035,7 +8264,7 @@ function renderSpokes(context, geometry) {
|
|
|
8035
8264
|
style: {
|
|
8036
8265
|
fill: { kind: "none" },
|
|
8037
8266
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8038
|
-
strokeWidth:
|
|
8267
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1)
|
|
8039
8268
|
}
|
|
8040
8269
|
};
|
|
8041
8270
|
});
|
|
@@ -8055,7 +8284,7 @@ function createCategoryLabel(context, geometry, category, categoryIndex) {
|
|
|
8055
8284
|
const labelPoint = geometry.pointAt(geometry.radius + 10, categoryIndex);
|
|
8056
8285
|
const horizontalOffset = labelPoint.x - geometry.centerX;
|
|
8057
8286
|
const width = Math.max(64, Math.min(120, plot.width / 3));
|
|
8058
|
-
return
|
|
8287
|
+
return chunkQL7MNEMT_cjs.chartText({
|
|
8059
8288
|
id: `chart-radar-label-${chart.id}-${categoryIndex}`,
|
|
8060
8289
|
order: nextOrder(),
|
|
8061
8290
|
bounds,
|
|
@@ -8093,9 +8322,9 @@ function renderRadarSeries(context, geometry) {
|
|
|
8093
8322
|
return nodes;
|
|
8094
8323
|
}
|
|
8095
8324
|
function renderSeries(context, geometry, series, seriesIndex) {
|
|
8096
|
-
const color = series.color ??
|
|
8325
|
+
const color = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
8097
8326
|
const points = seriesPoints(series, context, geometry);
|
|
8098
|
-
const path =
|
|
8327
|
+
const path = chunkQL7MNEMT_cjs.radarSeriesPath(points, geometry.circular, geometry.tension);
|
|
8099
8328
|
return [
|
|
8100
8329
|
createSeriesFill(context, geometry, series, path, color),
|
|
8101
8330
|
...geometry.strokeWidth > 0 ? [createSeriesStroke(context, geometry, series, path, color)] : [],
|
|
@@ -8118,7 +8347,7 @@ function createSeriesFill(context, geometry, series, path, color) {
|
|
|
8118
8347
|
d: path,
|
|
8119
8348
|
detail: { of: "chartSeries", series: series.id },
|
|
8120
8349
|
style: {
|
|
8121
|
-
fill:
|
|
8350
|
+
fill: chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id),
|
|
8122
8351
|
stroke: { kind: "none" },
|
|
8123
8352
|
opacity: Math.max(0, Math.min(1, series.opacity ?? geometry.areaOpacity))
|
|
8124
8353
|
}
|
|
@@ -8135,10 +8364,10 @@ function createSeriesStroke(context, geometry, series, path, color) {
|
|
|
8135
8364
|
detail: { of: "chartSeries", series: series.id },
|
|
8136
8365
|
style: {
|
|
8137
8366
|
fill: { kind: "none" },
|
|
8138
|
-
stroke:
|
|
8367
|
+
stroke: chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id),
|
|
8139
8368
|
strokeWidth: geometry.strokeWidth,
|
|
8140
8369
|
lineJoin: "round",
|
|
8141
|
-
shadow:
|
|
8370
|
+
shadow: chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle)
|
|
8142
8371
|
}
|
|
8143
8372
|
};
|
|
8144
8373
|
}
|
|
@@ -8154,8 +8383,8 @@ function createSeriesPoints(context, geometry, series, points, color) {
|
|
|
8154
8383
|
rx: geometry.pointSize,
|
|
8155
8384
|
ry: geometry.pointSize,
|
|
8156
8385
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex, mark: "radar-vertex" },
|
|
8157
|
-
prop:
|
|
8158
|
-
style: { fill:
|
|
8386
|
+
prop: chunkQL7MNEMT_cjs.seriesValueProp(series.id, pointIndex),
|
|
8387
|
+
style: { fill: chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id) }
|
|
8159
8388
|
}));
|
|
8160
8389
|
}
|
|
8161
8390
|
|
|
@@ -8209,25 +8438,25 @@ function ringProgressPath(cx, cy, r, sweep, from) {
|
|
|
8209
8438
|
}
|
|
8210
8439
|
function layoutOf2(context) {
|
|
8211
8440
|
const { chart, plot } = context;
|
|
8212
|
-
const axisMin =
|
|
8441
|
+
const axisMin = chunkQL7MNEMT_cjs.finite(chart.axisY.min, 0);
|
|
8213
8442
|
return {
|
|
8214
8443
|
centerX: plot.x + plot.width / 2,
|
|
8215
8444
|
centerY: plot.y + plot.height / 2,
|
|
8216
8445
|
outerRadius: Math.max(1, Math.min(plot.width, plot.height) / 2 - 4),
|
|
8217
|
-
ringThickness: Math.max(1,
|
|
8218
|
-
ringGap: Math.max(0,
|
|
8446
|
+
ringThickness: Math.max(1, chunkQL7MNEMT_cjs.finite(chart.config?.ringThickness, DEFAULT_RING_THICKNESS)),
|
|
8447
|
+
ringGap: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.ringGap, DEFAULT_RING_GAP)),
|
|
8219
8448
|
axisMin,
|
|
8220
|
-
range:
|
|
8221
|
-
start: TOP3 +
|
|
8222
|
-
total: Math.min(360, Math.max(1,
|
|
8223
|
-
trackOpacity: Math.min(1, Math.max(0,
|
|
8449
|
+
range: chunkQL7MNEMT_cjs.finite(chart.axisY.max, 100) - axisMin,
|
|
8450
|
+
start: TOP3 + chunkQL7MNEMT_cjs.finite(chart.config?.ringStartAngle, 0) * Math.PI / 180,
|
|
8451
|
+
total: Math.min(360, Math.max(1, chunkQL7MNEMT_cjs.finite(chart.config?.ringSweep, 360))) * Math.PI / 180,
|
|
8452
|
+
trackOpacity: Math.min(1, Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.ringTrackOpacity, TRACK_OPACITY))),
|
|
8224
8453
|
cap: chart.config?.ringCap ?? "round"
|
|
8225
8454
|
};
|
|
8226
8455
|
}
|
|
8227
8456
|
function ringEndShadows(context, layout, series, radius, sweep, color) {
|
|
8228
8457
|
const { chart, bounds, nextOrder } = context;
|
|
8229
8458
|
const { centerX, centerY, ringThickness, start } = layout;
|
|
8230
|
-
const shadow =
|
|
8459
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8231
8460
|
const isFullCircle = sweep >= Math.PI * 2 - FULL_SWEEP_EPSILON;
|
|
8232
8461
|
if (!shadow || isFullCircle) {
|
|
8233
8462
|
return [];
|
|
@@ -8265,8 +8494,8 @@ function ringNodes2(context, layout, series, index) {
|
|
|
8265
8494
|
if (radius <= ringThickness / 2) {
|
|
8266
8495
|
return [];
|
|
8267
8496
|
}
|
|
8268
|
-
const color =
|
|
8269
|
-
const value = Math.max(0,
|
|
8497
|
+
const color = chunkQL7MNEMT_cjs.paint(series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[index % chunkQL7MNEMT_cjs.CHART_COLORS.length], diagnostics, chart.id);
|
|
8498
|
+
const value = Math.max(0, chunkQL7MNEMT_cjs.finite(series.values[0], 0));
|
|
8270
8499
|
const fraction = range > 0 ? Math.min(1, Math.max(0, (value - axisMin) / range)) : 0;
|
|
8271
8500
|
const trackStyle = {
|
|
8272
8501
|
fill: { kind: "none" },
|
|
@@ -8304,7 +8533,7 @@ function ringNodes2(context, layout, series, index) {
|
|
|
8304
8533
|
bounds,
|
|
8305
8534
|
d: ringProgressPath(centerX, centerY, radius, sweep, start),
|
|
8306
8535
|
detail: { of: "chartValue", series: series.id, valueIndex: 0, mark: "radial-bar-ring" },
|
|
8307
|
-
prop:
|
|
8536
|
+
prop: chunkQL7MNEMT_cjs.seriesValueProp(series.id, 0),
|
|
8308
8537
|
style: { fill: { kind: "none" }, stroke: color, strokeWidth: ringThickness, lineCap: cap }
|
|
8309
8538
|
};
|
|
8310
8539
|
return [track, ...casters, progress];
|
|
@@ -8316,7 +8545,7 @@ function renderRadialBar(context) {
|
|
|
8316
8545
|
|
|
8317
8546
|
// src/renderScene/charts/renderers/sankey/links.ts
|
|
8318
8547
|
function renderSankeyLinks(context, data) {
|
|
8319
|
-
const shadow =
|
|
8548
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
8320
8549
|
const gradient = Boolean(context.chart.config?.linkGradient);
|
|
8321
8550
|
const { plot } = context;
|
|
8322
8551
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
@@ -8337,8 +8566,8 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
8337
8566
|
bottom: data.baseY + link.targetY1
|
|
8338
8567
|
};
|
|
8339
8568
|
const config = context.chart.config;
|
|
8340
|
-
const fromColor = link.color || data.nodeColors.get(link.source) ||
|
|
8341
|
-
const toColor = data.nodeColors.get(link.target) ||
|
|
8569
|
+
const fromColor = link.color || data.nodeColors.get(link.source) || chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL;
|
|
8570
|
+
const toColor = data.nodeColors.get(link.target) || chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL;
|
|
8342
8571
|
const fill2 = gradient ? {
|
|
8343
8572
|
kind: "linear-gradient",
|
|
8344
8573
|
angle: 0,
|
|
@@ -8353,9 +8582,9 @@ function createSankeyLinkRibbon(context, data, link, linkIndex, gradient) {
|
|
|
8353
8582
|
toId: link.target,
|
|
8354
8583
|
source,
|
|
8355
8584
|
target,
|
|
8356
|
-
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0,
|
|
8585
|
+
controlX: source.x + (target.x - source.x) * Math.min(1, Math.max(0, chunkQL7MNEMT_cjs.finite(config?.sankeyLinkCurve, 0.5))),
|
|
8357
8586
|
fill: fill2,
|
|
8358
|
-
opacity: Math.min(1, Math.max(0,
|
|
8587
|
+
opacity: Math.min(1, Math.max(0, chunkQL7MNEMT_cjs.finite(config?.sankeyLinkOpacity, link.color ? 0.85 : 0.45)))
|
|
8359
8588
|
};
|
|
8360
8589
|
}
|
|
8361
8590
|
function createSankeyRibbonNode(context, ribbon, shadow, clipPath, gradient) {
|
|
@@ -8396,7 +8625,7 @@ function sankeyRibbonPath(ribbon) {
|
|
|
8396
8625
|
var OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG = 0.3;
|
|
8397
8626
|
var OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG = 0.78;
|
|
8398
8627
|
function renderSankeyNodes(context, data) {
|
|
8399
|
-
const cornerRadius = Math.max(0,
|
|
8628
|
+
const cornerRadius = Math.max(0, chunkQL7MNEMT_cjs.finite(context.chart.config?.barCornerRadius, 0));
|
|
8400
8629
|
const nodes = [];
|
|
8401
8630
|
data.nodes.forEach((node) => {
|
|
8402
8631
|
nodes.push(createNodeRect(context, data, node, cornerRadius));
|
|
@@ -8412,8 +8641,8 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
8412
8641
|
const x = data.baseX + node.x;
|
|
8413
8642
|
const y = data.baseY + node.y;
|
|
8414
8643
|
const style = {
|
|
8415
|
-
fill: { kind: "solid", color: node.color ||
|
|
8416
|
-
shadow:
|
|
8644
|
+
fill: { kind: "solid", color: node.color || chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL },
|
|
8645
|
+
shadow: chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle)
|
|
8417
8646
|
};
|
|
8418
8647
|
const isFirstColumn = node.column === 0;
|
|
8419
8648
|
const isLastColumn = node.column === data.columnCount - 1;
|
|
@@ -8439,7 +8668,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
8439
8668
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
8440
8669
|
order: nextOrder(),
|
|
8441
8670
|
bounds,
|
|
8442
|
-
d:
|
|
8671
|
+
d: chunkQL7MNEMT_cjs.leftRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
8443
8672
|
style,
|
|
8444
8673
|
detail
|
|
8445
8674
|
};
|
|
@@ -8450,7 +8679,7 @@ function createNodeRect(context, data, node, cornerRadius) {
|
|
|
8450
8679
|
id: `chart-sankey-node-${chart.id}-${node.id}`,
|
|
8451
8680
|
order: nextOrder(),
|
|
8452
8681
|
bounds,
|
|
8453
|
-
d:
|
|
8682
|
+
d: chunkQL7MNEMT_cjs.rightRoundedRectPath(x, y, node.width, node.height, cornerRadius),
|
|
8454
8683
|
style,
|
|
8455
8684
|
detail
|
|
8456
8685
|
};
|
|
@@ -8476,9 +8705,9 @@ function createNodeLabel(context, data, node) {
|
|
|
8476
8705
|
return void 0;
|
|
8477
8706
|
}
|
|
8478
8707
|
const fallback = chart.textColor ?? "#0f172a";
|
|
8479
|
-
const defaultColor = position === "inside" ?
|
|
8708
|
+
const defaultColor = position === "inside" ? chunkQL7MNEMT_cjs.contrastTextColor(node.color) : chunkQL7MNEMT_cjs.sameHueTint(
|
|
8480
8709
|
node.color,
|
|
8481
|
-
|
|
8710
|
+
chunkQL7MNEMT_cjs.isLightColor(fallback) ? OUTSIDE_LABEL_LIGHTNESS_ON_DARK_BG : OUTSIDE_LABEL_LIGHTNESS_ON_LIGHT_BG
|
|
8482
8711
|
) ?? fallback;
|
|
8483
8712
|
const color = chart.config?.labelColor ?? defaultColor;
|
|
8484
8713
|
return { ...label, color, detail: { of: "chartSeries", series: node.id, mark: "sankey-node-label" } };
|
|
@@ -8490,7 +8719,7 @@ function createOutsideLabel(context, data, node) {
|
|
|
8490
8719
|
const y = data.baseY + node.y;
|
|
8491
8720
|
const labelX2 = isLastColumn ? x - data.labelGutter + 8 : x + node.width + 6;
|
|
8492
8721
|
return {
|
|
8493
|
-
...
|
|
8722
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
8494
8723
|
id: `chart-sankey-label-${chart.id}-${node.id}`,
|
|
8495
8724
|
order: nextOrder(),
|
|
8496
8725
|
bounds,
|
|
@@ -8515,11 +8744,11 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
8515
8744
|
if (orientation === "vertical") {
|
|
8516
8745
|
const thickness = fontSize * 1.4;
|
|
8517
8746
|
const width = Math.max(1, node.height - 8);
|
|
8518
|
-
if (
|
|
8747
|
+
if (chunkQL7MNEMT_cjs.estimateTextWidth(node.label, fontSize, false) > width) {
|
|
8519
8748
|
return void 0;
|
|
8520
8749
|
}
|
|
8521
8750
|
return {
|
|
8522
|
-
...
|
|
8751
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
8523
8752
|
id,
|
|
8524
8753
|
order: nextOrder(),
|
|
8525
8754
|
bounds,
|
|
@@ -8536,7 +8765,7 @@ function createInsideLabel(context, data, node, orientation) {
|
|
|
8536
8765
|
};
|
|
8537
8766
|
}
|
|
8538
8767
|
return {
|
|
8539
|
-
...
|
|
8768
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
8540
8769
|
id,
|
|
8541
8770
|
order: nextOrder(),
|
|
8542
8771
|
bounds,
|
|
@@ -8557,18 +8786,18 @@ function createSankeyRenderData(context) {
|
|
|
8557
8786
|
const labelGutter = showLabels ? 92 : 0;
|
|
8558
8787
|
const availableWidth = Math.max(1, plot.width - labelGutter * 2);
|
|
8559
8788
|
const layout = layoutSankey(createNodeInputs(context), createLinkInputs(context), availableWidth, plot.height, {
|
|
8560
|
-
nodeWidth: Math.max(1,
|
|
8561
|
-
nodeGap: Math.max(0,
|
|
8789
|
+
nodeWidth: Math.max(1, chunkQL7MNEMT_cjs.finite(chart.config?.sankeyNodeWidth, 18)),
|
|
8790
|
+
nodeGap: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.sankeyNodeGap, 8))
|
|
8562
8791
|
});
|
|
8563
8792
|
return {
|
|
8564
8793
|
...layout,
|
|
8565
8794
|
baseX: plot.x + labelGutter,
|
|
8566
8795
|
baseY: plot.y,
|
|
8567
8796
|
labelGutter,
|
|
8568
|
-
fontSize: Math.max(9,
|
|
8569
|
-
labelSize: Math.max(6,
|
|
8797
|
+
fontSize: Math.max(9, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12)),
|
|
8798
|
+
labelSize: Math.max(6, chunkQL7MNEMT_cjs.finite(chart.config?.sankeyLabelSize, Math.max(9, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12)) - 2)),
|
|
8570
8799
|
columnCount: Math.max(1, ...layout.nodes.map((node) => node.column + 1)),
|
|
8571
|
-
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color ||
|
|
8800
|
+
nodeColors: new Map(layout.nodes.map((node) => [node.id, node.color || chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL]))
|
|
8572
8801
|
};
|
|
8573
8802
|
}
|
|
8574
8803
|
function createNodeInputs(context) {
|
|
@@ -8590,7 +8819,7 @@ function createLinkInputs(context) {
|
|
|
8590
8819
|
source: series.source,
|
|
8591
8820
|
target: series.target,
|
|
8592
8821
|
value: series.values[0] ?? 0,
|
|
8593
|
-
color: series.color ?
|
|
8822
|
+
color: series.color ? chunkQL7MNEMT_cjs.representativeColor(series.color, chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL) : void 0
|
|
8594
8823
|
});
|
|
8595
8824
|
});
|
|
8596
8825
|
return inputs;
|
|
@@ -8609,9 +8838,9 @@ function renderSankey(context) {
|
|
|
8609
8838
|
var DEFAULT_POINT_SIZE = 4;
|
|
8610
8839
|
function renderScatter(context) {
|
|
8611
8840
|
const nodes = [];
|
|
8612
|
-
const shadow =
|
|
8841
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(context.chart.shadowStyle);
|
|
8613
8842
|
context.chart.series.forEach((series, seriesIndex) => {
|
|
8614
|
-
const color = series.color ??
|
|
8843
|
+
const color = series.color ?? chunkQL7MNEMT_cjs.CHART_COLORS[seriesIndex % chunkQL7MNEMT_cjs.CHART_COLORS.length];
|
|
8615
8844
|
const points = pixelPoints(context, seriesValuePairs(context.chart, series));
|
|
8616
8845
|
points.forEach((point, pointIndex) => {
|
|
8617
8846
|
nodes.push(createScatterPoint(context, series, point, pointIndex, color, shadow));
|
|
@@ -8635,8 +8864,8 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
8635
8864
|
ry: radius,
|
|
8636
8865
|
detail: { of: "chartValue", series: series.id, valueIndex: pointIndex },
|
|
8637
8866
|
style: {
|
|
8638
|
-
fill:
|
|
8639
|
-
stroke: strokeWidth > 0 ?
|
|
8867
|
+
fill: chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id),
|
|
8868
|
+
stroke: strokeWidth > 0 ? chunkQL7MNEMT_cjs.paint(config?.pointStrokeColor ?? color, diagnostics, chart.id) : void 0,
|
|
8640
8869
|
strokeWidth: strokeWidth > 0 ? strokeWidth : void 0,
|
|
8641
8870
|
opacity: config?.pointOpacity,
|
|
8642
8871
|
shadow
|
|
@@ -8647,14 +8876,14 @@ function createScatterPoint(context, series, point, pointIndex, color, shadow) {
|
|
|
8647
8876
|
// src/renderScene/charts/renderers/treemap/layout.ts
|
|
8648
8877
|
function createTreemapLayout(context) {
|
|
8649
8878
|
const { chart, plot, showLegend } = context;
|
|
8650
|
-
const fontSize = Math.max(9,
|
|
8879
|
+
const fontSize = Math.max(9, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12));
|
|
8651
8880
|
const legendPosition = chart.legendPosition === "left" ? "left" : chart.legendPosition === "right" ? "right" : "bottom";
|
|
8652
8881
|
const legendHeight = showLegend && legendPosition === "bottom" ? 48 : 0;
|
|
8653
|
-
const cellGap = Math.max(0,
|
|
8882
|
+
const cellGap = Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.cellGap, 0));
|
|
8654
8883
|
return {
|
|
8655
8884
|
leaves: chart.series,
|
|
8656
|
-
bands:
|
|
8657
|
-
zones: chart.config?.zones?.length ? chart.config.zones :
|
|
8885
|
+
bands: chunkQL7MNEMT_cjs.axisBands(chart.axisY),
|
|
8886
|
+
zones: chart.config?.zones?.length ? chart.config.zones : chunkQL7MNEMT_cjs.DEFAULT_HEATMAP_ZONES,
|
|
8658
8887
|
fontSize,
|
|
8659
8888
|
smallFontSize: Math.max(8, fontSize - 1),
|
|
8660
8889
|
legendPosition,
|
|
@@ -8662,23 +8891,23 @@ function createTreemapLayout(context) {
|
|
|
8662
8891
|
gridWidth: Math.max(1, plot.width),
|
|
8663
8892
|
gridHeight: Math.max(1, plot.height - legendHeight),
|
|
8664
8893
|
cellGap,
|
|
8665
|
-
cellRadius: Math.max(0,
|
|
8666
|
-
headerHeight: Math.max(0,
|
|
8667
|
-
labelSize: Math.max(6,
|
|
8668
|
-
valueSize: Math.max(6,
|
|
8669
|
-
labelPadding: Math.max(0,
|
|
8894
|
+
cellRadius: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.barCornerRadius, cellGap)),
|
|
8895
|
+
headerHeight: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.headerHeight, 20)),
|
|
8896
|
+
labelSize: Math.max(6, chunkQL7MNEMT_cjs.finite(chart.config?.tileLabelSize, Math.max(8, fontSize - 1))),
|
|
8897
|
+
valueSize: Math.max(6, chunkQL7MNEMT_cjs.finite(chart.config?.tileValueSize, Math.max(8, fontSize - 1))),
|
|
8898
|
+
labelPadding: Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.tileLabelPadding, 4))
|
|
8670
8899
|
};
|
|
8671
8900
|
}
|
|
8672
8901
|
function treemapLeafValue(leaf) {
|
|
8673
8902
|
return leaf.values[0] ?? 0;
|
|
8674
8903
|
}
|
|
8675
8904
|
function treemapLeafColor(leaf, layout) {
|
|
8676
|
-
return leaf.color ??
|
|
8905
|
+
return leaf.color ?? chunkQL7MNEMT_cjs.zoneColorAtValue(treemapLeafValue(leaf), layout.bands, layout.zones);
|
|
8677
8906
|
}
|
|
8678
8907
|
|
|
8679
8908
|
// src/renderScene/charts/renderers/treemap/legend.ts
|
|
8680
|
-
var
|
|
8681
|
-
var
|
|
8909
|
+
var BAR_THICKNESS2 = 10;
|
|
8910
|
+
var TICK_LENGTH3 = 4;
|
|
8682
8911
|
var ROW_GAP2 = 2;
|
|
8683
8912
|
var CHART_GAP = 16;
|
|
8684
8913
|
var LABEL_SIZE = 34;
|
|
@@ -8698,7 +8927,7 @@ function bandStops(layout) {
|
|
|
8698
8927
|
const zones = layout.zones.slice(0, bandCount);
|
|
8699
8928
|
return zones.map((zone, index) => ({
|
|
8700
8929
|
offset: bandRatio2(layout, layout.bands[index + 1] ?? layout.bands[layout.bands.length - 1]) * 100,
|
|
8701
|
-
color: zone.color ??
|
|
8930
|
+
color: zone.color ?? chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL
|
|
8702
8931
|
}));
|
|
8703
8932
|
}
|
|
8704
8933
|
function renderBottomLegend(context, layout) {
|
|
@@ -8707,7 +8936,7 @@ function renderBottomLegend(context, layout) {
|
|
|
8707
8936
|
const barWidth = layout.gridWidth;
|
|
8708
8937
|
const labelHeight = layout.fontSize + 2;
|
|
8709
8938
|
const barY = plot.y + layout.gridHeight + CHART_GAP;
|
|
8710
|
-
const barBounds =
|
|
8939
|
+
const barBounds = chunkQL7MNEMT_cjs.boxBounds({ x: barX, y: barY, width: barWidth, height: BAR_THICKNESS2 });
|
|
8711
8940
|
const stops = bandStops(layout);
|
|
8712
8941
|
const bar = {
|
|
8713
8942
|
type: "rect",
|
|
@@ -8717,11 +8946,11 @@ function renderBottomLegend(context, layout) {
|
|
|
8717
8946
|
x: barX,
|
|
8718
8947
|
y: barY,
|
|
8719
8948
|
width: barWidth,
|
|
8720
|
-
height:
|
|
8949
|
+
height: BAR_THICKNESS2,
|
|
8721
8950
|
rx: 3,
|
|
8722
8951
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
8723
8952
|
style: {
|
|
8724
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color:
|
|
8953
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 0, stops } : { kind: "solid", color: chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL },
|
|
8725
8954
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8726
8955
|
strokeWidth: 1
|
|
8727
8956
|
}
|
|
@@ -8733,7 +8962,7 @@ function renderBottomLegend(context, layout) {
|
|
|
8733
8962
|
id: `chart-treemap-legend-tick-${chart.id}-${index}`,
|
|
8734
8963
|
order: nextOrder(),
|
|
8735
8964
|
bounds,
|
|
8736
|
-
d: `M ${x} ${barY +
|
|
8965
|
+
d: `M ${x} ${barY + BAR_THICKNESS2} L ${x} ${barY + BAR_THICKNESS2 + TICK_LENGTH3}`,
|
|
8737
8966
|
style: {
|
|
8738
8967
|
fill: { kind: "none" },
|
|
8739
8968
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
@@ -8744,12 +8973,12 @@ function renderBottomLegend(context, layout) {
|
|
|
8744
8973
|
const isLast = index === layout.bands.length - 1;
|
|
8745
8974
|
const align = isFirst ? "left" : isLast ? "right" : "center";
|
|
8746
8975
|
const frameX = isFirst ? x : isLast ? x - LABEL_SIZE : x - LABEL_SIZE / 2;
|
|
8747
|
-
const label =
|
|
8976
|
+
const label = chunkQL7MNEMT_cjs.chartText({
|
|
8748
8977
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
8749
8978
|
order: nextOrder(),
|
|
8750
8979
|
bounds,
|
|
8751
|
-
frame: { x: frameX, y: barY +
|
|
8752
|
-
text:
|
|
8980
|
+
frame: { x: frameX, y: barY + BAR_THICKNESS2 + TICK_LENGTH3 + ROW_GAP2, width: LABEL_SIZE, height: labelHeight },
|
|
8981
|
+
text: chunkQL7MNEMT_cjs.formatFieldValue(value),
|
|
8753
8982
|
chart,
|
|
8754
8983
|
align
|
|
8755
8984
|
});
|
|
@@ -8762,8 +8991,8 @@ function renderSideLegend(context, layout) {
|
|
|
8762
8991
|
const side = layout.legendPosition;
|
|
8763
8992
|
const barTop = plot.y;
|
|
8764
8993
|
const barHeight = layout.gridHeight;
|
|
8765
|
-
const barX = side === "left" ? plot.x - CHART_GAP -
|
|
8766
|
-
const barBounds =
|
|
8994
|
+
const barX = side === "left" ? plot.x - CHART_GAP - BAR_THICKNESS2 : plot.x + layout.gridWidth + CHART_GAP;
|
|
8995
|
+
const barBounds = chunkQL7MNEMT_cjs.boxBounds({ x: barX, y: barTop, width: BAR_THICKNESS2, height: barHeight });
|
|
8767
8996
|
const stops = bandStops(layout);
|
|
8768
8997
|
const bar = {
|
|
8769
8998
|
type: "rect",
|
|
@@ -8772,18 +9001,18 @@ function renderSideLegend(context, layout) {
|
|
|
8772
9001
|
bounds: barBounds,
|
|
8773
9002
|
x: barX,
|
|
8774
9003
|
y: barTop,
|
|
8775
|
-
width:
|
|
9004
|
+
width: BAR_THICKNESS2,
|
|
8776
9005
|
height: barHeight,
|
|
8777
9006
|
rx: 3,
|
|
8778
9007
|
zoneGradient: { axis: "y", min: chart.axisY.min, max: chart.axisY.max },
|
|
8779
9008
|
style: {
|
|
8780
|
-
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color:
|
|
9009
|
+
fill: stops.length ? { kind: "linear-gradient", angle: 270, stops } : { kind: "solid", color: chunkQL7MNEMT_cjs.DEFAULT_ZONE_FILL },
|
|
8781
9010
|
stroke: { kind: "solid", color: chart.gridColor ?? "#e2e8f0" },
|
|
8782
9011
|
strokeWidth: 1
|
|
8783
9012
|
}
|
|
8784
9013
|
};
|
|
8785
|
-
const tickX = side === "left" ? barX : barX +
|
|
8786
|
-
const tickEndX = side === "left" ? tickX -
|
|
9014
|
+
const tickX = side === "left" ? barX : barX + BAR_THICKNESS2;
|
|
9015
|
+
const tickEndX = side === "left" ? tickX - TICK_LENGTH3 : tickX + TICK_LENGTH3;
|
|
8787
9016
|
const labelX2 = side === "left" ? tickEndX - ROW_GAP2 - LABEL_SIZE : tickEndX + ROW_GAP2;
|
|
8788
9017
|
const ticks2 = layout.bands.flatMap((value, index) => {
|
|
8789
9018
|
const y = barTop + (1 - bandRatio2(layout, value)) * barHeight;
|
|
@@ -8799,12 +9028,12 @@ function renderSideLegend(context, layout) {
|
|
|
8799
9028
|
strokeWidth: 1
|
|
8800
9029
|
}
|
|
8801
9030
|
};
|
|
8802
|
-
const label =
|
|
9031
|
+
const label = chunkQL7MNEMT_cjs.chartText({
|
|
8803
9032
|
id: `chart-treemap-legend-tick-label-${chart.id}-${index}`,
|
|
8804
9033
|
order: nextOrder(),
|
|
8805
9034
|
bounds,
|
|
8806
9035
|
frame: { x: labelX2, y: y - layout.fontSize / 2, width: LABEL_SIZE, height: layout.fontSize + 2 },
|
|
8807
|
-
text:
|
|
9036
|
+
text: chunkQL7MNEMT_cjs.formatFieldValue(value),
|
|
8808
9037
|
chart,
|
|
8809
9038
|
align: side === "left" ? "right" : "left"
|
|
8810
9039
|
});
|
|
@@ -8892,7 +9121,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
8892
9121
|
};
|
|
8893
9122
|
const smallFontSize = Math.max(8, Math.max(9, chart.fontSize ?? 12) - 1);
|
|
8894
9123
|
const label = {
|
|
8895
|
-
...
|
|
9124
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
8896
9125
|
id: `chart-treemap-header-label-${chart.id}-${index}`,
|
|
8897
9126
|
order: nextOrder(),
|
|
8898
9127
|
bounds,
|
|
@@ -8907,7 +9136,7 @@ function renderTreemapHeader(context, layout, header, index) {
|
|
|
8907
9136
|
align: "center"
|
|
8908
9137
|
}),
|
|
8909
9138
|
fontSize: smallFontSize,
|
|
8910
|
-
color:
|
|
9139
|
+
color: chunkQL7MNEMT_cjs.contrastTextColor(fill2)
|
|
8911
9140
|
};
|
|
8912
9141
|
return [background, label];
|
|
8913
9142
|
}
|
|
@@ -8923,7 +9152,7 @@ function renderTile(context, layout, tile, nextTile) {
|
|
|
8923
9152
|
function createTileNode(context, layout, tile, color, nextColor) {
|
|
8924
9153
|
const { chart, plot, bounds, diagnostics, nextOrder } = context;
|
|
8925
9154
|
const gap = layout.cellGap;
|
|
8926
|
-
const shadow =
|
|
9155
|
+
const shadow = chunkQL7MNEMT_cjs.resolveChartShadow(chart.shadowStyle);
|
|
8927
9156
|
const clipPath = shadow ? `M ${plot.x} ${plot.y} H ${plot.x + plot.width} V ${plot.y + plot.height} H ${plot.x} Z` : void 0;
|
|
8928
9157
|
const tileX = plot.x + tile.x + gap / 2;
|
|
8929
9158
|
const tileY = plot.y + tile.y + gap / 2;
|
|
@@ -8940,10 +9169,10 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
8940
9169
|
kind: "linear-gradient",
|
|
8941
9170
|
angle: 0,
|
|
8942
9171
|
stops: [
|
|
8943
|
-
{ offset: 0, color:
|
|
8944
|
-
{ offset: 100, color:
|
|
9172
|
+
{ offset: 0, color: chunkQL7MNEMT_cjs.representativeColor(color, fallback) },
|
|
9173
|
+
{ offset: 100, color: chunkQL7MNEMT_cjs.representativeColor(nextColor, fallback) }
|
|
8945
9174
|
]
|
|
8946
|
-
} :
|
|
9175
|
+
} : chunkQL7MNEMT_cjs.paint(color, diagnostics, chart.id);
|
|
8947
9176
|
return {
|
|
8948
9177
|
type: "rect",
|
|
8949
9178
|
id: `chart-treemap-tile-${chart.id}-${tile.item.leaf.id}`,
|
|
@@ -8957,7 +9186,7 @@ function createTileNode(context, layout, tile, color, nextColor) {
|
|
|
8957
9186
|
style: {
|
|
8958
9187
|
fill: fill2,
|
|
8959
9188
|
stroke: { kind: "solid", color: chart.config?.tileStrokeColor ?? chart.gridColor ?? "#e2e8f0" },
|
|
8960
|
-
strokeWidth:
|
|
9189
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.config?.tileStrokeWidth, chunkQL7MNEMT_cjs.finite(chart.gridWidth, 1)),
|
|
8961
9190
|
shadow,
|
|
8962
9191
|
clip: clipPath ? { type: "path", d: clipPath } : void 0
|
|
8963
9192
|
}
|
|
@@ -8972,12 +9201,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
8972
9201
|
const height = Math.max(1, tile.height - gap - pad * 1.5);
|
|
8973
9202
|
const x = plot.x + tile.x + gap / 2 + pad;
|
|
8974
9203
|
const y = plot.y + tile.y + gap / 2 + pad * 0.75;
|
|
8975
|
-
const textColor = chart.config?.tileTextColor ??
|
|
9204
|
+
const textColor = chart.config?.tileTextColor ?? chunkQL7MNEMT_cjs.contrastTextColor(chunkQL7MNEMT_cjs.representativeColor(color, "#ffffff"));
|
|
8976
9205
|
const lineHeight = layout.labelSize * 1.2;
|
|
8977
9206
|
const maxLines = Math.max(1, Math.floor(height / lineHeight));
|
|
8978
|
-
const labelLines =
|
|
9207
|
+
const labelLines = chunkQL7MNEMT_cjs.wrapText(leaf.label, width, layout.labelSize).slice(0, maxLines).map((line) => chunkQL7MNEMT_cjs.ellipsizeToWidth(line, width, layout.labelSize, true));
|
|
8979
9208
|
const label = {
|
|
8980
|
-
...
|
|
9209
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
8981
9210
|
id: `chart-treemap-label-${chart.id}-${leaf.id}`,
|
|
8982
9211
|
order: nextOrder(),
|
|
8983
9212
|
bounds,
|
|
@@ -8991,12 +9220,12 @@ function createTileLabel(context, layout, tile, color) {
|
|
|
8991
9220
|
color: textColor
|
|
8992
9221
|
};
|
|
8993
9222
|
const valueText = String(value);
|
|
8994
|
-
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 &&
|
|
9223
|
+
const valueFits = labelLines.length * lineHeight + layout.valueSize * 1.2 <= height + 2 && chunkQL7MNEMT_cjs.estimateTextWidth(valueText, layout.valueSize, false) <= width;
|
|
8995
9224
|
if (chart.config?.showTileValues === false || !valueFits) {
|
|
8996
9225
|
return [label];
|
|
8997
9226
|
}
|
|
8998
9227
|
const valueNode = {
|
|
8999
|
-
...
|
|
9228
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
9000
9229
|
id: `chart-treemap-value-${chart.id}-${leaf.id}`,
|
|
9001
9230
|
order: nextOrder(),
|
|
9002
9231
|
bounds,
|
|
@@ -9073,7 +9302,7 @@ function buildCartesianChart(foundation) {
|
|
|
9073
9302
|
|
|
9074
9303
|
// src/renderScene/charts/chartFrame.ts
|
|
9075
9304
|
function scaleDetail(chart, plot) {
|
|
9076
|
-
const horizontal =
|
|
9305
|
+
const horizontal = chunkQL7MNEMT_cjs.isHorizontalBar(chart);
|
|
9077
9306
|
const range = horizontal ? `${plot.x},${plot.width}` : `${plot.y},${plot.height}`;
|
|
9078
9307
|
return {
|
|
9079
9308
|
of: "chartScale",
|
|
@@ -9081,7 +9310,7 @@ function scaleDetail(chart, plot) {
|
|
|
9081
9310
|
};
|
|
9082
9311
|
}
|
|
9083
9312
|
function pieDetail(chart, plot) {
|
|
9084
|
-
const { outerRadius, innerRadius, cornerRadius } =
|
|
9313
|
+
const { outerRadius, innerRadius, cornerRadius } = chunkQL7MNEMT_cjs.resolvePieRadii(
|
|
9085
9314
|
plot.width,
|
|
9086
9315
|
plot.height,
|
|
9087
9316
|
chart.config?.innerRadius,
|
|
@@ -9094,8 +9323,8 @@ function pieDetail(chart, plot) {
|
|
|
9094
9323
|
}
|
|
9095
9324
|
function polarAreaDetail(chart, plot) {
|
|
9096
9325
|
const maxRadius = Math.max(1, Math.min(plot.width, plot.height) / 2 - 4);
|
|
9097
|
-
const innerRadius = Math.max(0, Math.min(
|
|
9098
|
-
const cornerRadius = Math.max(0,
|
|
9326
|
+
const innerRadius = Math.max(0, Math.min(chunkQL7MNEMT_cjs.finite(chart.config?.innerRadius, 0), maxRadius - 1));
|
|
9327
|
+
const cornerRadius = Math.max(0, chunkQL7MNEMT_cjs.finite(chart.config?.pieCornerRadius, 0));
|
|
9099
9328
|
return {
|
|
9100
9329
|
of: "pieGeometry",
|
|
9101
9330
|
pieGeometry: `${plot.x + plot.width / 2},${plot.y + plot.height / 2},${maxRadius},${innerRadius},${cornerRadius}`
|
|
@@ -9104,8 +9333,8 @@ function polarAreaDetail(chart, plot) {
|
|
|
9104
9333
|
function radarDetail(chart, plot) {
|
|
9105
9334
|
const configuredCount = (chart.config?.categories?.filter(Boolean) ?? []).length;
|
|
9106
9335
|
const dataCount = Math.max(0, ...chart.series.map((series) => series.values.length));
|
|
9107
|
-
const count =
|
|
9108
|
-
const radius =
|
|
9336
|
+
const count = chunkQL7MNEMT_cjs.radarCategoryCount(configuredCount, dataCount);
|
|
9337
|
+
const radius = chunkQL7MNEMT_cjs.radarRadius(plot.width, plot.height, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12), chart.showAxisLabels !== false);
|
|
9109
9338
|
const centerX = plot.x + plot.width / 2;
|
|
9110
9339
|
const centerY = plot.y + plot.height / 2;
|
|
9111
9340
|
const curved = chart.chartType === "radial" ? 1 : 0;
|
|
@@ -9139,9 +9368,9 @@ function buildChartFrame(chart, bounds, plot, order) {
|
|
|
9139
9368
|
height: chart.height,
|
|
9140
9369
|
rx: chart.cornerRadius ?? 12,
|
|
9141
9370
|
style: {
|
|
9142
|
-
fill:
|
|
9371
|
+
fill: chunkQL7MNEMT_cjs.paint(chart.fillColor ?? "#ffffff", [], chart.id),
|
|
9143
9372
|
stroke: { kind: "solid", color: chart.strokeColor ?? "#475569" },
|
|
9144
|
-
strokeWidth:
|
|
9373
|
+
strokeWidth: chunkQL7MNEMT_cjs.finite(chart.strokeWidth, 1)
|
|
9145
9374
|
}
|
|
9146
9375
|
};
|
|
9147
9376
|
const detail = frameDetail(chart, plot);
|
|
@@ -9201,18 +9430,19 @@ function buildChartTitle(chart, bounds, plot, renderOrder) {
|
|
|
9201
9430
|
}
|
|
9202
9431
|
return [
|
|
9203
9432
|
{
|
|
9204
|
-
...
|
|
9433
|
+
...chunkQL7MNEMT_cjs.chartText({
|
|
9205
9434
|
id: `chart-title-${chart.id}`,
|
|
9206
9435
|
order: renderOrder.next(),
|
|
9207
9436
|
bounds,
|
|
9208
9437
|
frame: { x: plot.x, y: chart.y + 12, width: plot.width, height: 20 },
|
|
9209
9438
|
text: chart.title,
|
|
9210
|
-
chart
|
|
9439
|
+
chart,
|
|
9440
|
+
align: chart.titleAlign ?? "left"
|
|
9211
9441
|
}),
|
|
9212
9442
|
...chart.titleColor ? { color: chart.titleColor } : {},
|
|
9213
9443
|
fontWeight: chart.titleWeight ?? "bold",
|
|
9214
|
-
fontSize:
|
|
9215
|
-
prop:
|
|
9444
|
+
fontSize: chunkQL7MNEMT_cjs.finite(chart.titleSize, Math.max(10, chunkQL7MNEMT_cjs.finite(chart.fontSize, 12)) + 2),
|
|
9445
|
+
prop: chunkQL7MNEMT_cjs.CHART_TITLE_PROP
|
|
9216
9446
|
}
|
|
9217
9447
|
];
|
|
9218
9448
|
}
|
|
@@ -9265,14 +9495,94 @@ function buildChart(chart, index, diagnostics) {
|
|
|
9265
9495
|
// src/renderScene/charts/artifacts.ts
|
|
9266
9496
|
function buildCharts(charts, diagnostics) {
|
|
9267
9497
|
return charts.flatMap(
|
|
9268
|
-
(chart, index) =>
|
|
9498
|
+
(chart, index) => chunkQL7MNEMT_cjs.tag(buildChart(chart, index, diagnostics), "chart", chart.id, chart.chartType, chart.title ?? "Chart")
|
|
9269
9499
|
);
|
|
9270
9500
|
}
|
|
9271
9501
|
|
|
9502
|
+
// src/renderScene/scene/frameClip.ts
|
|
9503
|
+
var ARC_STEPS = 8;
|
|
9504
|
+
function turnOf(node) {
|
|
9505
|
+
const turned = node;
|
|
9506
|
+
if (!turned.rotation) {
|
|
9507
|
+
return void 0;
|
|
9508
|
+
}
|
|
9509
|
+
if (turned.rotationCenter) {
|
|
9510
|
+
return { angle: turned.rotation, x: turned.rotationCenter.x, y: turned.rotationCenter.y };
|
|
9511
|
+
}
|
|
9512
|
+
if (turned.cx !== void 0 && turned.cy !== void 0) {
|
|
9513
|
+
return { angle: turned.rotation, x: turned.cx, y: turned.cy };
|
|
9514
|
+
}
|
|
9515
|
+
if (turned.x !== void 0 && turned.y !== void 0 && turned.width !== void 0 && turned.height !== void 0) {
|
|
9516
|
+
return { angle: turned.rotation, x: turned.x + turned.width / 2, y: turned.y + turned.height / 2 };
|
|
9517
|
+
}
|
|
9518
|
+
return void 0;
|
|
9519
|
+
}
|
|
9520
|
+
function roundedRectPoints(frame) {
|
|
9521
|
+
const { x, y, width, height } = frame;
|
|
9522
|
+
const r = Math.max(0, Math.min(frame.cornerRadius, width / 2, height / 2));
|
|
9523
|
+
if (r === 0) {
|
|
9524
|
+
return [
|
|
9525
|
+
[x, y],
|
|
9526
|
+
[x + width, y],
|
|
9527
|
+
[x + width, y + height],
|
|
9528
|
+
[x, y + height]
|
|
9529
|
+
];
|
|
9530
|
+
}
|
|
9531
|
+
const corners = [
|
|
9532
|
+
[x + width - r, y + r, -90],
|
|
9533
|
+
[x + width - r, y + height - r, 0],
|
|
9534
|
+
[x + r, y + height - r, 90],
|
|
9535
|
+
[x + r, y + r, 180]
|
|
9536
|
+
];
|
|
9537
|
+
return corners.flatMap(
|
|
9538
|
+
([cx, cy, start]) => Array.from({ length: ARC_STEPS + 1 }, (_, step) => {
|
|
9539
|
+
const angle = (start + 90 * step / ARC_STEPS) * Math.PI / 180;
|
|
9540
|
+
return [cx + r * Math.cos(angle), cy + r * Math.sin(angle)];
|
|
9541
|
+
})
|
|
9542
|
+
);
|
|
9543
|
+
}
|
|
9544
|
+
function clipFor(frame, turn) {
|
|
9545
|
+
if (!turn) {
|
|
9546
|
+
return { type: "rect", x: frame.x, y: frame.y, width: frame.width, height: frame.height, rx: frame.cornerRadius };
|
|
9547
|
+
}
|
|
9548
|
+
const back = -turn.angle * Math.PI / 180;
|
|
9549
|
+
const cos = Math.cos(back);
|
|
9550
|
+
const sin = Math.sin(back);
|
|
9551
|
+
const points = roundedRectPoints(frame).map(([px, py]) => {
|
|
9552
|
+
const dx = px - turn.x;
|
|
9553
|
+
const dy = py - turn.y;
|
|
9554
|
+
return [turn.x + dx * cos - dy * sin, turn.y + dx * sin + dy * cos];
|
|
9555
|
+
});
|
|
9556
|
+
const round2 = (value) => Math.round(value * 100) / 100;
|
|
9557
|
+
return { type: "path", d: `M${points.map(([px, py]) => `${round2(px)} ${round2(py)}`).join("L")}Z` };
|
|
9558
|
+
}
|
|
9559
|
+
function applyFrameClips(nodes, frames) {
|
|
9560
|
+
const clipping = new Map(frames.filter((frame) => frame.clip).map((frame) => [frame.id, frame]));
|
|
9561
|
+
if (clipping.size === 0) {
|
|
9562
|
+
return;
|
|
9563
|
+
}
|
|
9564
|
+
const inside = /* @__PURE__ */ new Map();
|
|
9565
|
+
for (const node of nodes) {
|
|
9566
|
+
const parent = node.identity?.parentFrameId;
|
|
9567
|
+
const frame = parent ? clipping.get(parent) : void 0;
|
|
9568
|
+
if (node.identity && frame) {
|
|
9569
|
+
inside.set(`${node.identity.role}:${node.identity.id}`, frame);
|
|
9570
|
+
}
|
|
9571
|
+
}
|
|
9572
|
+
for (const node of nodes) {
|
|
9573
|
+
const frame = node.identity ? inside.get(`${node.identity.role}:${node.identity.id}`) : void 0;
|
|
9574
|
+
const styled = node;
|
|
9575
|
+
if (frame && styled.style) {
|
|
9576
|
+
const edge = clipFor(frame, turnOf(node));
|
|
9577
|
+
styled.style = { ...styled.style, clip: styled.style.clip ? { ...styled.style.clip, within: edge } : edge };
|
|
9578
|
+
}
|
|
9579
|
+
}
|
|
9580
|
+
}
|
|
9581
|
+
|
|
9272
9582
|
// src/renderScene/scene/build.ts
|
|
9273
9583
|
function sceneBounds(nodes) {
|
|
9274
9584
|
if (!nodes.length) {
|
|
9275
|
-
return
|
|
9585
|
+
return chunkQL7MNEMT_cjs.EMPTY_BOUNDS;
|
|
9276
9586
|
}
|
|
9277
9587
|
return {
|
|
9278
9588
|
minX: Math.min(...nodes.map((n) => n.bounds.minX)),
|
|
@@ -9286,8 +9596,8 @@ function stackingOf(input) {
|
|
|
9286
9596
|
const add = (role, objects, legacyBase) => {
|
|
9287
9597
|
objects.forEach((object, index) => {
|
|
9288
9598
|
stacking.set(`${role}:${object.id}`, {
|
|
9289
|
-
rank:
|
|
9290
|
-
sequence:
|
|
9599
|
+
rank: chunkQL7MNEMT_cjs.stackRank(object),
|
|
9600
|
+
sequence: chunkQL7MNEMT_cjs.stackSequence(object, legacyBase + index)
|
|
9291
9601
|
});
|
|
9292
9602
|
});
|
|
9293
9603
|
};
|
|
@@ -9327,6 +9637,7 @@ function buildRenderScene(input, options = {}) {
|
|
|
9327
9637
|
...buildIsometricObjects(input.isometricObjects ?? []),
|
|
9328
9638
|
...buildDimensions(input.dimensions ?? [])
|
|
9329
9639
|
];
|
|
9640
|
+
applyFrameClips(nodes, input.frames);
|
|
9330
9641
|
stampStacking(nodes, input);
|
|
9331
9642
|
nodes.sort(
|
|
9332
9643
|
(a, b) => (a.rank ?? 0) - (b.rank ?? 0) || (a.sequence ?? 0) - (b.sequence ?? 0) || a.order - b.order || (a.id < b.id ? -1 : a.id > b.id ? 1 : 0)
|
|
@@ -9349,17 +9660,17 @@ var SvgClipDefinitions = class {
|
|
|
9349
9660
|
prefix;
|
|
9350
9661
|
ids = /* @__PURE__ */ new Map();
|
|
9351
9662
|
clip(style) {
|
|
9352
|
-
|
|
9353
|
-
|
|
9354
|
-
|
|
9355
|
-
const key = JSON.stringify(
|
|
9663
|
+
return style.clip ? this.define(style.clip) : void 0;
|
|
9664
|
+
}
|
|
9665
|
+
define(clip) {
|
|
9666
|
+
const key = JSON.stringify(clip);
|
|
9356
9667
|
let id = this.ids.get(key);
|
|
9357
9668
|
if (!id) {
|
|
9669
|
+
const outer = clip.within ? this.define(clip.within) : void 0;
|
|
9358
9670
|
id = safeId(`${this.prefix}clip-${this.ids.size}`);
|
|
9359
9671
|
this.ids.set(key, id);
|
|
9360
|
-
const clip = style.clip;
|
|
9361
9672
|
const shape = clip.type === "path" ? `<path clip-rule="evenodd" d="${xml(clip.d)}"/>` : `<rect x="${num(clip.x)}" y="${num(clip.y)}" width="${num(clip.width)}" height="${num(clip.height)}" rx="${num(clip.rx)}"/>`;
|
|
9362
|
-
this.addDefinition(`<clipPath id="${id}">${shape}</clipPath>`);
|
|
9673
|
+
this.addDefinition(`<clipPath id="${id}"${outer ? ` clip-path="url(#${outer})"` : ""}>${shape}</clipPath>`);
|
|
9363
9674
|
}
|
|
9364
9675
|
return id;
|
|
9365
9676
|
}
|
|
@@ -9388,7 +9699,8 @@ var SvgFilterDefinitions = class {
|
|
|
9388
9699
|
);
|
|
9389
9700
|
}
|
|
9390
9701
|
if (style.blur || style.saturate !== void 0) {
|
|
9391
|
-
|
|
9702
|
+
const margin = size && size > 0 && style.blur ? Math.max(0.5, style.blur * 1.5 / size) : 0.5;
|
|
9703
|
+
return this.define(nodeId, { blur: style.blur ?? 0, saturate: style.saturate ?? 1 }, blurPrimitives, margin);
|
|
9392
9704
|
}
|
|
9393
9705
|
return void 0;
|
|
9394
9706
|
}
|
|
@@ -9635,12 +9947,19 @@ function addStrokeAttrs(attrs, style) {
|
|
|
9635
9947
|
if (style.pointerEvents) {
|
|
9636
9948
|
attrs.push(`pointer-events="${style.pointerEvents}"`);
|
|
9637
9949
|
}
|
|
9950
|
+
const css = [];
|
|
9638
9951
|
if (style.transition && style.transition > 0) {
|
|
9639
9952
|
const time = `${num(style.transition)}ms ease`;
|
|
9640
|
-
|
|
9641
|
-
`
|
|
9953
|
+
css.push(
|
|
9954
|
+
`transition: x ${time}, y ${time}, width ${time}, height ${time}, cx ${time}, cy ${time}, rx ${time}, ry ${time}, fill ${time}, stroke ${time}, stroke-width ${time}, stroke-dasharray ${time}, opacity ${time}`
|
|
9642
9955
|
);
|
|
9643
9956
|
}
|
|
9957
|
+
if (style.blend) {
|
|
9958
|
+
css.push(`mix-blend-mode: ${xml(style.blend)}`);
|
|
9959
|
+
}
|
|
9960
|
+
if (css.length > 0) {
|
|
9961
|
+
attrs.push(`style="${css.join("; ")}"`);
|
|
9962
|
+
}
|
|
9644
9963
|
}
|
|
9645
9964
|
function elementSize(node) {
|
|
9646
9965
|
const shape = node;
|
|
@@ -9771,31 +10090,31 @@ function chartSeriesAttrs(detail) {
|
|
|
9771
10090
|
];
|
|
9772
10091
|
}
|
|
9773
10092
|
function frameBoundaryAttrs(detail) {
|
|
9774
|
-
return [`${
|
|
10093
|
+
return [`${chunkQL7MNEMT_cjs.CORNER_RADIUS_ATTR}="${num(detail.cornerRadius)}"`, `${chunkQL7MNEMT_cjs.SQUARE_CORNER_ATTR}="${detail.squareCorner}"`];
|
|
9775
10094
|
}
|
|
9776
10095
|
function declaredBoundsAttr(bounds) {
|
|
9777
|
-
return `${
|
|
10096
|
+
return `${chunkQL7MNEMT_cjs.SYMBOL_BOUNDS_ATTR}="${num(bounds.x)},${num(bounds.y)},${num(bounds.width)},${num(bounds.height)}"`;
|
|
9778
10097
|
}
|
|
9779
10098
|
function symbolGeometryAttrs(detail) {
|
|
9780
10099
|
return [
|
|
9781
|
-
`${
|
|
9782
|
-
`${
|
|
10100
|
+
`${chunkQL7MNEMT_cjs.SYMBOL_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
10101
|
+
`${chunkQL7MNEMT_cjs.SYMBOL_TENSION_ATTR}="${num(detail.tension)}"`,
|
|
9783
10102
|
declaredBoundsAttr(detail.declaredBounds)
|
|
9784
10103
|
];
|
|
9785
10104
|
}
|
|
9786
10105
|
function pathGeometryAttrs(detail) {
|
|
9787
10106
|
return [
|
|
9788
|
-
`${
|
|
9789
|
-
`${
|
|
9790
|
-
`${
|
|
10107
|
+
`${chunkQL7MNEMT_cjs.PATH_POINTS_ATTR}="${xml(JSON.stringify(detail.points))}"`,
|
|
10108
|
+
`${chunkQL7MNEMT_cjs.PATH_TENSION_ATTR}="${num(detail.tension)}"`,
|
|
10109
|
+
`${chunkQL7MNEMT_cjs.PATH_CLOSED_ATTR}="${detail.closed}"`
|
|
9791
10110
|
];
|
|
9792
10111
|
}
|
|
9793
10112
|
function isometricGeometryAttrs(detail) {
|
|
9794
10113
|
return [
|
|
9795
|
-
`${
|
|
9796
|
-
`${
|
|
10114
|
+
`${chunkQL7MNEMT_cjs.ISOMETRIC_SIZE_ATTR}="${num(detail.width)},${num(detail.height)},${num(detail.depth)}"`,
|
|
10115
|
+
`${chunkQL7MNEMT_cjs.CORNER_RADIUS_ATTR}="${num(detail.cornerRadius)}"`,
|
|
9797
10116
|
declaredBoundsAttr(detail.bounds),
|
|
9798
|
-
`${
|
|
10117
|
+
`${chunkQL7MNEMT_cjs.ISOMETRIC_LABEL_OFFSET_ATTR}="${num(detail.labelOffsetX)},${num(detail.labelOffsetY)}"`
|
|
9799
10118
|
];
|
|
9800
10119
|
}
|
|
9801
10120
|
function linkDetailAttrs(detail) {
|
|
@@ -9942,7 +10261,7 @@ function renderSvgDocument(scene, options = {}) {
|
|
|
9942
10261
|
const nodes = options.linkHitAreas ? withLinkHitAreas(scene.nodes) : scene.nodes;
|
|
9943
10262
|
const body = nodes.map((node) => nodeSvg(node, defs)).join("\n ");
|
|
9944
10263
|
const declaration = options.includeXmlDeclaration === false ? "" : '<?xml version="1.0" encoding="UTF-8"?>\n';
|
|
9945
|
-
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${num(width)}px" height="${num(height)}px" viewBox="${viewBox}" role="img" data-sf-contract="${
|
|
10264
|
+
const svg = `${declaration}<svg xmlns="http://www.w3.org/2000/svg" width="${num(width)}px" height="${num(height)}px" viewBox="${viewBox}" role="img" data-sf-contract="${chunkQL7MNEMT_cjs.DOM_CONTRACT_VERSION}">
|
|
9946
10265
|
<defs>${defs.entries.join("")}</defs>
|
|
9947
10266
|
${body}
|
|
9948
10267
|
</svg>`;
|
|
@@ -9962,9 +10281,9 @@ function renderCanvas(input, options = {}) {
|
|
|
9962
10281
|
}
|
|
9963
10282
|
var SCENE_CACHE_LIMIT = 50;
|
|
9964
10283
|
var sceneCache = /* @__PURE__ */ new Map();
|
|
9965
|
-
var cachedForRegistry =
|
|
10284
|
+
var cachedForRegistry = chunkQL7MNEMT_cjs.componentRegistryVersion();
|
|
9966
10285
|
function cachedRenderScene(source) {
|
|
9967
|
-
const registry =
|
|
10286
|
+
const registry = chunkQL7MNEMT_cjs.componentRegistryVersion();
|
|
9968
10287
|
if (registry !== cachedForRegistry) {
|
|
9969
10288
|
sceneCache.clear();
|
|
9970
10289
|
cachedForRegistry = registry;
|
|
@@ -9996,7 +10315,7 @@ function render(source, options = {}) {
|
|
|
9996
10315
|
var SCENE_ORDER_BASE = 1e4;
|
|
9997
10316
|
function defineComponent(definition) {
|
|
9998
10317
|
const { scene, ...descriptor } = definition;
|
|
9999
|
-
const unregisterDescriptor =
|
|
10318
|
+
const unregisterDescriptor = chunkQL7MNEMT_cjs.registerComponentDescriptor(descriptor);
|
|
10000
10319
|
const unregisterBuilder = registerComponentBuilder(
|
|
10001
10320
|
descriptor.type,
|
|
10002
10321
|
(component, index) => scene(component, { order: SCENE_ORDER_BASE + index })
|
|
@@ -10015,5 +10334,5 @@ exports.render = render;
|
|
|
10015
10334
|
exports.renderCanvas = renderCanvas;
|
|
10016
10335
|
exports.sflToRenderInput = sflToRenderInput;
|
|
10017
10336
|
exports.sliderReach = sliderReach;
|
|
10018
|
-
//# sourceMappingURL=chunk-
|
|
10019
|
-
//# sourceMappingURL=chunk-
|
|
10337
|
+
//# sourceMappingURL=chunk-YSXD5IVZ.cjs.map
|
|
10338
|
+
//# sourceMappingURL=chunk-YSXD5IVZ.cjs.map
|