pptx-react-viewer 4.10.0 → 4.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/dist/{AiChatPanel-SIEMT43N.mjs → AiChatPanel-3IKRPPUX.mjs} +3 -3
- package/dist/AiChatPanel-3IKRPPUX.mjs.br +0 -0
- package/dist/AiChatPanel-3IKRPPUX.mjs.gz +0 -0
- package/dist/{AiChatPanel-RBQFM6JK.js → AiChatPanel-537JJCV4.js} +27 -27
- package/dist/AiChatPanel-537JJCV4.js.br +0 -0
- package/dist/AiChatPanel-537JJCV4.js.gz +0 -0
- package/dist/{Model3DScene-ITAVIIVY.js → Model3DScene-3XT5SBU4.js} +2 -2
- package/dist/Model3DScene-3XT5SBU4.js.br +0 -0
- package/dist/Model3DScene-3XT5SBU4.js.gz +0 -0
- package/dist/{Model3DScene-HZ7SOUFQ.mjs → Model3DScene-WBJV27OR.mjs} +1 -1
- package/dist/Model3DScene-WBJV27OR.mjs.br +0 -0
- package/dist/Model3DScene-WBJV27OR.mjs.gz +0 -0
- package/dist/{chunk-WM33FDLD.mjs → chunk-4MI3PMQT.mjs} +1 -1
- package/dist/chunk-4MI3PMQT.mjs.br +0 -0
- package/dist/chunk-4MI3PMQT.mjs.gz +0 -0
- package/dist/{chunk-LMJU46E5.mjs → chunk-BR4GXQSN.mjs} +1 -1
- package/dist/chunk-BR4GXQSN.mjs.br +0 -0
- package/dist/chunk-BR4GXQSN.mjs.gz +0 -0
- package/dist/{chunk-A5A6B2PA.mjs → chunk-G353KKQX.mjs} +3 -3
- package/dist/chunk-G353KKQX.mjs.br +0 -0
- package/dist/{chunk-A5A6B2PA.mjs.gz → chunk-G353KKQX.mjs.gz} +0 -0
- package/dist/{chunk-ZI57KREY.js → chunk-GLFTASJH.js} +806 -806
- package/dist/chunk-GLFTASJH.js.br +0 -0
- package/dist/chunk-GLFTASJH.js.gz +0 -0
- package/dist/{chunk-PPDIZ3XP.js → chunk-LVWMKZPS.js} +5 -5
- package/dist/chunk-LVWMKZPS.js.br +0 -0
- package/dist/chunk-LVWMKZPS.js.gz +0 -0
- package/dist/{chunk-ZEQVK2FT.js → chunk-NCUM2X4H.js} +1182 -1183
- package/dist/chunk-NCUM2X4H.js.br +0 -0
- package/dist/chunk-NCUM2X4H.js.gz +0 -0
- package/dist/{chunk-3UZYGG6W.mjs → chunk-SDEBL4LY.mjs} +9 -10
- package/dist/chunk-SDEBL4LY.mjs.br +0 -0
- package/dist/chunk-SDEBL4LY.mjs.gz +0 -0
- package/dist/{chunk-E5565MDK.js → chunk-TLKFCZWS.js} +228 -2882
- package/dist/chunk-TLKFCZWS.js.br +0 -0
- package/dist/chunk-TLKFCZWS.js.gz +0 -0
- package/dist/{chunk-NTMJSTXL.js → chunk-XGDCECDK.js} +187 -187
- package/dist/chunk-XGDCECDK.js.br +0 -0
- package/dist/chunk-XGDCECDK.js.gz +0 -0
- package/dist/{chunk-ZBFDEYLQ.mjs → chunk-ZVBB3CC5.mjs} +228 -2882
- package/dist/chunk-ZVBB3CC5.mjs.br +0 -0
- package/dist/chunk-ZVBB3CC5.mjs.gz +0 -0
- package/dist/index.js +61 -61
- package/dist/index.js.br +0 -0
- package/dist/index.js.gz +0 -0
- package/dist/index.mjs +5 -5
- package/dist/index.mjs.br +0 -0
- package/dist/index.mjs.gz +0 -0
- package/dist/internals.js +104 -104
- package/dist/internals.js.br +0 -0
- package/dist/internals.js.gz +0 -0
- package/dist/internals.mjs +3 -3
- package/dist/internals.mjs.br +0 -0
- package/dist/internals.mjs.gz +0 -0
- package/dist/viewer/index.js +26 -26
- package/dist/viewer/index.js.br +0 -0
- package/dist/viewer/index.js.gz +0 -0
- package/dist/viewer/index.mjs +5 -5
- package/dist/viewer/index.mjs.br +0 -0
- package/dist/viewer/index.mjs.gz +0 -0
- package/package.json +1 -1
- package/dist/AiChatPanel-RBQFM6JK.js.br +0 -0
- package/dist/AiChatPanel-RBQFM6JK.js.gz +0 -0
- package/dist/AiChatPanel-SIEMT43N.mjs.br +0 -0
- package/dist/AiChatPanel-SIEMT43N.mjs.gz +0 -0
- package/dist/Model3DScene-HZ7SOUFQ.mjs.br +0 -0
- package/dist/Model3DScene-HZ7SOUFQ.mjs.gz +0 -0
- package/dist/Model3DScene-ITAVIIVY.js.br +0 -0
- package/dist/Model3DScene-ITAVIIVY.js.gz +0 -0
- package/dist/chunk-3UZYGG6W.mjs.br +0 -0
- package/dist/chunk-3UZYGG6W.mjs.gz +0 -0
- package/dist/chunk-A5A6B2PA.mjs.br +0 -0
- package/dist/chunk-E5565MDK.js.br +0 -0
- package/dist/chunk-E5565MDK.js.gz +0 -0
- package/dist/chunk-LMJU46E5.mjs.br +0 -0
- package/dist/chunk-LMJU46E5.mjs.gz +0 -0
- package/dist/chunk-NTMJSTXL.js.br +0 -0
- package/dist/chunk-NTMJSTXL.js.gz +0 -0
- package/dist/chunk-PPDIZ3XP.js.br +0 -0
- package/dist/chunk-PPDIZ3XP.js.gz +0 -0
- package/dist/chunk-WM33FDLD.mjs.br +0 -0
- package/dist/chunk-WM33FDLD.mjs.gz +0 -0
- package/dist/chunk-ZBFDEYLQ.mjs.br +0 -0
- package/dist/chunk-ZBFDEYLQ.mjs.gz +0 -0
- package/dist/chunk-ZEQVK2FT.js.br +0 -0
- package/dist/chunk-ZEQVK2FT.js.gz +0 -0
- package/dist/chunk-ZI57KREY.js.br +0 -0
- package/dist/chunk-ZI57KREY.js.gz +0 -0
|
@@ -27265,6 +27265,19 @@ var init_element_xml_builders = __esm({
|
|
|
27265
27265
|
init_stroke_utils();
|
|
27266
27266
|
}
|
|
27267
27267
|
});
|
|
27268
|
+
function srgb255ToLinear(channel) {
|
|
27269
|
+
const c = clampUnitInterval(channel / 255);
|
|
27270
|
+
return c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
|
|
27271
|
+
}
|
|
27272
|
+
function linearToSrgb255(linear) {
|
|
27273
|
+
const c = clampUnitInterval(linear);
|
|
27274
|
+
return 255 * (c <= 31308e-7 ? c * 12.92 : 1.055 * c ** (1 / 2.4) - 0.055);
|
|
27275
|
+
}
|
|
27276
|
+
var init_color_linear = __esm({
|
|
27277
|
+
"src/core/color/color-linear.ts"() {
|
|
27278
|
+
init_color_primitives();
|
|
27279
|
+
}
|
|
27280
|
+
});
|
|
27268
27281
|
function applyDrawingColorTransforms(baseColor, colorNode) {
|
|
27269
27282
|
const rgb2 = hexToRgbChannels(baseColor);
|
|
27270
27283
|
if (!rgb2) {
|
|
@@ -27307,15 +27320,15 @@ function applyDrawingColorTransforms(baseColor, colorNode) {
|
|
|
27307
27320
|
}
|
|
27308
27321
|
const shade3 = parseDrawingPercent(getVal("a:shade"));
|
|
27309
27322
|
if (shade3 !== void 0) {
|
|
27310
|
-
r
|
|
27311
|
-
g2
|
|
27312
|
-
b
|
|
27323
|
+
r = linearToSrgb255(srgb255ToLinear(r) * shade3);
|
|
27324
|
+
g2 = linearToSrgb255(srgb255ToLinear(g2) * shade3);
|
|
27325
|
+
b = linearToSrgb255(srgb255ToLinear(b) * shade3);
|
|
27313
27326
|
}
|
|
27314
27327
|
const tint3 = parseDrawingPercent(getVal("a:tint"));
|
|
27315
27328
|
if (tint3 !== void 0) {
|
|
27316
|
-
r =
|
|
27317
|
-
g2 =
|
|
27318
|
-
b =
|
|
27329
|
+
r = linearToSrgb255(1 - (1 - srgb255ToLinear(r)) * tint3);
|
|
27330
|
+
g2 = linearToSrgb255(1 - (1 - srgb255ToLinear(g2)) * tint3);
|
|
27331
|
+
b = linearToSrgb255(1 - (1 - srgb255ToLinear(b)) * tint3);
|
|
27319
27332
|
}
|
|
27320
27333
|
const hslKeys = [
|
|
27321
27334
|
"a:hue",
|
|
@@ -27428,6 +27441,7 @@ function applySrgbGammaDecode(r, g2, b) {
|
|
|
27428
27441
|
}
|
|
27429
27442
|
var init_color_transforms = __esm({
|
|
27430
27443
|
"src/core/color/color-transforms.ts"() {
|
|
27444
|
+
init_color_linear();
|
|
27431
27445
|
init_color_primitives();
|
|
27432
27446
|
}
|
|
27433
27447
|
});
|
|
@@ -169320,8 +169334,8 @@ function hexToRgb2(hex22) {
|
|
|
169320
169334
|
];
|
|
169321
169335
|
}
|
|
169322
169336
|
function rgbToHex(r, g2, b) {
|
|
169323
|
-
const
|
|
169324
|
-
return `#${
|
|
169337
|
+
const clamp12 = (v) => Math.max(0, Math.min(255, Math.round(v)));
|
|
169338
|
+
return `#${clamp12(r).toString(16).padStart(2, "0")}${clamp12(g2).toString(16).padStart(2, "0")}${clamp12(b).toString(16).padStart(2, "0")}`;
|
|
169325
169339
|
}
|
|
169326
169340
|
function tint(hex22, amount) {
|
|
169327
169341
|
const [r, g2, b] = hexToRgb2(hex22);
|
|
@@ -169821,8 +169835,8 @@ function hexToRgb3(hex22) {
|
|
|
169821
169835
|
];
|
|
169822
169836
|
}
|
|
169823
169837
|
function rgbToHex2(r, g2, b) {
|
|
169824
|
-
const
|
|
169825
|
-
return `#${
|
|
169838
|
+
const clamp12 = (v) => Math.max(0, Math.min(255, Math.round(v)));
|
|
169839
|
+
return `#${clamp12(r).toString(16).padStart(2, "0")}${clamp12(g2).toString(16).padStart(2, "0")}${clamp12(b).toString(16).padStart(2, "0")}`;
|
|
169826
169840
|
}
|
|
169827
169841
|
function tint2(hex22, amount) {
|
|
169828
169842
|
const [r, g2, b] = hexToRgb3(hex22);
|
|
@@ -170687,15 +170701,6 @@ var init_chart_view_model_bars = __esm2({
|
|
|
170687
170701
|
init_chart_view_model_scale();
|
|
170688
170702
|
}
|
|
170689
170703
|
});
|
|
170690
|
-
function resolveChart3DWallColors(surfaces) {
|
|
170691
|
-
const floor = surfaces.floor?.spPr?.fillColor;
|
|
170692
|
-
const sideWall = surfaces.sideWall?.spPr?.fillColor;
|
|
170693
|
-
const backWall = surfaces.backWall?.spPr?.fillColor;
|
|
170694
|
-
if (!floor && !sideWall && !backWall) {
|
|
170695
|
-
return void 0;
|
|
170696
|
-
}
|
|
170697
|
-
return { floor, sideWall, backWall };
|
|
170698
|
-
}
|
|
170699
170704
|
function primitivesBounds(prims) {
|
|
170700
170705
|
let minX = Number.POSITIVE_INFINITY;
|
|
170701
170706
|
let maxX = Number.NEGATIVE_INFINITY;
|
|
@@ -178412,7 +178417,7 @@ function formatRegionMapValue(value, cultureLanguage) {
|
|
|
178412
178417
|
}
|
|
178413
178418
|
}
|
|
178414
178419
|
function lerpColor(a, b, t) {
|
|
178415
|
-
const
|
|
178420
|
+
const clamp12 = (v) => Math.max(0, Math.min(255, Math.round(v))), ha = a.replace("#", ""), hb = b.replace("#", ""), r1 = parseInt(ha.substring(0, 2), 16), g1 = parseInt(ha.substring(2, 4), 16), b1 = parseInt(ha.substring(4, 6), 16), r22 = parseInt(hb.substring(0, 2), 16), g2 = parseInt(hb.substring(2, 4), 16), b2 = parseInt(hb.substring(4, 6), 16), r = clamp12(r1 + (r22 - r1) * t), g3 = clamp12(g1 + (g2 - g1) * t), bl = clamp12(b1 + (b2 - b1) * t), toHex23 = (n) => n.toString(16).padStart(2, "0");
|
|
178416
178421
|
return `#${toHex23(r)}${toHex23(g3)}${toHex23(bl)}`;
|
|
178417
178422
|
}
|
|
178418
178423
|
function resolveValueColorStops(valueColors, valueColorPositions, minVal, maxVal) {
|
|
@@ -180880,9 +180885,13 @@ function smartArt3DRigSpecularLights(rig, perspective2) {
|
|
|
180880
180885
|
const own = perspective2 && rig ? SMARTART_RIG_SPECULAR_LIGHTS[rig] : void 0;
|
|
180881
180886
|
return own ?? DEFAULT_HIGHLIGHT;
|
|
180882
180887
|
}
|
|
180888
|
+
function smartArt3DRigKeyLight(rig, sceneCamera) {
|
|
180889
|
+
return sceneCamera && rig ? SMARTART_RIG_SCENE_KEY_LIGHTS[rig] : void 0;
|
|
180890
|
+
}
|
|
180883
180891
|
var DEFAULT_HIGHLIGHT_ELEVATION_DEG;
|
|
180884
180892
|
var DEFAULT_HIGHLIGHT;
|
|
180885
180893
|
var SMARTART_RIG_SPECULAR_LIGHTS;
|
|
180894
|
+
var SMARTART_RIG_SCENE_KEY_LIGHTS;
|
|
180886
180895
|
var init_smartart_3d_light_rig = __esm2({
|
|
180887
180896
|
"src/render/smartart-3d-light-rig.ts"() {
|
|
180888
180897
|
DEFAULT_HIGHLIGHT_ELEVATION_DEG = 60;
|
|
@@ -180892,6 +180901,12 @@ var init_smartart_3d_light_rig = __esm2({
|
|
|
180892
180901
|
SMARTART_RIG_SPECULAR_LIGHTS = {
|
|
180893
180902
|
threePt: [{ azimuthDeg: 64, elevationDeg: 44, intensity: 4.6, sharpness: 3 }]
|
|
180894
180903
|
};
|
|
180904
|
+
SMARTART_RIG_SCENE_KEY_LIGHTS = {
|
|
180905
|
+
flat: { azimuthDeg: 0, elevationDeg: 40 },
|
|
180906
|
+
threePt: { azimuthDeg: 0, elevationDeg: 90 },
|
|
180907
|
+
morning: { azimuthDeg: 0, elevationDeg: 60 },
|
|
180908
|
+
soft: { azimuthDeg: 0, elevationDeg: 80 }
|
|
180909
|
+
};
|
|
180895
180910
|
}
|
|
180896
180911
|
});
|
|
180897
180912
|
function srgbChannelToLinear(c) {
|
|
@@ -180912,7 +180927,7 @@ function normalize2(v) {
|
|
|
180912
180927
|
const len = Math.hypot(v.x, v.y, v.z) || 1;
|
|
180913
180928
|
return { x: v.x / len, y: v.y / len, z: v.z / len };
|
|
180914
180929
|
}
|
|
180915
|
-
function resolveSmartArt3DLightModel(lighting, material, perspective2 = false) {
|
|
180930
|
+
function resolveSmartArt3DLightModel(lighting, material, perspective2 = false, sceneCamera = perspective2) {
|
|
180916
180931
|
const snap2 = getBevelHighlightDirection(lighting?.direction ?? "t");
|
|
180917
180932
|
const rev = (lighting?.revDeg ?? 0) * Math.PI / 180;
|
|
180918
180933
|
const ax = snap2.dx;
|
|
@@ -180933,8 +180948,9 @@ function resolveSmartArt3DLightModel(lighting, material, perspective2 = false) {
|
|
|
180933
180948
|
};
|
|
180934
180949
|
const response = getMaterialLighting(material);
|
|
180935
180950
|
const specular = response.specularConstant * SPECULAR_GAIN;
|
|
180951
|
+
const key2 = smartArt3DRigKeyLight(lighting?.rig, sceneCamera);
|
|
180936
180952
|
return {
|
|
180937
|
-
light: toward(KEY_ELEVATION_DEG),
|
|
180953
|
+
light: key2 ? toward(key2.elevationDeg, key2.azimuthDeg) : toward(KEY_ELEVATION_DEG),
|
|
180938
180954
|
highlights: smartArt3DRigSpecularLights(lighting?.rig, perspective2).map((rigLight) => ({
|
|
180939
180955
|
direction: toward(rigLight.elevationDeg, rigLight.azimuthDeg),
|
|
180940
180956
|
weight: specular * rigLight.intensity,
|
|
@@ -181129,173 +181145,6 @@ var init_smartart_3d_drawing_solid = __esm2({
|
|
|
181129
181145
|
DEG_PER_UNIT2 = 6e4;
|
|
181130
181146
|
}
|
|
181131
181147
|
});
|
|
181132
|
-
function transposeForHorizontalBar3D(point) {
|
|
181133
|
-
return [point[1], -point[0], point[2]];
|
|
181134
|
-
}
|
|
181135
|
-
function computeCartesianGridExtent(cols, rows, depthPercent) {
|
|
181136
|
-
const gridWidth = Math.max(cols - 1, 1) * GRID_SPACING;
|
|
181137
|
-
const depthScale = Math.min(Math.max((depthPercent ?? 100) / 100, 0.05), 3);
|
|
181138
|
-
const gridDepth = Math.max(gridWidth * depthScale, rows > 1 ? GRID_SPACING : GRID_SPACING * 0.5);
|
|
181139
|
-
return { gridWidth, gridDepth };
|
|
181140
|
-
}
|
|
181141
|
-
function clamp7(value, min, max) {
|
|
181142
|
-
return Math.min(Math.max(value, min), max);
|
|
181143
|
-
}
|
|
181144
|
-
function normalizeAzimuth(deg3) {
|
|
181145
|
-
const wrapped = deg3 % 360;
|
|
181146
|
-
return wrapped < 0 ? wrapped + 360 : wrapped;
|
|
181147
|
-
}
|
|
181148
|
-
function resolveCartesianCameraFov(view3D) {
|
|
181149
|
-
if (view3D?.rAngAx) {
|
|
181150
|
-
return RIGHT_ANGLE_FOV;
|
|
181151
|
-
}
|
|
181152
|
-
const perspective2 = clamp7(
|
|
181153
|
-
view3D?.rperspective ?? DEFAULT_PERSPECTIVE_DEG,
|
|
181154
|
-
0,
|
|
181155
|
-
PERSPECTIVE_MAX_DEG
|
|
181156
|
-
);
|
|
181157
|
-
return FOV_MIN + perspective2 / PERSPECTIVE_MAX_DEG * (FOV_MAX - FOV_MIN);
|
|
181158
|
-
}
|
|
181159
|
-
function computeSphericalCameraPlacement(maxExtent, targetY, view3D) {
|
|
181160
|
-
const fov = resolveCartesianCameraFov(view3D);
|
|
181161
|
-
const halfFovRad = fov * Math.PI / 360;
|
|
181162
|
-
const radius = Math.max(maxExtent, 0.01) / Math.tan(halfFovRad) * 0.75;
|
|
181163
|
-
const target = [0, targetY, 0];
|
|
181164
|
-
const elevationDeg = clamp7(view3D?.rotX ?? DEFAULT_ELEVATION_DEG, -89, 89);
|
|
181165
|
-
const azimuthDeg = normalizeAzimuth(view3D?.rotY ?? DEFAULT_AZIMUTH_DEG);
|
|
181166
|
-
const phi = (90 - elevationDeg) * Math.PI / 180;
|
|
181167
|
-
const theta = azimuthDeg * Math.PI / 180;
|
|
181168
|
-
const sinPhi = Math.sin(phi);
|
|
181169
|
-
return {
|
|
181170
|
-
position: [
|
|
181171
|
-
radius * sinPhi * Math.sin(theta),
|
|
181172
|
-
radius * Math.cos(phi) + target[1],
|
|
181173
|
-
radius * sinPhi * Math.cos(theta)
|
|
181174
|
-
],
|
|
181175
|
-
target,
|
|
181176
|
-
fov
|
|
181177
|
-
};
|
|
181178
|
-
}
|
|
181179
|
-
function computeCartesianCameraPlacement(cols, rows, view3D, horizontal = false) {
|
|
181180
|
-
const { gridWidth, gridDepth } = computeCartesianGridExtent(cols, rows, view3D?.depthPercent);
|
|
181181
|
-
const maxExtent = Math.max(gridWidth, gridDepth, MAX_VALUE_HEIGHT);
|
|
181182
|
-
const placement = computeSphericalCameraPlacement(maxExtent, MAX_VALUE_HEIGHT * 0.2, view3D);
|
|
181183
|
-
if (!horizontal) {
|
|
181184
|
-
return placement;
|
|
181185
|
-
}
|
|
181186
|
-
return {
|
|
181187
|
-
...placement,
|
|
181188
|
-
position: transposeForHorizontalBar3D(placement.position),
|
|
181189
|
-
target: transposeForHorizontalBar3D(placement.target)
|
|
181190
|
-
};
|
|
181191
|
-
}
|
|
181192
|
-
function buildCartesianChart3DLabels(cols, rows, categoryLabels, seriesNames, depthPercent, maxCat = 8, maxSer = 6, horizontal = false) {
|
|
181193
|
-
const { gridWidth, gridDepth } = computeCartesianGridExtent(cols, rows, depthPercent);
|
|
181194
|
-
const labels = [];
|
|
181195
|
-
const remap = (anchor) => horizontal ? transposeForHorizontalBar3D(anchor) : anchor;
|
|
181196
|
-
const catStep = Math.max(1, Math.ceil(categoryLabels.length / maxCat));
|
|
181197
|
-
for (let i2 = 0; i2 < categoryLabels.length; i2 += catStep) {
|
|
181198
|
-
const x = -gridWidth / 2 + i2 / Math.max(cols - 1, 1) * gridWidth;
|
|
181199
|
-
labels.push({
|
|
181200
|
-
key: `cat-${i2}`,
|
|
181201
|
-
text: categoryLabels[i2],
|
|
181202
|
-
anchor: remap([x, -0.15, gridDepth / 2 + 0.25]),
|
|
181203
|
-
axis: "category"
|
|
181204
|
-
});
|
|
181205
|
-
}
|
|
181206
|
-
const serStep = Math.max(1, Math.ceil(seriesNames.length / maxSer));
|
|
181207
|
-
for (let i2 = 0; i2 < seriesNames.length; i2 += serStep) {
|
|
181208
|
-
const z = -gridDepth / 2 + i2 / Math.max(rows - 1, 1) * gridDepth;
|
|
181209
|
-
labels.push({
|
|
181210
|
-
key: `ser-${i2}`,
|
|
181211
|
-
text: seriesNames[i2],
|
|
181212
|
-
anchor: remap([gridWidth / 2 + 0.3, -0.15, z]),
|
|
181213
|
-
axis: "series"
|
|
181214
|
-
});
|
|
181215
|
-
}
|
|
181216
|
-
return labels;
|
|
181217
|
-
}
|
|
181218
|
-
var GRID_SPACING;
|
|
181219
|
-
var MAX_VALUE_HEIGHT;
|
|
181220
|
-
var DEFAULT_ELEVATION_DEG;
|
|
181221
|
-
var DEFAULT_AZIMUTH_DEG;
|
|
181222
|
-
var DEFAULT_PERSPECTIVE_DEG;
|
|
181223
|
-
var FOV_MIN;
|
|
181224
|
-
var FOV_MAX;
|
|
181225
|
-
var RIGHT_ANGLE_FOV;
|
|
181226
|
-
var PERSPECTIVE_MAX_DEG;
|
|
181227
|
-
var init_cartesian_chart_3d_geom = __esm2({
|
|
181228
|
-
"src/render/cartesian-chart-3d-geom.ts"() {
|
|
181229
|
-
GRID_SPACING = 0.5;
|
|
181230
|
-
MAX_VALUE_HEIGHT = 1.5;
|
|
181231
|
-
DEFAULT_ELEVATION_DEG = 15;
|
|
181232
|
-
DEFAULT_AZIMUTH_DEG = 20;
|
|
181233
|
-
DEFAULT_PERSPECTIVE_DEG = 30;
|
|
181234
|
-
FOV_MIN = 15;
|
|
181235
|
-
FOV_MAX = 75;
|
|
181236
|
-
RIGHT_ANGLE_FOV = 20;
|
|
181237
|
-
PERSPECTIVE_MAX_DEG = 120;
|
|
181238
|
-
}
|
|
181239
|
-
});
|
|
181240
|
-
function normalizeToHeight(value, range) {
|
|
181241
|
-
if (range.span <= 0) {
|
|
181242
|
-
return 0;
|
|
181243
|
-
}
|
|
181244
|
-
return (value - range.min) / range.span * MAX_VALUE_HEIGHT;
|
|
181245
|
-
}
|
|
181246
|
-
function layoutCartesianLine3DSeries(points4, cols, rows, range, depthPercent) {
|
|
181247
|
-
const { gridWidth, gridDepth } = computeCartesianGridExtent(cols, rows, depthPercent);
|
|
181248
|
-
const rowStep = gridDepth / Math.max(rows, 1);
|
|
181249
|
-
const baselineY = normalizeToHeight(0, range);
|
|
181250
|
-
const bySeries = /* @__PURE__ */ new Map();
|
|
181251
|
-
for (const p of points4) {
|
|
181252
|
-
const list2 = bySeries.get(p.seriesIndex);
|
|
181253
|
-
if (list2) {
|
|
181254
|
-
list2.push(p);
|
|
181255
|
-
} else {
|
|
181256
|
-
bySeries.set(p.seriesIndex, [p]);
|
|
181257
|
-
}
|
|
181258
|
-
}
|
|
181259
|
-
const paths = [];
|
|
181260
|
-
for (const [seriesIndex, seriesPoints] of bySeries) {
|
|
181261
|
-
const sorted = [...seriesPoints].sort((a, b) => a.categoryIndex - b.categoryIndex);
|
|
181262
|
-
const z = -gridDepth / 2 + rowStep * (seriesIndex + 0.5);
|
|
181263
|
-
const vertices = sorted.map((p) => {
|
|
181264
|
-
const x = -gridWidth / 2 + p.categoryIndex / Math.max(cols - 1, 1) * gridWidth;
|
|
181265
|
-
const y = normalizeToHeight(p.value, range);
|
|
181266
|
-
return {
|
|
181267
|
-
seriesIndex,
|
|
181268
|
-
categoryIndex: p.categoryIndex,
|
|
181269
|
-
value: p.value,
|
|
181270
|
-
position: [x, y, z]
|
|
181271
|
-
};
|
|
181272
|
-
});
|
|
181273
|
-
paths.push({
|
|
181274
|
-
seriesIndex,
|
|
181275
|
-
color: sorted[0]?.color ?? "#4472C4",
|
|
181276
|
-
vertices,
|
|
181277
|
-
depthZ: z,
|
|
181278
|
-
baselineY
|
|
181279
|
-
});
|
|
181280
|
-
}
|
|
181281
|
-
return paths.sort((a, b) => a.seriesIndex - b.seriesIndex);
|
|
181282
|
-
}
|
|
181283
|
-
function buildAreaRibbonTriangles(path) {
|
|
181284
|
-
const { vertices, baselineY } = path;
|
|
181285
|
-
const out = [];
|
|
181286
|
-
for (let i2 = 0; i2 < vertices.length - 1; i2++) {
|
|
181287
|
-
const [x1, y1, z1] = vertices[i2].position;
|
|
181288
|
-
const [x2, y2, z2] = vertices[i2 + 1].position;
|
|
181289
|
-
out.push(x1, y1, z1, x1, baselineY, z1, x2, baselineY, z2);
|
|
181290
|
-
out.push(x1, y1, z1, x2, baselineY, z2, x2, y2, z2);
|
|
181291
|
-
}
|
|
181292
|
-
return out;
|
|
181293
|
-
}
|
|
181294
|
-
var init_cartesian_line_chart_3d_layout = __esm2({
|
|
181295
|
-
"src/render/cartesian-line-chart-3d-layout.ts"() {
|
|
181296
|
-
init_cartesian_chart_3d_geom();
|
|
181297
|
-
}
|
|
181298
|
-
});
|
|
181299
181148
|
function formatValueLabel(chartData, grouping, v) {
|
|
181300
181149
|
if (grouping === "percentStacked") {
|
|
181301
181150
|
return `${Math.round(v * 100)}%`;
|
|
@@ -181698,1197 +181547,6 @@ var init_chart_3d_pie_layout = __esm2({
|
|
|
181698
181547
|
RIM_SAMPLES = 96;
|
|
181699
181548
|
}
|
|
181700
181549
|
});
|
|
181701
|
-
function computePieChart3DThickness(view3D) {
|
|
181702
|
-
const scale2 = Math.min(
|
|
181703
|
-
Math.max((view3D?.hPercent ?? 100) / 100, MIN_THICKNESS_SCALE),
|
|
181704
|
-
MAX_THICKNESS_SCALE
|
|
181705
|
-
);
|
|
181706
|
-
return PIE_RADIUS * BASE_THICKNESS_RATIO * scale2;
|
|
181707
|
-
}
|
|
181708
|
-
function computePieChart3DCameraPlacement(view3D) {
|
|
181709
|
-
const thickness = computePieChart3DThickness(view3D);
|
|
181710
|
-
const maxExtent = PIE_RADIUS * CAMERA_EXTENT_MARGIN;
|
|
181711
|
-
return computeSphericalCameraPlacement(maxExtent, thickness / 2, view3D);
|
|
181712
|
-
}
|
|
181713
|
-
function computePieChart3DSliceAngles(values, explosions, firstSliceAngleDeg, outerRadius) {
|
|
181714
|
-
const total = values.reduce((s, v) => s + Math.abs(v), 0) || 1;
|
|
181715
|
-
let cumAngle = -Math.PI / 2 + (firstSliceAngleDeg ?? 0) * Math.PI / 180;
|
|
181716
|
-
return values.map((value, pointIndex) => {
|
|
181717
|
-
const sliceAngle = Math.abs(value) / total * Math.PI * 2;
|
|
181718
|
-
const startAngle = cumAngle;
|
|
181719
|
-
cumAngle += sliceAngle;
|
|
181720
|
-
const explosion = explosions?.[pointIndex] ?? 0;
|
|
181721
|
-
let explodeOffset = [0, 0];
|
|
181722
|
-
if (explosion > 0) {
|
|
181723
|
-
const mid = (startAngle + cumAngle) / 2;
|
|
181724
|
-
const offset = outerRadius * (explosion / 100);
|
|
181725
|
-
explodeOffset = [Math.cos(mid) * offset, Math.sin(mid) * offset];
|
|
181726
|
-
}
|
|
181727
|
-
return { pointIndex, value, startAngle, thetaLength: sliceAngle, explodeOffset };
|
|
181728
|
-
});
|
|
181729
|
-
}
|
|
181730
|
-
var PIE_RADIUS;
|
|
181731
|
-
var BASE_THICKNESS_RATIO;
|
|
181732
|
-
var MIN_THICKNESS_SCALE;
|
|
181733
|
-
var MAX_THICKNESS_SCALE;
|
|
181734
|
-
var CAMERA_EXTENT_MARGIN;
|
|
181735
|
-
var init_pie_chart_3d_geom = __esm2({
|
|
181736
|
-
"src/render/pie-chart-3d-geom.ts"() {
|
|
181737
|
-
init_cartesian_chart_3d_geom();
|
|
181738
|
-
PIE_RADIUS = 1;
|
|
181739
|
-
BASE_THICKNESS_RATIO = 0.3;
|
|
181740
|
-
MIN_THICKNESS_SCALE = 0.05;
|
|
181741
|
-
MAX_THICKNESS_SCALE = 3;
|
|
181742
|
-
CAMERA_EXTENT_MARGIN = 1.35;
|
|
181743
|
-
}
|
|
181744
|
-
});
|
|
181745
|
-
function computeGridExtent(cols, rows) {
|
|
181746
|
-
return {
|
|
181747
|
-
gridWidth: Math.max(cols - 1, 1) * GRID_SPACING2,
|
|
181748
|
-
gridDepth: Math.max(rows - 1, 1) * GRID_SPACING2
|
|
181749
|
-
};
|
|
181750
|
-
}
|
|
181751
|
-
function buildSurfaceGeometry(three, cols, rows, heightMap, colorMap) {
|
|
181752
|
-
const widthSegs = Math.max(cols - 1, 0);
|
|
181753
|
-
const depthSegs = Math.max(rows - 1, 0);
|
|
181754
|
-
const { gridWidth, gridDepth } = computeGridExtent(cols, rows);
|
|
181755
|
-
const geo = new three.PlaneGeometry(gridWidth, gridDepth, widthSegs, depthSegs);
|
|
181756
|
-
geo.rotateX(-Math.PI / 2);
|
|
181757
|
-
const pos2 = geo.attributes.position;
|
|
181758
|
-
const vertexCount = pos2.count;
|
|
181759
|
-
const colors = new Float32Array(vertexCount * 3);
|
|
181760
|
-
for (let i2 = 0; i2 < vertexCount; i2++) {
|
|
181761
|
-
const row = Math.floor(i2 / cols);
|
|
181762
|
-
const col = i2 % cols;
|
|
181763
|
-
const idx = row * cols + col;
|
|
181764
|
-
const h2 = idx < heightMap.length ? heightMap[idx] : 0;
|
|
181765
|
-
pos2.setY(i2, h2 * MAX_HEIGHT);
|
|
181766
|
-
const ci = idx * 3;
|
|
181767
|
-
colors[i2 * 3] = ci < colorMap.length ? colorMap[ci] : 0.5;
|
|
181768
|
-
colors[i2 * 3 + 1] = ci + 1 < colorMap.length ? colorMap[ci + 1] : 0.5;
|
|
181769
|
-
colors[i2 * 3 + 2] = ci + 2 < colorMap.length ? colorMap[ci + 2] : 0.5;
|
|
181770
|
-
}
|
|
181771
|
-
geo.setAttribute("color", new three.BufferAttribute(colors, 3));
|
|
181772
|
-
geo.computeVertexNormals();
|
|
181773
|
-
pos2.needsUpdate = true;
|
|
181774
|
-
const wireGeometry = new three.WireframeGeometry(geo);
|
|
181775
|
-
return { geometry: geo, wireGeometry };
|
|
181776
|
-
}
|
|
181777
|
-
function surfaceVertexWorldPosition(cols, rows, row, col, heightMap) {
|
|
181778
|
-
const { gridWidth, gridDepth } = computeGridExtent(cols, rows);
|
|
181779
|
-
const x = col * GRID_SPACING2 - gridWidth / 2;
|
|
181780
|
-
const z = row * GRID_SPACING2 - gridDepth / 2;
|
|
181781
|
-
const idx = row * cols + col;
|
|
181782
|
-
const h2 = idx >= 0 && idx < heightMap.length ? heightMap[idx] : 0;
|
|
181783
|
-
return [x, h2 * MAX_HEIGHT, z];
|
|
181784
|
-
}
|
|
181785
|
-
function buildSurfaceLabels(cols, rows, categoryLabels, seriesNames, maxCat = 8, maxSer = 6) {
|
|
181786
|
-
const { gridWidth, gridDepth } = computeGridExtent(cols, rows);
|
|
181787
|
-
const labels = [];
|
|
181788
|
-
const catStep = Math.max(1, Math.ceil(categoryLabels.length / maxCat));
|
|
181789
|
-
for (let i2 = 0; i2 < categoryLabels.length; i2 += catStep) {
|
|
181790
|
-
const x = -gridWidth / 2 + i2 / Math.max(cols - 1, 1) * gridWidth;
|
|
181791
|
-
labels.push({
|
|
181792
|
-
key: `cat-${i2}`,
|
|
181793
|
-
text: categoryLabels[i2],
|
|
181794
|
-
anchor: [x, -0.15, gridDepth / 2 + 0.25],
|
|
181795
|
-
axis: "category"
|
|
181796
|
-
});
|
|
181797
|
-
}
|
|
181798
|
-
const serStep = Math.max(1, Math.ceil(seriesNames.length / maxSer));
|
|
181799
|
-
for (let i2 = 0; i2 < seriesNames.length; i2 += serStep) {
|
|
181800
|
-
const z = -gridDepth / 2 + i2 / Math.max(rows - 1, 1) * gridDepth;
|
|
181801
|
-
labels.push({
|
|
181802
|
-
key: `ser-${i2}`,
|
|
181803
|
-
text: seriesNames[i2],
|
|
181804
|
-
anchor: [gridWidth / 2 + 0.3, -0.15, z],
|
|
181805
|
-
axis: "series"
|
|
181806
|
-
});
|
|
181807
|
-
}
|
|
181808
|
-
labels.push({
|
|
181809
|
-
key: "value-axis",
|
|
181810
|
-
text: "Value",
|
|
181811
|
-
anchor: [-gridWidth / 2 - 0.35, 0.75, -gridDepth / 2],
|
|
181812
|
-
axis: "value"
|
|
181813
|
-
});
|
|
181814
|
-
return labels;
|
|
181815
|
-
}
|
|
181816
|
-
function clamp9(value, min, max) {
|
|
181817
|
-
return Math.min(Math.max(value, min), max);
|
|
181818
|
-
}
|
|
181819
|
-
function normalizeAzimuth2(deg3) {
|
|
181820
|
-
const wrapped = deg3 % 360;
|
|
181821
|
-
return wrapped < 0 ? wrapped + 360 : wrapped;
|
|
181822
|
-
}
|
|
181823
|
-
function computeCameraPlacement(cols, rows, view3D) {
|
|
181824
|
-
const { gridWidth, gridDepth } = computeGridExtent(cols, rows);
|
|
181825
|
-
const maxExtent = Math.max(gridWidth, gridDepth, MAX_HEIGHT);
|
|
181826
|
-
const dist2 = maxExtent * 1.8;
|
|
181827
|
-
const target = [0, 0.3, 0];
|
|
181828
|
-
if (!view3D || view3D.rotX === void 0 && view3D.rotY === void 0) {
|
|
181829
|
-
return { position: [dist2 * 0.8, dist2 * 0.7, dist2 * 0.8], target };
|
|
181830
|
-
}
|
|
181831
|
-
const radius = dist2 * RADIUS_FACTOR;
|
|
181832
|
-
const elevationDeg = clamp9(view3D.rotX ?? DEFAULT_ELEVATION_DEG2, -89, 89);
|
|
181833
|
-
const azimuthDeg = normalizeAzimuth2(view3D.rotY ?? DEFAULT_AZIMUTH_DEG2);
|
|
181834
|
-
const phi = (90 - elevationDeg) * Math.PI / 180;
|
|
181835
|
-
const theta = azimuthDeg * Math.PI / 180;
|
|
181836
|
-
const sinPhi = Math.sin(phi);
|
|
181837
|
-
return {
|
|
181838
|
-
position: [
|
|
181839
|
-
radius * sinPhi * Math.sin(theta),
|
|
181840
|
-
radius * Math.cos(phi),
|
|
181841
|
-
radius * sinPhi * Math.cos(theta)
|
|
181842
|
-
],
|
|
181843
|
-
target
|
|
181844
|
-
};
|
|
181845
|
-
}
|
|
181846
|
-
var GRID_SPACING2;
|
|
181847
|
-
var MAX_HEIGHT;
|
|
181848
|
-
var DEFAULT_ELEVATION_DEG2;
|
|
181849
|
-
var DEFAULT_AZIMUTH_DEG2;
|
|
181850
|
-
var RADIUS_FACTOR;
|
|
181851
|
-
var init_surface_chart_3d_geom = __esm2({
|
|
181852
|
-
"src/render/surface-chart-3d-geom.ts"() {
|
|
181853
|
-
GRID_SPACING2 = 0.5;
|
|
181854
|
-
MAX_HEIGHT = 1.5;
|
|
181855
|
-
DEFAULT_ELEVATION_DEG2 = 15;
|
|
181856
|
-
DEFAULT_AZIMUTH_DEG2 = 20;
|
|
181857
|
-
RADIUS_FACTOR = Math.sqrt(0.8 ** 2 + 0.7 ** 2 + 0.8 ** 2);
|
|
181858
|
-
}
|
|
181859
|
-
});
|
|
181860
|
-
function createHostedChart3DStage(ctx, placement, limits, ambientIntensity = 0.6) {
|
|
181861
|
-
const three = ctx.three;
|
|
181862
|
-
const width = Math.max(1, ctx.size.width);
|
|
181863
|
-
const height = Math.max(1, ctx.size.height);
|
|
181864
|
-
const scene = new three.Scene();
|
|
181865
|
-
scene.add(new three.AmbientLight(16777215, ambientIntensity));
|
|
181866
|
-
const key2 = new three.DirectionalLight(16777215, 0.8);
|
|
181867
|
-
key2.position.set(5, 8, 5);
|
|
181868
|
-
scene.add(key2);
|
|
181869
|
-
const fill = new three.DirectionalLight(16777215, 0.3);
|
|
181870
|
-
fill.position.set(-3, 4, -2);
|
|
181871
|
-
scene.add(fill);
|
|
181872
|
-
const camera = new three.PerspectiveCamera(placement.fov, width / height, 0.1, 1e3);
|
|
181873
|
-
camera.position.set(...placement.position);
|
|
181874
|
-
const target = new three.Vector3(...placement.target);
|
|
181875
|
-
camera.lookAt(target);
|
|
181876
|
-
let orbit = null;
|
|
181877
|
-
if (ctx.OrbitControls) {
|
|
181878
|
-
orbit = new ctx.OrbitControls(camera, ctx.eventTarget);
|
|
181879
|
-
const limited = orbit;
|
|
181880
|
-
limited.enablePan = true;
|
|
181881
|
-
limited.enableZoom = true;
|
|
181882
|
-
limited.enableRotate = true;
|
|
181883
|
-
limited.minDistance = limits.minDistance;
|
|
181884
|
-
limited.maxDistance = limits.maxDistance;
|
|
181885
|
-
limited.maxPolarAngle = Math.PI / 2 + 0.3;
|
|
181886
|
-
limited.target.copy(target);
|
|
181887
|
-
limited.enabled = ctx.interactive;
|
|
181888
|
-
limited.update();
|
|
181889
|
-
}
|
|
181890
|
-
return {
|
|
181891
|
-
three,
|
|
181892
|
-
canvas: ctx.eventTarget,
|
|
181893
|
-
scene,
|
|
181894
|
-
camera,
|
|
181895
|
-
controls: orbit ?? { enabled: false },
|
|
181896
|
-
orbit,
|
|
181897
|
-
width,
|
|
181898
|
-
height
|
|
181899
|
-
};
|
|
181900
|
-
}
|
|
181901
|
-
function hostedChart3DInteraction(ctx) {
|
|
181902
|
-
let interactive = ctx.interactive;
|
|
181903
|
-
return {
|
|
181904
|
-
onSelect: (part) => {
|
|
181905
|
-
if (interactive) {
|
|
181906
|
-
ctx.emit({ type: "select", part });
|
|
181907
|
-
}
|
|
181908
|
-
},
|
|
181909
|
-
onValueDragPreview: (part, value) => {
|
|
181910
|
-
if (interactive) {
|
|
181911
|
-
ctx.emit({ type: "drag", detail: { part, value, phase: "move" } });
|
|
181912
|
-
}
|
|
181913
|
-
},
|
|
181914
|
-
onValueDragCommit: (part, value) => {
|
|
181915
|
-
if (interactive) {
|
|
181916
|
-
ctx.emit({ type: "drag", detail: { part, value, phase: "commit" } });
|
|
181917
|
-
}
|
|
181918
|
-
},
|
|
181919
|
-
set: (on) => {
|
|
181920
|
-
interactive = on;
|
|
181921
|
-
}
|
|
181922
|
-
};
|
|
181923
|
-
}
|
|
181924
|
-
function finishHostedChart3DScene(ctx, stage, parts, interactive) {
|
|
181925
|
-
let width = stage.width;
|
|
181926
|
-
let height = stage.height;
|
|
181927
|
-
const requestRender = () => ctx.requestRender();
|
|
181928
|
-
stage.orbit?.addEventListener("change", requestRender);
|
|
181929
|
-
for (const type of REDRAW_EVENTS) {
|
|
181930
|
-
ctx.eventTarget.addEventListener(type, requestRender);
|
|
181931
|
-
}
|
|
181932
|
-
let disposed = false;
|
|
181933
|
-
return {
|
|
181934
|
-
render(renderer) {
|
|
181935
|
-
stage.orbit?.update();
|
|
181936
|
-
renderer.render(stage.scene, stage.camera);
|
|
181937
|
-
parts.afterRender?.(stage.camera, width, height);
|
|
181938
|
-
},
|
|
181939
|
-
resize(size) {
|
|
181940
|
-
width = Math.max(1, size.width);
|
|
181941
|
-
height = Math.max(1, size.height);
|
|
181942
|
-
stage.camera.aspect = width / height;
|
|
181943
|
-
stage.camera.updateProjectionMatrix();
|
|
181944
|
-
parts.resize?.(width, height);
|
|
181945
|
-
},
|
|
181946
|
-
isAnimating: () => false,
|
|
181947
|
-
setInteractive(on) {
|
|
181948
|
-
interactive.set(on);
|
|
181949
|
-
if (stage.orbit) {
|
|
181950
|
-
stage.orbit.enabled = on;
|
|
181951
|
-
}
|
|
181952
|
-
},
|
|
181953
|
-
setSelectedPart(part) {
|
|
181954
|
-
parts.setSelectedPart?.(part);
|
|
181955
|
-
},
|
|
181956
|
-
setTextStyle(style) {
|
|
181957
|
-
parts.setTextStyle?.(style);
|
|
181958
|
-
},
|
|
181959
|
-
dispose() {
|
|
181960
|
-
if (disposed) {
|
|
181961
|
-
return;
|
|
181962
|
-
}
|
|
181963
|
-
disposed = true;
|
|
181964
|
-
stage.orbit?.removeEventListener("change", requestRender);
|
|
181965
|
-
for (const type of REDRAW_EVENTS) {
|
|
181966
|
-
ctx.eventTarget.removeEventListener(type, requestRender);
|
|
181967
|
-
}
|
|
181968
|
-
stage.orbit?.dispose();
|
|
181969
|
-
parts.dispose();
|
|
181970
|
-
stage.scene.clear();
|
|
181971
|
-
}
|
|
181972
|
-
};
|
|
181973
|
-
}
|
|
181974
|
-
var REDRAW_EVENTS;
|
|
181975
|
-
var init_chart_3d_hosted_stage = __esm2({
|
|
181976
|
-
"src/render/chart-3d-hosted-stage.ts"() {
|
|
181977
|
-
REDRAW_EVENTS = ["pointermove", "pointerdown", "pointerup", "pointerleave", "wheel"];
|
|
181978
|
-
}
|
|
181979
|
-
});
|
|
181980
|
-
function attachChart3DHoverTooltip(options) {
|
|
181981
|
-
const raycaster = new options.three.Raycaster();
|
|
181982
|
-
const ndc = new options.three.Vector2();
|
|
181983
|
-
let hoveredTooltip;
|
|
181984
|
-
const updateHoverTooltip = (clientX, clientY) => {
|
|
181985
|
-
const rect22 = options.canvas.getBoundingClientRect();
|
|
181986
|
-
if (rect22.width <= 0 || rect22.height <= 0) {
|
|
181987
|
-
return;
|
|
181988
|
-
}
|
|
181989
|
-
ndc.x = (clientX - rect22.left) / rect22.width * 2 - 1;
|
|
181990
|
-
ndc.y = -((clientY - rect22.top) / rect22.height) * 2 + 1;
|
|
181991
|
-
raycaster.setFromCamera(ndc, options.camera);
|
|
181992
|
-
const hit = raycaster.intersectObjects(options.meshes, false)[0];
|
|
181993
|
-
const tooltip = options.buildTooltip(hit);
|
|
181994
|
-
if (tooltip !== hoveredTooltip) {
|
|
181995
|
-
hoveredTooltip = tooltip;
|
|
181996
|
-
options.canvas.title = tooltip ?? "";
|
|
181997
|
-
}
|
|
181998
|
-
};
|
|
181999
|
-
const onPointerMove = (event) => {
|
|
182000
|
-
updateHoverTooltip(event.clientX, event.clientY);
|
|
182001
|
-
};
|
|
182002
|
-
const onPointerLeave = () => {
|
|
182003
|
-
if (hoveredTooltip !== void 0) {
|
|
182004
|
-
hoveredTooltip = void 0;
|
|
182005
|
-
options.canvas.title = "";
|
|
182006
|
-
}
|
|
182007
|
-
};
|
|
182008
|
-
options.canvas.addEventListener("pointermove", onPointerMove);
|
|
182009
|
-
options.canvas.addEventListener("pointerleave", onPointerLeave);
|
|
182010
|
-
return {
|
|
182011
|
-
dispose() {
|
|
182012
|
-
options.canvas.removeEventListener("pointermove", onPointerMove);
|
|
182013
|
-
options.canvas.removeEventListener("pointerleave", onPointerLeave);
|
|
182014
|
-
}
|
|
182015
|
-
};
|
|
182016
|
-
}
|
|
182017
|
-
var init_chart_3d_hover_tooltip = __esm2({
|
|
182018
|
-
"src/render/chart-3d-hover-tooltip.ts"() {
|
|
182019
|
-
}
|
|
182020
|
-
});
|
|
182021
|
-
function createLabelOverlay(doc, labels) {
|
|
182022
|
-
const layer = doc.createElement("div");
|
|
182023
|
-
Object.assign(layer.style, {
|
|
182024
|
-
position: "absolute",
|
|
182025
|
-
inset: "0",
|
|
182026
|
-
pointerEvents: "none",
|
|
182027
|
-
overflow: "hidden"
|
|
182028
|
-
});
|
|
182029
|
-
const entries2 = labels.map((label) => {
|
|
182030
|
-
const node = doc.createElement("div");
|
|
182031
|
-
node.textContent = label.text;
|
|
182032
|
-
const baseColor = label.axis === "value" ? "#999" : "#666";
|
|
182033
|
-
Object.assign(node.style, {
|
|
182034
|
-
position: "absolute",
|
|
182035
|
-
fontSize: `${BASE_FONT_SIZE_PX}px`,
|
|
182036
|
-
color: baseColor,
|
|
182037
|
-
whiteSpace: "nowrap",
|
|
182038
|
-
userSelect: "none",
|
|
182039
|
-
transform: "translate(-50%, -50%)",
|
|
182040
|
-
willChange: "left, top"
|
|
182041
|
-
});
|
|
182042
|
-
if (label.axis === "value") {
|
|
182043
|
-
node.style.writingMode = "vertical-rl";
|
|
182044
|
-
}
|
|
182045
|
-
layer.appendChild(node);
|
|
182046
|
-
return { node, baseColor };
|
|
182047
|
-
});
|
|
182048
|
-
function applyTextStyle(style) {
|
|
182049
|
-
for (const { node, baseColor } of entries2) {
|
|
182050
|
-
node.style.fontWeight = style?.bold === void 0 ? "" : style.bold ? "bold" : "normal";
|
|
182051
|
-
node.style.fontStyle = style?.italic === void 0 ? "" : style.italic ? "italic" : "normal";
|
|
182052
|
-
node.style.textDecorationLine = style?.underline === void 0 ? "" : style.underline ? "underline" : "none";
|
|
182053
|
-
const scale2 = typeof style?.fontScale === "number" && Number.isFinite(style.fontScale) && style.fontScale > 0 ? style.fontScale : 1;
|
|
182054
|
-
node.style.fontSize = `${BASE_FONT_SIZE_PX * scale2}px`;
|
|
182055
|
-
node.style.color = style?.color ?? baseColor;
|
|
182056
|
-
}
|
|
182057
|
-
}
|
|
182058
|
-
return { layer, nodes: entries2.map((e) => e.node), applyTextStyle };
|
|
182059
|
-
}
|
|
182060
|
-
var BASE_FONT_SIZE_PX;
|
|
182061
|
-
var init_surface_chart_3d_label_overlay = __esm2({
|
|
182062
|
-
"src/render/surface-chart-3d-label-overlay.ts"() {
|
|
182063
|
-
BASE_FONT_SIZE_PX = 9;
|
|
182064
|
-
}
|
|
182065
|
-
});
|
|
182066
|
-
function createChart3DLabelProjector(three, doc, labels) {
|
|
182067
|
-
const overlay = createLabelOverlay(doc, labels);
|
|
182068
|
-
const anchors = labels.map((l) => new three.Vector3(...l.anchor));
|
|
182069
|
-
const projected = new three.Vector3();
|
|
182070
|
-
return {
|
|
182071
|
-
layer: overlay.layer,
|
|
182072
|
-
applyTextStyle: overlay.applyTextStyle,
|
|
182073
|
-
update(camera, width, height) {
|
|
182074
|
-
for (let i2 = 0; i2 < overlay.nodes.length; i2++) {
|
|
182075
|
-
projected.copy(anchors[i2]).project(camera);
|
|
182076
|
-
const node = overlay.nodes[i2];
|
|
182077
|
-
if (projected.z > 1) {
|
|
182078
|
-
node.style.display = "none";
|
|
182079
|
-
continue;
|
|
182080
|
-
}
|
|
182081
|
-
node.style.display = "";
|
|
182082
|
-
node.style.left = `${(projected.x + 1) / 2 * width}px`;
|
|
182083
|
-
node.style.top = `${(-projected.y + 1) / 2 * height}px`;
|
|
182084
|
-
}
|
|
182085
|
-
}
|
|
182086
|
-
};
|
|
182087
|
-
}
|
|
182088
|
-
var init_chart_3d_label_projection = __esm2({
|
|
182089
|
-
"src/render/chart-3d-label-projection.ts"() {
|
|
182090
|
-
init_surface_chart_3d_label_overlay();
|
|
182091
|
-
}
|
|
182092
|
-
});
|
|
182093
|
-
function surfaceFaceIndexToCell(faceIndex, cols, rows) {
|
|
182094
|
-
const quadsPerRow = cols - 1;
|
|
182095
|
-
const quadsPerCol = rows - 1;
|
|
182096
|
-
if (!Number.isFinite(faceIndex) || faceIndex < 0 || quadsPerRow <= 0 || quadsPerCol <= 0) {
|
|
182097
|
-
return null;
|
|
182098
|
-
}
|
|
182099
|
-
const quadIndex = Math.floor(faceIndex / 2);
|
|
182100
|
-
const row = Math.floor(quadIndex / quadsPerRow);
|
|
182101
|
-
const col = quadIndex % quadsPerRow;
|
|
182102
|
-
if (row < 0 || row >= quadsPerCol || col < 0 || col >= quadsPerRow) {
|
|
182103
|
-
return null;
|
|
182104
|
-
}
|
|
182105
|
-
return { row, col };
|
|
182106
|
-
}
|
|
182107
|
-
function buildSurfaceHoverTooltip(faceIndex, data) {
|
|
182108
|
-
if (faceIndex === void 0 || faceIndex === null || !data.values) {
|
|
182109
|
-
return void 0;
|
|
182110
|
-
}
|
|
182111
|
-
const cell = surfaceFaceIndexToCell(faceIndex, data.cols, data.rows);
|
|
182112
|
-
if (!cell) {
|
|
182113
|
-
return void 0;
|
|
182114
|
-
}
|
|
182115
|
-
const idx = cell.row * data.cols + cell.col;
|
|
182116
|
-
const value = data.values[idx];
|
|
182117
|
-
if (value === void 0) {
|
|
182118
|
-
return void 0;
|
|
182119
|
-
}
|
|
182120
|
-
return buildMarkTooltip(
|
|
182121
|
-
data.seriesNames[cell.row],
|
|
182122
|
-
data.categoryLabels[cell.col],
|
|
182123
|
-
value,
|
|
182124
|
-
data.numberFormats?.[cell.row]
|
|
182125
|
-
);
|
|
182126
|
-
}
|
|
182127
|
-
var init_surface_chart_3d_hit_test = __esm2({
|
|
182128
|
-
"src/render/surface-chart-3d-hit-test.ts"() {
|
|
182129
|
-
init_chart_view_model();
|
|
182130
|
-
}
|
|
182131
|
-
});
|
|
182132
|
-
function chart3DHitToPartRef(hit) {
|
|
182133
|
-
if (!hit) {
|
|
182134
|
-
return null;
|
|
182135
|
-
}
|
|
182136
|
-
return { role: "dataPoint", seriesIndex: hit.seriesIndex, pointIndex: hit.pointIndex };
|
|
182137
|
-
}
|
|
182138
|
-
function chart3DMarkMatchesPart(mark, part) {
|
|
182139
|
-
return part !== null && part !== void 0 && part.role === "dataPoint" && part.seriesIndex === mark.seriesIndex && part.pointIndex === mark.pointIndex;
|
|
182140
|
-
}
|
|
182141
|
-
function calibrateChart3DValueAxis(screenAtValue0, value0, screenAtValue1, value1) {
|
|
182142
|
-
const valueSpan = value1 - value0;
|
|
182143
|
-
const dx = screenAtValue1.x - screenAtValue0.x;
|
|
182144
|
-
const dy = screenAtValue1.y - screenAtValue0.y;
|
|
182145
|
-
const pixelSpan = Math.hypot(dx, dy);
|
|
182146
|
-
if (valueSpan === 0 || pixelSpan < 1e-6 || !Number.isFinite(valueSpan)) {
|
|
182147
|
-
return null;
|
|
182148
|
-
}
|
|
182149
|
-
return {
|
|
182150
|
-
directionScreen: { x: dx / pixelSpan, y: dy / pixelSpan },
|
|
182151
|
-
pixelsPerUnit: pixelSpan / valueSpan
|
|
182152
|
-
};
|
|
182153
|
-
}
|
|
182154
|
-
function chart3DPointerDeltaToValueDelta(calibration, pointerDeltaScreen) {
|
|
182155
|
-
const dot2 = pointerDeltaScreen.x * calibration.directionScreen.x + pointerDeltaScreen.y * calibration.directionScreen.y;
|
|
182156
|
-
return dot2 / calibration.pixelsPerUnit;
|
|
182157
|
-
}
|
|
182158
|
-
var CHART_3D_DRAG_THRESHOLD_PX;
|
|
182159
|
-
var CHART_3D_SELECTED_EMISSIVE;
|
|
182160
|
-
var CHART_3D_SELECTED_EMISSIVE_INTENSITY;
|
|
182161
|
-
var init_chart_3d_interaction = __esm2({
|
|
182162
|
-
"src/render/chart-3d-interaction.ts"() {
|
|
182163
|
-
CHART_3D_DRAG_THRESHOLD_PX = 3;
|
|
182164
|
-
CHART_3D_SELECTED_EMISSIVE = "#3b82f6";
|
|
182165
|
-
CHART_3D_SELECTED_EMISSIVE_INTENSITY = 0.55;
|
|
182166
|
-
}
|
|
182167
|
-
});
|
|
182168
|
-
function projectToScreen(three, camera, point, width, height) {
|
|
182169
|
-
const v = new three.Vector3(point[0], point[1], point[2]);
|
|
182170
|
-
v.project(camera);
|
|
182171
|
-
return { x: (v.x + 1) / 2 * width, y: (-v.y + 1) / 2 * height };
|
|
182172
|
-
}
|
|
182173
|
-
function attachChart3DPointerInteraction(options) {
|
|
182174
|
-
let width = options.width;
|
|
182175
|
-
let height = options.height;
|
|
182176
|
-
const raycaster = new options.three.Raycaster();
|
|
182177
|
-
const ndc = new options.three.Vector2();
|
|
182178
|
-
let dragState = null;
|
|
182179
|
-
function raycastAt(clientX, clientY) {
|
|
182180
|
-
const rect22 = options.canvas.getBoundingClientRect();
|
|
182181
|
-
if (rect22.width <= 0 || rect22.height <= 0) {
|
|
182182
|
-
return void 0;
|
|
182183
|
-
}
|
|
182184
|
-
ndc.x = (clientX - rect22.left) / rect22.width * 2 - 1;
|
|
182185
|
-
ndc.y = -((clientY - rect22.top) / rect22.height) * 2 + 1;
|
|
182186
|
-
raycaster.setFromCamera(ndc, options.camera);
|
|
182187
|
-
return raycaster.intersectObjects(options.meshes, false)[0];
|
|
182188
|
-
}
|
|
182189
|
-
function setSelectedPart(part) {
|
|
182190
|
-
options.applyHighlight?.(part);
|
|
182191
|
-
}
|
|
182192
|
-
function currentDelta(clientX, clientY, state) {
|
|
182193
|
-
return { x: clientX - state.startClientX, y: clientY - state.startClientY };
|
|
182194
|
-
}
|
|
182195
|
-
const onPointerDown = (event) => {
|
|
182196
|
-
options.canvas.setPointerCapture?.(
|
|
182197
|
-
event.pointerId
|
|
182198
|
-
);
|
|
182199
|
-
const hit = raycastAt(event.clientX, event.clientY);
|
|
182200
|
-
const part = hit ? options.resolveHit(hit) : null;
|
|
182201
|
-
const armed = part !== null && isChartInteractionArmed(options.canvas);
|
|
182202
|
-
if (armed) {
|
|
182203
|
-
event.stopPropagation();
|
|
182204
|
-
}
|
|
182205
|
-
let calibration = null;
|
|
182206
|
-
let startValue = 0;
|
|
182207
|
-
if (hit && part && armed && options.calibrateDrag) {
|
|
182208
|
-
const input = options.calibrateDrag(hit, part);
|
|
182209
|
-
if (input) {
|
|
182210
|
-
const s0 = projectToScreen(
|
|
182211
|
-
options.three,
|
|
182212
|
-
options.camera,
|
|
182213
|
-
input.worldAtValue0,
|
|
182214
|
-
width,
|
|
182215
|
-
height
|
|
182216
|
-
);
|
|
182217
|
-
const s1 = projectToScreen(
|
|
182218
|
-
options.three,
|
|
182219
|
-
options.camera,
|
|
182220
|
-
input.worldAtValue1,
|
|
182221
|
-
width,
|
|
182222
|
-
height
|
|
182223
|
-
);
|
|
182224
|
-
calibration = calibrateChart3DValueAxis(s0, input.value0, s1, input.value1);
|
|
182225
|
-
startValue = input.value1;
|
|
182226
|
-
}
|
|
182227
|
-
}
|
|
182228
|
-
dragState = {
|
|
182229
|
-
part,
|
|
182230
|
-
calibration,
|
|
182231
|
-
startValue,
|
|
182232
|
-
startClientX: event.clientX,
|
|
182233
|
-
startClientY: event.clientY,
|
|
182234
|
-
moved: false
|
|
182235
|
-
};
|
|
182236
|
-
if (calibration) {
|
|
182237
|
-
event.preventDefault();
|
|
182238
|
-
options.setControlsEnabled?.(false);
|
|
182239
|
-
}
|
|
182240
|
-
};
|
|
182241
|
-
const onPointerMove = (event) => {
|
|
182242
|
-
if (!dragState || !dragState.part || !dragState.calibration) {
|
|
182243
|
-
return;
|
|
182244
|
-
}
|
|
182245
|
-
const delta = currentDelta(event.clientX, event.clientY, dragState);
|
|
182246
|
-
if (!dragState.moved && Math.hypot(delta.x, delta.y) < CHART_3D_DRAG_THRESHOLD_PX) {
|
|
182247
|
-
return;
|
|
182248
|
-
}
|
|
182249
|
-
dragState.moved = true;
|
|
182250
|
-
const value = dragState.startValue + chart3DPointerDeltaToValueDelta(dragState.calibration, delta);
|
|
182251
|
-
options.onValueDragPreview?.(dragState.part, value);
|
|
182252
|
-
};
|
|
182253
|
-
const onPointerUp = (event) => {
|
|
182254
|
-
if (!dragState) {
|
|
182255
|
-
return;
|
|
182256
|
-
}
|
|
182257
|
-
const state = dragState;
|
|
182258
|
-
dragState = null;
|
|
182259
|
-
options.canvas.releasePointerCapture?.(event.pointerId);
|
|
182260
|
-
if (state.calibration) {
|
|
182261
|
-
options.setControlsEnabled?.(true);
|
|
182262
|
-
}
|
|
182263
|
-
if (state.moved && state.part && state.calibration) {
|
|
182264
|
-
const delta = currentDelta(event.clientX, event.clientY, state);
|
|
182265
|
-
const value = state.startValue + chart3DPointerDeltaToValueDelta(state.calibration, delta);
|
|
182266
|
-
options.onValueDragCommit?.(state.part, value);
|
|
182267
|
-
return;
|
|
182268
|
-
}
|
|
182269
|
-
setSelectedPart(state.part);
|
|
182270
|
-
options.onSelect?.(state.part);
|
|
182271
|
-
};
|
|
182272
|
-
options.canvas.addEventListener("pointerdown", onPointerDown);
|
|
182273
|
-
options.canvas.addEventListener("pointermove", onPointerMove);
|
|
182274
|
-
options.canvas.addEventListener("pointerup", onPointerUp);
|
|
182275
|
-
options.canvas.addEventListener("pointercancel", onPointerUp);
|
|
182276
|
-
return {
|
|
182277
|
-
setSelectedPart,
|
|
182278
|
-
updateSize(w, h2) {
|
|
182279
|
-
width = w;
|
|
182280
|
-
height = h2;
|
|
182281
|
-
},
|
|
182282
|
-
dispose() {
|
|
182283
|
-
options.canvas.removeEventListener("pointerdown", onPointerDown);
|
|
182284
|
-
options.canvas.removeEventListener("pointermove", onPointerMove);
|
|
182285
|
-
options.canvas.removeEventListener("pointerup", onPointerUp);
|
|
182286
|
-
options.canvas.removeEventListener("pointercancel", onPointerUp);
|
|
182287
|
-
}
|
|
182288
|
-
};
|
|
182289
|
-
}
|
|
182290
|
-
var init_chart_3d_pointer_interaction = __esm2({
|
|
182291
|
-
"src/render/chart-3d-pointer-interaction.ts"() {
|
|
182292
|
-
init_chart_3d_interaction();
|
|
182293
|
-
init_chart_canvas_drag();
|
|
182294
|
-
}
|
|
182295
|
-
});
|
|
182296
|
-
function calibrateSurfaceChart3DDrag(position2, value, values) {
|
|
182297
|
-
let min = Infinity;
|
|
182298
|
-
let max = -Infinity;
|
|
182299
|
-
for (const v of values) {
|
|
182300
|
-
if (v < min) {
|
|
182301
|
-
min = v;
|
|
182302
|
-
}
|
|
182303
|
-
if (v > max) {
|
|
182304
|
-
max = v;
|
|
182305
|
-
}
|
|
182306
|
-
}
|
|
182307
|
-
if (!(max > min)) {
|
|
182308
|
-
return null;
|
|
182309
|
-
}
|
|
182310
|
-
const [x, , z] = position2;
|
|
182311
|
-
const atMin = value === min;
|
|
182312
|
-
return {
|
|
182313
|
-
worldAtValue0: [x, atMin ? MAX_HEIGHT : 0, z],
|
|
182314
|
-
value0: atMin ? max : min,
|
|
182315
|
-
worldAtValue1: position2,
|
|
182316
|
-
value1: value
|
|
182317
|
-
};
|
|
182318
|
-
}
|
|
182319
|
-
var init_surface_chart_3d_drag = __esm2({
|
|
182320
|
-
"src/render/surface-chart-3d-drag.ts"() {
|
|
182321
|
-
init_surface_chart_3d_geom();
|
|
182322
|
-
}
|
|
182323
|
-
});
|
|
182324
|
-
function createSurfaceHighlightMarker(three, cols, rows, heightMap) {
|
|
182325
|
-
const geometry = new three.SphereGeometry(MARKER_RADIUS, 12, 8);
|
|
182326
|
-
const material = new three.MeshPhongMaterial({
|
|
182327
|
-
color: CHART_3D_SELECTED_EMISSIVE,
|
|
182328
|
-
emissive: CHART_3D_SELECTED_EMISSIVE,
|
|
182329
|
-
emissiveIntensity: CHART_3D_SELECTED_EMISSIVE_INTENSITY,
|
|
182330
|
-
shininess: 30
|
|
182331
|
-
});
|
|
182332
|
-
const mesh = new three.Mesh(geometry, material);
|
|
182333
|
-
mesh.visible = false;
|
|
182334
|
-
return {
|
|
182335
|
-
mesh,
|
|
182336
|
-
setSelected(cell) {
|
|
182337
|
-
if (!cell) {
|
|
182338
|
-
mesh.visible = false;
|
|
182339
|
-
return;
|
|
182340
|
-
}
|
|
182341
|
-
const [x, y, z] = surfaceVertexWorldPosition(cols, rows, cell.row, cell.col, heightMap);
|
|
182342
|
-
mesh.position.set(x, y + MARKER_Y_OFFSET, z);
|
|
182343
|
-
mesh.visible = true;
|
|
182344
|
-
},
|
|
182345
|
-
dispose() {
|
|
182346
|
-
geometry.dispose();
|
|
182347
|
-
material.dispose();
|
|
182348
|
-
}
|
|
182349
|
-
};
|
|
182350
|
-
}
|
|
182351
|
-
function cellFromIntersection(intersection, cols, rows) {
|
|
182352
|
-
return intersection.faceIndex === void 0 || intersection.faceIndex === null ? null : surfaceFaceIndexToCell(intersection.faceIndex, cols, rows);
|
|
182353
|
-
}
|
|
182354
|
-
function attachSurfaceChart3DInteraction(params) {
|
|
182355
|
-
return attachChart3DPointerInteraction({
|
|
182356
|
-
three: params.three,
|
|
182357
|
-
canvas: params.canvas,
|
|
182358
|
-
camera: params.camera,
|
|
182359
|
-
width: params.width,
|
|
182360
|
-
height: params.height,
|
|
182361
|
-
meshes: [params.surfaceMesh],
|
|
182362
|
-
resolveHit: (intersection) => {
|
|
182363
|
-
const cell = cellFromIntersection(intersection, params.cols, params.rows);
|
|
182364
|
-
return chart3DHitToPartRef(cell ? { seriesIndex: cell.row, pointIndex: cell.col } : null);
|
|
182365
|
-
},
|
|
182366
|
-
calibrateDrag: (intersection) => {
|
|
182367
|
-
const cell = cellFromIntersection(intersection, params.cols, params.rows);
|
|
182368
|
-
if (!cell || !params.values) {
|
|
182369
|
-
return null;
|
|
182370
|
-
}
|
|
182371
|
-
const idx = cell.row * params.cols + cell.col;
|
|
182372
|
-
const value = params.values[idx];
|
|
182373
|
-
if (value === void 0) {
|
|
182374
|
-
return null;
|
|
182375
|
-
}
|
|
182376
|
-
const position2 = surfaceVertexWorldPosition(
|
|
182377
|
-
params.cols,
|
|
182378
|
-
params.rows,
|
|
182379
|
-
cell.row,
|
|
182380
|
-
cell.col,
|
|
182381
|
-
params.heightMap
|
|
182382
|
-
);
|
|
182383
|
-
return calibrateSurfaceChart3DDrag(position2, value, params.values);
|
|
182384
|
-
},
|
|
182385
|
-
applyHighlight: (part) => {
|
|
182386
|
-
const cell = part && part.role === "dataPoint" && part.pointIndex !== void 0 ? { row: part.seriesIndex, col: part.pointIndex } : null;
|
|
182387
|
-
params.highlightMarker.setSelected(cell);
|
|
182388
|
-
},
|
|
182389
|
-
setControlsEnabled: (enabled) => {
|
|
182390
|
-
params.controls.enabled = enabled;
|
|
182391
|
-
},
|
|
182392
|
-
onSelect: params.interaction?.onSelect,
|
|
182393
|
-
onValueDragPreview: params.interaction?.onValueDragPreview,
|
|
182394
|
-
onValueDragCommit: params.interaction?.onValueDragCommit
|
|
182395
|
-
});
|
|
182396
|
-
}
|
|
182397
|
-
var MARKER_RADIUS;
|
|
182398
|
-
var MARKER_Y_OFFSET;
|
|
182399
|
-
var init_surface_chart_3d_interaction_wiring = __esm2({
|
|
182400
|
-
"src/render/surface-chart-3d-interaction-wiring.ts"() {
|
|
182401
|
-
init_chart_3d_interaction();
|
|
182402
|
-
init_chart_3d_pointer_interaction();
|
|
182403
|
-
init_surface_chart_3d_drag();
|
|
182404
|
-
init_surface_chart_3d_geom();
|
|
182405
|
-
init_surface_chart_3d_hit_test();
|
|
182406
|
-
MARKER_RADIUS = 0.07;
|
|
182407
|
-
MARKER_Y_OFFSET = 0.03;
|
|
182408
|
-
}
|
|
182409
|
-
});
|
|
182410
|
-
function buildSurfaceWallMeshes(three, cols, rows, wallHeight, colors, extent) {
|
|
182411
|
-
const { gridWidth, gridDepth } = extent ?? computeGridExtent(cols, rows);
|
|
182412
|
-
const meshes = [];
|
|
182413
|
-
const disposables = [];
|
|
182414
|
-
const addPlane = (width, height, color2, position2, rotation) => {
|
|
182415
|
-
const geometry = new three.PlaneGeometry(width, height);
|
|
182416
|
-
const material = new three.MeshBasicMaterial({
|
|
182417
|
-
color: color2,
|
|
182418
|
-
transparent: true,
|
|
182419
|
-
opacity: PANEL_OPACITY,
|
|
182420
|
-
side: three.DoubleSide,
|
|
182421
|
-
depthWrite: false
|
|
182422
|
-
});
|
|
182423
|
-
const mesh = new three.Mesh(geometry, material);
|
|
182424
|
-
mesh.position.set(...position2);
|
|
182425
|
-
mesh.rotation.set(...rotation);
|
|
182426
|
-
meshes.push(mesh);
|
|
182427
|
-
disposables.push(geometry, material);
|
|
182428
|
-
};
|
|
182429
|
-
if (colors.floor) {
|
|
182430
|
-
addPlane(gridWidth, gridDepth, colors.floor, [0, -0.01, 0], [-Math.PI / 2, 0, 0]);
|
|
182431
|
-
}
|
|
182432
|
-
if (colors.backWall) {
|
|
182433
|
-
addPlane(
|
|
182434
|
-
gridWidth,
|
|
182435
|
-
wallHeight,
|
|
182436
|
-
colors.backWall,
|
|
182437
|
-
[0, wallHeight / 2, -gridDepth / 2],
|
|
182438
|
-
[0, 0, 0]
|
|
182439
|
-
);
|
|
182440
|
-
}
|
|
182441
|
-
if (colors.sideWall) {
|
|
182442
|
-
addPlane(
|
|
182443
|
-
gridDepth,
|
|
182444
|
-
wallHeight,
|
|
182445
|
-
colors.sideWall,
|
|
182446
|
-
[gridWidth / 2, wallHeight / 2, 0],
|
|
182447
|
-
[0, Math.PI / 2, 0]
|
|
182448
|
-
);
|
|
182449
|
-
}
|
|
182450
|
-
return {
|
|
182451
|
-
meshes,
|
|
182452
|
-
dispose: () => {
|
|
182453
|
-
for (const d of disposables) {
|
|
182454
|
-
d.dispose();
|
|
182455
|
-
}
|
|
182456
|
-
}
|
|
182457
|
-
};
|
|
182458
|
-
}
|
|
182459
|
-
var PANEL_OPACITY;
|
|
182460
|
-
var init_surface_chart_3d_walls = __esm2({
|
|
182461
|
-
"src/render/surface-chart-3d-walls.ts"() {
|
|
182462
|
-
init_surface_chart_3d_geom();
|
|
182463
|
-
PANEL_OPACITY = 0.35;
|
|
182464
|
-
}
|
|
182465
|
-
});
|
|
182466
|
-
function createSurfaceChart3DScene(ctx, options) {
|
|
182467
|
-
const { cols, rows } = options;
|
|
182468
|
-
const placement = computeCameraPlacement(cols, rows, options.view3D);
|
|
182469
|
-
const stage = createHostedChart3DStage(
|
|
182470
|
-
ctx,
|
|
182471
|
-
{ fov: FOV2, ...placement },
|
|
182472
|
-
{ minDistance: 1, maxDistance: 20 },
|
|
182473
|
-
0.6
|
|
182474
|
-
);
|
|
182475
|
-
const { three, scene, camera, canvas, controls, width, height } = stage;
|
|
182476
|
-
const interaction = hostedChart3DInteraction(ctx);
|
|
182477
|
-
const { gridWidth, gridDepth } = computeGridExtent(cols, rows);
|
|
182478
|
-
const floorSize = Math.max(gridWidth, gridDepth) * 1.2;
|
|
182479
|
-
const gridFloor = new three.GridHelper(floorSize, Math.max(cols, rows), 13421772, 15263976);
|
|
182480
|
-
gridFloor.position.y = -0.02;
|
|
182481
|
-
scene.add(gridFloor);
|
|
182482
|
-
const walls = options.surfaceColors ? buildSurfaceWallMeshes(three, cols, rows, MAX_HEIGHT, options.surfaceColors) : null;
|
|
182483
|
-
for (const mesh of walls?.meshes ?? []) {
|
|
182484
|
-
scene.add(mesh);
|
|
182485
|
-
}
|
|
182486
|
-
const { heightMap, colorMap } = options;
|
|
182487
|
-
const { geometry, wireGeometry } = buildSurfaceGeometry(three, cols, rows, heightMap, colorMap);
|
|
182488
|
-
const surfaceMaterial = new three.MeshPhongMaterial({
|
|
182489
|
-
vertexColors: true,
|
|
182490
|
-
side: three.DoubleSide,
|
|
182491
|
-
shininess: 30,
|
|
182492
|
-
transparent: true,
|
|
182493
|
-
opacity: 0.92
|
|
182494
|
-
});
|
|
182495
|
-
const surfaceMesh = new three.Mesh(geometry, surfaceMaterial);
|
|
182496
|
-
scene.add(surfaceMesh);
|
|
182497
|
-
const highlightMarker = createSurfaceHighlightMarker(three, cols, rows, heightMap);
|
|
182498
|
-
scene.add(highlightMarker.mesh);
|
|
182499
|
-
let wireMaterial = null;
|
|
182500
|
-
if (options.wireframe) {
|
|
182501
|
-
wireMaterial = new three.LineBasicMaterial({
|
|
182502
|
-
color: 3355443,
|
|
182503
|
-
transparent: true,
|
|
182504
|
-
opacity: 0.25
|
|
182505
|
-
});
|
|
182506
|
-
scene.add(new three.LineSegments(wireGeometry, wireMaterial));
|
|
182507
|
-
}
|
|
182508
|
-
const hoverTooltip = attachChart3DHoverTooltip({
|
|
182509
|
-
three,
|
|
182510
|
-
canvas,
|
|
182511
|
-
camera,
|
|
182512
|
-
meshes: [surfaceMesh],
|
|
182513
|
-
buildTooltip: (intersection) => buildSurfaceHoverTooltip(intersection?.faceIndex, {
|
|
182514
|
-
cols,
|
|
182515
|
-
rows,
|
|
182516
|
-
categoryLabels: options.categoryLabels,
|
|
182517
|
-
seriesNames: options.seriesNames,
|
|
182518
|
-
values: options.values,
|
|
182519
|
-
numberFormats: options.numberFormats
|
|
182520
|
-
})
|
|
182521
|
-
});
|
|
182522
|
-
const pointerInteraction = attachSurfaceChart3DInteraction({
|
|
182523
|
-
three,
|
|
182524
|
-
canvas,
|
|
182525
|
-
camera,
|
|
182526
|
-
controls,
|
|
182527
|
-
width,
|
|
182528
|
-
height,
|
|
182529
|
-
surfaceMesh,
|
|
182530
|
-
cols,
|
|
182531
|
-
rows,
|
|
182532
|
-
heightMap,
|
|
182533
|
-
values: options.values,
|
|
182534
|
-
highlightMarker,
|
|
182535
|
-
interaction
|
|
182536
|
-
});
|
|
182537
|
-
const labels = buildSurfaceLabels(cols, rows, options.categoryLabels, options.seriesNames);
|
|
182538
|
-
const labelProjector = createChart3DLabelProjector(three, ctx.document, labels);
|
|
182539
|
-
labelProjector.applyTextStyle(options.textStyle);
|
|
182540
|
-
ctx.overlay.appendChild(labelProjector.layer);
|
|
182541
|
-
return finishHostedChart3DScene(
|
|
182542
|
-
ctx,
|
|
182543
|
-
stage,
|
|
182544
|
-
{
|
|
182545
|
-
afterRender: (cam, w, h2) => labelProjector.update(cam, w, h2),
|
|
182546
|
-
resize: (w, h2) => pointerInteraction.updateSize(w, h2),
|
|
182547
|
-
setSelectedPart: (part) => pointerInteraction.setSelectedPart(part),
|
|
182548
|
-
setTextStyle: (style) => labelProjector.applyTextStyle(style),
|
|
182549
|
-
dispose() {
|
|
182550
|
-
hoverTooltip.dispose();
|
|
182551
|
-
pointerInteraction.dispose();
|
|
182552
|
-
geometry.dispose();
|
|
182553
|
-
wireGeometry.dispose();
|
|
182554
|
-
surfaceMaterial.dispose();
|
|
182555
|
-
wireMaterial?.dispose();
|
|
182556
|
-
highlightMarker.dispose();
|
|
182557
|
-
gridFloor.dispose();
|
|
182558
|
-
walls?.dispose();
|
|
182559
|
-
labelProjector.layer.remove();
|
|
182560
|
-
}
|
|
182561
|
-
},
|
|
182562
|
-
interaction
|
|
182563
|
-
);
|
|
182564
|
-
}
|
|
182565
|
-
var FOV2;
|
|
182566
|
-
var init_surface_chart_3d_scene = __esm2({
|
|
182567
|
-
"src/render/surface-chart-3d-scene.ts"() {
|
|
182568
|
-
init_chart_3d_hosted_stage();
|
|
182569
|
-
init_chart_3d_hover_tooltip();
|
|
182570
|
-
init_chart_3d_label_projection();
|
|
182571
|
-
init_surface_chart_3d_geom();
|
|
182572
|
-
init_surface_chart_3d_hit_test();
|
|
182573
|
-
init_surface_chart_3d_interaction_wiring();
|
|
182574
|
-
init_surface_chart_3d_walls();
|
|
182575
|
-
FOV2 = 45;
|
|
182576
|
-
}
|
|
182577
|
-
});
|
|
182578
|
-
function colorFace(color2) {
|
|
182579
|
-
return { kind: "color", color: color2 };
|
|
182580
|
-
}
|
|
182581
|
-
function worldHeightPerValueUnit(box) {
|
|
182582
|
-
return box.value !== 0 ? box.size[1] / box.value : void 0;
|
|
182583
|
-
}
|
|
182584
|
-
function faceRepeat(format2, pictureStackUnit, faceWorldSize, box) {
|
|
182585
|
-
if (format2 === "stretch" || pictureStackUnit === void 0 || pictureStackUnit <= 0) {
|
|
182586
|
-
return 1;
|
|
182587
|
-
}
|
|
182588
|
-
const perValueUnit = worldHeightPerValueUnit(box);
|
|
182589
|
-
if (!perValueUnit) {
|
|
182590
|
-
return 1;
|
|
182591
|
-
}
|
|
182592
|
-
const tileWorldSize = pictureStackUnit * perValueUnit;
|
|
182593
|
-
return tileWorldSize > 0 ? Math.max(1, faceWorldSize / tileWorldSize) : 1;
|
|
182594
|
-
}
|
|
182595
|
-
function resolveTargetedFace(series, box, face, faceWorldSize, untargetedFallback) {
|
|
182596
|
-
const resolved = resolveDataPointPictureFill(series, box.categoryIndex, box.seriesIndex, face);
|
|
182597
|
-
if (!resolved) {
|
|
182598
|
-
return colorFace(untargetedFallback);
|
|
182599
|
-
}
|
|
182600
|
-
const pictureStackUnit = resolveActiveDataPointPicture(
|
|
182601
|
-
series,
|
|
182602
|
-
box.categoryIndex
|
|
182603
|
-
)?.pictureStackUnit;
|
|
182604
|
-
return {
|
|
182605
|
-
kind: "picture",
|
|
182606
|
-
imageUrl: resolved.imageUrl,
|
|
182607
|
-
repeatX: 1,
|
|
182608
|
-
repeatY: faceRepeat(resolved.format, pictureStackUnit, faceWorldSize, box)
|
|
182609
|
-
};
|
|
182610
|
-
}
|
|
182611
|
-
function allSameColor(fills) {
|
|
182612
|
-
const first = fills[0];
|
|
182613
|
-
if (!first || first.kind !== "color") {
|
|
182614
|
-
return void 0;
|
|
182615
|
-
}
|
|
182616
|
-
return fills.every((fill) => fill.kind === "color" && fill.color === first.color) ? first.color : void 0;
|
|
182617
|
-
}
|
|
182618
|
-
function resolveBarBoxFaceFills(box, series) {
|
|
182619
|
-
const plain = {
|
|
182620
|
-
posX: colorFace(box.color),
|
|
182621
|
-
negX: colorFace(box.color),
|
|
182622
|
-
posY: colorFace(box.color),
|
|
182623
|
-
negY: colorFace(box.color),
|
|
182624
|
-
posZ: colorFace(box.color),
|
|
182625
|
-
negZ: colorFace(box.color)
|
|
182626
|
-
};
|
|
182627
|
-
if (box.shape !== void 0 && box.shape !== "box") {
|
|
182628
|
-
return plain;
|
|
182629
|
-
}
|
|
182630
|
-
const seriesData = series[box.seriesIndex];
|
|
182631
|
-
if (!seriesData) {
|
|
182632
|
-
return plain;
|
|
182633
|
-
}
|
|
182634
|
-
const active2 = resolveActiveDataPointPicture(seriesData, box.categoryIndex);
|
|
182635
|
-
if (!active2?.imageUrl) {
|
|
182636
|
-
return plain;
|
|
182637
|
-
}
|
|
182638
|
-
const [, height, depth] = box.size;
|
|
182639
|
-
const frontFill = resolveTargetedFace(seriesData, box, "front", height, box.color);
|
|
182640
|
-
const sideFill = resolveTargetedFace(
|
|
182641
|
-
seriesData,
|
|
182642
|
-
box,
|
|
182643
|
-
"side",
|
|
182644
|
-
height,
|
|
182645
|
-
resolveUntargetedBarFaceFill("side", box.color)
|
|
182646
|
-
);
|
|
182647
|
-
const endFill = resolveTargetedFace(
|
|
182648
|
-
seriesData,
|
|
182649
|
-
box,
|
|
182650
|
-
"end",
|
|
182651
|
-
depth,
|
|
182652
|
-
resolveUntargetedBarFaceFill("end", box.color)
|
|
182653
|
-
);
|
|
182654
|
-
return {
|
|
182655
|
-
posX: sideFill,
|
|
182656
|
-
negX: sideFill,
|
|
182657
|
-
posY: endFill,
|
|
182658
|
-
negY: colorFace(box.color),
|
|
182659
|
-
posZ: frontFill,
|
|
182660
|
-
negZ: colorFace(box.color)
|
|
182661
|
-
};
|
|
182662
|
-
}
|
|
182663
|
-
function resolveBarRoundFaceFills(box, series) {
|
|
182664
|
-
const plain = {
|
|
182665
|
-
side: colorFace(box.color),
|
|
182666
|
-
end: colorFace(box.color),
|
|
182667
|
-
bottom: colorFace(box.color)
|
|
182668
|
-
};
|
|
182669
|
-
const seriesData = series[box.seriesIndex];
|
|
182670
|
-
if (!seriesData) {
|
|
182671
|
-
return plain;
|
|
182672
|
-
}
|
|
182673
|
-
const active2 = resolveActiveDataPointPicture(seriesData, box.categoryIndex);
|
|
182674
|
-
if (!active2?.imageUrl) {
|
|
182675
|
-
return plain;
|
|
182676
|
-
}
|
|
182677
|
-
const [, height, depth] = box.size;
|
|
182678
|
-
const sideFill = resolveTargetedFace(
|
|
182679
|
-
seriesData,
|
|
182680
|
-
box,
|
|
182681
|
-
"side",
|
|
182682
|
-
height,
|
|
182683
|
-
resolveUntargetedBarFaceFill("side", box.color)
|
|
182684
|
-
);
|
|
182685
|
-
const endFill = resolveTargetedFace(
|
|
182686
|
-
seriesData,
|
|
182687
|
-
box,
|
|
182688
|
-
"end",
|
|
182689
|
-
depth,
|
|
182690
|
-
resolveUntargetedBarFaceFill("end", box.color)
|
|
182691
|
-
);
|
|
182692
|
-
return { side: sideFill, end: endFill, bottom: colorFace(box.color) };
|
|
182693
|
-
}
|
|
182694
|
-
function uniformBoxColor(fills) {
|
|
182695
|
-
return allSameColor([fills.posX, fills.negX, fills.posY, fills.negY, fills.posZ, fills.negZ]);
|
|
182696
|
-
}
|
|
182697
|
-
function uniformRoundColor(fills) {
|
|
182698
|
-
return allSameColor([fills.side, fills.end, fills.bottom]);
|
|
182699
|
-
}
|
|
182700
|
-
var init_bar_chart_3d_face_fill = __esm2({
|
|
182701
|
-
"src/render/bar-chart-3d-face-fill.ts"() {
|
|
182702
|
-
init_chart_bar3d_face_picture();
|
|
182703
|
-
init_chart_datapoint_picture_resolve();
|
|
182704
|
-
}
|
|
182705
|
-
});
|
|
182706
|
-
function createBarChart3DTextureManager(three) {
|
|
182707
|
-
const loader = new three.TextureLoader();
|
|
182708
|
-
const cache2 = /* @__PURE__ */ new Map();
|
|
182709
|
-
const loaded = [];
|
|
182710
|
-
return {
|
|
182711
|
-
load(url) {
|
|
182712
|
-
const cached = cache2.get(url);
|
|
182713
|
-
if (cached) {
|
|
182714
|
-
return cached;
|
|
182715
|
-
}
|
|
182716
|
-
const pending = new Promise((resolve3, reject) => {
|
|
182717
|
-
loader.load(
|
|
182718
|
-
url,
|
|
182719
|
-
(texture) => {
|
|
182720
|
-
loaded.push(texture);
|
|
182721
|
-
resolve3(texture);
|
|
182722
|
-
},
|
|
182723
|
-
void 0,
|
|
182724
|
-
reject
|
|
182725
|
-
);
|
|
182726
|
-
});
|
|
182727
|
-
cache2.set(url, pending);
|
|
182728
|
-
return pending;
|
|
182729
|
-
},
|
|
182730
|
-
disposeAll() {
|
|
182731
|
-
for (const texture of loaded) {
|
|
182732
|
-
texture.dispose();
|
|
182733
|
-
}
|
|
182734
|
-
loaded.length = 0;
|
|
182735
|
-
cache2.clear();
|
|
182736
|
-
}
|
|
182737
|
-
};
|
|
182738
|
-
}
|
|
182739
|
-
function buildColorMaterial(three, color2) {
|
|
182740
|
-
return new three.MeshPhongMaterial({ color: color2, shininess: 30 });
|
|
182741
|
-
}
|
|
182742
|
-
function buildFaceMaterial(three, fill, textures, ownedTextures, isDisposed) {
|
|
182743
|
-
if (fill.kind === "color") {
|
|
182744
|
-
return buildColorMaterial(three, fill.color);
|
|
182745
|
-
}
|
|
182746
|
-
const material = buildColorMaterial(three, "#ffffff");
|
|
182747
|
-
textures.load(fill.imageUrl).then((base) => {
|
|
182748
|
-
const texture = base.clone();
|
|
182749
|
-
texture.wrapS = three.RepeatWrapping;
|
|
182750
|
-
texture.wrapT = three.RepeatWrapping;
|
|
182751
|
-
texture.repeat.set(fill.repeatX, fill.repeatY);
|
|
182752
|
-
texture.needsUpdate = true;
|
|
182753
|
-
if (isDisposed()) {
|
|
182754
|
-
texture.dispose();
|
|
182755
|
-
return void 0;
|
|
182756
|
-
}
|
|
182757
|
-
ownedTextures.push(texture);
|
|
182758
|
-
material.map = texture;
|
|
182759
|
-
material.needsUpdate = true;
|
|
182760
|
-
return void 0;
|
|
182761
|
-
}).catch(() => {
|
|
182762
|
-
});
|
|
182763
|
-
return material;
|
|
182764
|
-
}
|
|
182765
|
-
function buildMaterialArrayResult(three, fills, textures) {
|
|
182766
|
-
let disposed = false;
|
|
182767
|
-
const ownedTextures = [];
|
|
182768
|
-
const materials = fills.map(
|
|
182769
|
-
(fill) => buildFaceMaterial(three, fill, textures, ownedTextures, () => disposed)
|
|
182770
|
-
);
|
|
182771
|
-
return {
|
|
182772
|
-
material: materials,
|
|
182773
|
-
dispose: () => {
|
|
182774
|
-
disposed = true;
|
|
182775
|
-
for (const material of materials) {
|
|
182776
|
-
material.dispose();
|
|
182777
|
-
}
|
|
182778
|
-
for (const texture of ownedTextures) {
|
|
182779
|
-
texture.dispose();
|
|
182780
|
-
}
|
|
182781
|
-
}
|
|
182782
|
-
};
|
|
182783
|
-
}
|
|
182784
|
-
function buildBarBoxMaterial(three, box, assets) {
|
|
182785
|
-
if (!assets) {
|
|
182786
|
-
const material = buildColorMaterial(three, box.color);
|
|
182787
|
-
return { material, dispose: () => material.dispose() };
|
|
182788
|
-
}
|
|
182789
|
-
const isRound = box.shape !== void 0 && box.shape !== "box";
|
|
182790
|
-
if (isRound) {
|
|
182791
|
-
const roundFills = resolveBarRoundFaceFills(box, assets.context.series);
|
|
182792
|
-
const solid2 = uniformRoundColor(roundFills);
|
|
182793
|
-
if (solid2 !== void 0) {
|
|
182794
|
-
const material = buildColorMaterial(three, solid2);
|
|
182795
|
-
return { material, dispose: () => material.dispose() };
|
|
182796
|
-
}
|
|
182797
|
-
return buildMaterialArrayResult(
|
|
182798
|
-
three,
|
|
182799
|
-
[roundFills.side, roundFills.end, roundFills.bottom],
|
|
182800
|
-
assets.textures
|
|
182801
|
-
);
|
|
182802
|
-
}
|
|
182803
|
-
const fills = resolveBarBoxFaceFills(box, assets.context.series);
|
|
182804
|
-
const solid = uniformBoxColor(fills);
|
|
182805
|
-
if (solid !== void 0) {
|
|
182806
|
-
const material = buildColorMaterial(three, solid);
|
|
182807
|
-
return { material, dispose: () => material.dispose() };
|
|
182808
|
-
}
|
|
182809
|
-
return buildMaterialArrayResult(
|
|
182810
|
-
three,
|
|
182811
|
-
FACE_ORDER.map((face) => fills[face]),
|
|
182812
|
-
assets.textures
|
|
182813
|
-
);
|
|
182814
|
-
}
|
|
182815
|
-
var FACE_ORDER;
|
|
182816
|
-
var init_bar_chart_3d_materials = __esm2({
|
|
182817
|
-
"src/render/bar-chart-3d-materials.ts"() {
|
|
182818
|
-
init_bar_chart_3d_face_fill();
|
|
182819
|
-
FACE_ORDER = [
|
|
182820
|
-
"posX",
|
|
182821
|
-
"negX",
|
|
182822
|
-
"posY",
|
|
182823
|
-
"negY",
|
|
182824
|
-
"posZ",
|
|
182825
|
-
"negZ"
|
|
182826
|
-
];
|
|
182827
|
-
}
|
|
182828
|
-
});
|
|
182829
|
-
function buildBar3DGeometry(three, shape, coneToMaxTopRadiusFactor2) {
|
|
182830
|
-
switch (shape) {
|
|
182831
|
-
case "cylinder":
|
|
182832
|
-
return new three.CylinderGeometry(0.5, 0.5, 1, ROUND_SEGMENTS);
|
|
182833
|
-
case "cone":
|
|
182834
|
-
return new three.ConeGeometry(0.5, 1, ROUND_SEGMENTS);
|
|
182835
|
-
case "pyramid":
|
|
182836
|
-
return new three.ConeGeometry(0.5, 1, PYRAMID_SEGMENTS);
|
|
182837
|
-
case "coneToMax":
|
|
182838
|
-
return new three.CylinderGeometry(
|
|
182839
|
-
0.5 * (coneToMaxTopRadiusFactor2 ?? 0),
|
|
182840
|
-
0.5,
|
|
182841
|
-
1,
|
|
182842
|
-
ROUND_SEGMENTS
|
|
182843
|
-
);
|
|
182844
|
-
case "pyramidToMax":
|
|
182845
|
-
return new three.CylinderGeometry(
|
|
182846
|
-
0.5 * (coneToMaxTopRadiusFactor2 ?? 0),
|
|
182847
|
-
0.5,
|
|
182848
|
-
1,
|
|
182849
|
-
PYRAMID_SEGMENTS
|
|
182850
|
-
);
|
|
182851
|
-
case "box":
|
|
182852
|
-
default:
|
|
182853
|
-
return new three.BoxGeometry(1, 1, 1);
|
|
182854
|
-
}
|
|
182855
|
-
}
|
|
182856
|
-
function buildBar3DMeshGroup(three, scene, boxes, horizontal = false, picture) {
|
|
182857
|
-
const meshes = [];
|
|
182858
|
-
const materials = [];
|
|
182859
|
-
const materialDisposers = [];
|
|
182860
|
-
const geometries = [];
|
|
182861
|
-
for (const box of boxes) {
|
|
182862
|
-
const geometry = buildBar3DGeometry(three, box.shape, box.coneToMaxTopRadiusFactor);
|
|
182863
|
-
const { material, dispose } = buildBarBoxMaterial(three, box, picture);
|
|
182864
|
-
const mesh = new three.Mesh(geometry, material);
|
|
182865
|
-
mesh.position.set(...box.center);
|
|
182866
|
-
mesh.scale.set(...box.size);
|
|
182867
|
-
if (horizontal) {
|
|
182868
|
-
mesh.rotation.z = -Math.PI / 2;
|
|
182869
|
-
}
|
|
182870
|
-
mesh.userData = {
|
|
182871
|
-
seriesIndex: box.seriesIndex,
|
|
182872
|
-
categoryIndex: box.categoryIndex,
|
|
182873
|
-
value: box.value
|
|
182874
|
-
};
|
|
182875
|
-
scene.add(mesh);
|
|
182876
|
-
meshes.push(mesh);
|
|
182877
|
-
materials.push(material);
|
|
182878
|
-
materialDisposers.push(dispose);
|
|
182879
|
-
geometries.push(geometry);
|
|
182880
|
-
}
|
|
182881
|
-
return { meshes, materials, geometries, materialDisposers };
|
|
182882
|
-
}
|
|
182883
|
-
var ROUND_SEGMENTS;
|
|
182884
|
-
var PYRAMID_SEGMENTS;
|
|
182885
|
-
var init_bar_chart_3d_geometry = __esm2({
|
|
182886
|
-
"src/render/bar-chart-3d-geometry.ts"() {
|
|
182887
|
-
init_bar_chart_3d_materials();
|
|
182888
|
-
ROUND_SEGMENTS = 32;
|
|
182889
|
-
PYRAMID_SEGMENTS = 4;
|
|
182890
|
-
}
|
|
182891
|
-
});
|
|
182892
181550
|
function buildBarChart3DHoverTooltip(hit, data) {
|
|
182893
181551
|
if (!hit) {
|
|
182894
181552
|
return void 0;
|
|
@@ -182905,984 +181563,6 @@ var init_bar_chart_3d_hit_test = __esm2({
|
|
|
182905
181563
|
init_chart_view_model();
|
|
182906
181564
|
}
|
|
182907
181565
|
});
|
|
182908
|
-
function valueAxisIndex(horizontal) {
|
|
182909
|
-
return horizontal ? 0 : 1;
|
|
182910
|
-
}
|
|
182911
|
-
function calibrateBarChart3DDrag(boxes, hit, grouping, horizontal) {
|
|
182912
|
-
if (grouping !== "clustered") {
|
|
182913
|
-
return null;
|
|
182914
|
-
}
|
|
182915
|
-
const box = boxes.find(
|
|
182916
|
-
(b) => b.seriesIndex === hit.seriesIndex && b.categoryIndex === hit.categoryIndex
|
|
182917
|
-
);
|
|
182918
|
-
if (!box) {
|
|
182919
|
-
return null;
|
|
182920
|
-
}
|
|
182921
|
-
const axis = valueAxisIndex(horizontal);
|
|
182922
|
-
const half = box.size[axis] / 2;
|
|
182923
|
-
const center = box.center[axis];
|
|
182924
|
-
const lo = center - half;
|
|
182925
|
-
const hi = center + half;
|
|
182926
|
-
const zeroIsLo = Math.abs(lo) <= Math.abs(hi);
|
|
182927
|
-
const zeroCoord = zeroIsLo ? lo : hi;
|
|
182928
|
-
const valueCoord = zeroIsLo ? hi : lo;
|
|
182929
|
-
if (Math.abs(valueCoord - zeroCoord) < 1e-9) {
|
|
182930
|
-
return null;
|
|
182931
|
-
}
|
|
182932
|
-
const at = (coord) => axis === 0 ? [coord, box.center[1], box.center[2]] : [box.center[0], coord, box.center[2]];
|
|
182933
|
-
return {
|
|
182934
|
-
worldAtValue0: at(zeroCoord),
|
|
182935
|
-
value0: 0,
|
|
182936
|
-
worldAtValue1: at(valueCoord),
|
|
182937
|
-
value1: hit.value
|
|
182938
|
-
};
|
|
182939
|
-
}
|
|
182940
|
-
var init_bar_chart_3d_drag = __esm2({
|
|
182941
|
-
"src/render/bar-chart-3d-drag.ts"() {
|
|
182942
|
-
}
|
|
182943
|
-
});
|
|
182944
|
-
function applyChart3DMeshHighlight(entries2, part) {
|
|
182945
|
-
for (const { mark, material } of entries2) {
|
|
182946
|
-
const selected = chart3DMarkMatchesPart(mark, part);
|
|
182947
|
-
const materials = Array.isArray(material) ? material : [material];
|
|
182948
|
-
for (const one of materials) {
|
|
182949
|
-
one.emissive.set(selected ? CHART_3D_SELECTED_EMISSIVE : CLEAR_EMISSIVE);
|
|
182950
|
-
one.emissiveIntensity = selected ? CHART_3D_SELECTED_EMISSIVE_INTENSITY : 0;
|
|
182951
|
-
}
|
|
182952
|
-
}
|
|
182953
|
-
}
|
|
182954
|
-
var CLEAR_EMISSIVE;
|
|
182955
|
-
var init_chart_3d_mesh_highlight = __esm2({
|
|
182956
|
-
"src/render/chart-3d-mesh-highlight.ts"() {
|
|
182957
|
-
init_chart_3d_interaction();
|
|
182958
|
-
CLEAR_EMISSIVE = "#000000";
|
|
182959
|
-
}
|
|
182960
|
-
});
|
|
182961
|
-
function attachBarChart3DInteraction(params) {
|
|
182962
|
-
const highlightEntries = params.boxMeshes.map((mesh, i2) => {
|
|
182963
|
-
const hit = mesh.userData;
|
|
182964
|
-
return {
|
|
182965
|
-
mark: { seriesIndex: hit.seriesIndex, pointIndex: hit.categoryIndex },
|
|
182966
|
-
material: params.boxMaterials[i2]
|
|
182967
|
-
};
|
|
182968
|
-
});
|
|
182969
|
-
return attachChart3DPointerInteraction({
|
|
182970
|
-
three: params.three,
|
|
182971
|
-
canvas: params.canvas,
|
|
182972
|
-
camera: params.camera,
|
|
182973
|
-
width: params.width,
|
|
182974
|
-
height: params.height,
|
|
182975
|
-
meshes: params.boxMeshes,
|
|
182976
|
-
resolveHit: (intersection) => {
|
|
182977
|
-
const hit = intersection.object.userData;
|
|
182978
|
-
return chart3DHitToPartRef(
|
|
182979
|
-
hit ? { seriesIndex: hit.seriesIndex, pointIndex: hit.categoryIndex } : null
|
|
182980
|
-
);
|
|
182981
|
-
},
|
|
182982
|
-
calibrateDrag: (intersection) => {
|
|
182983
|
-
const hit = intersection.object.userData;
|
|
182984
|
-
return calibrateBarChart3DDrag(params.boxes, hit, params.grouping, params.horizontal);
|
|
182985
|
-
},
|
|
182986
|
-
applyHighlight: (part) => applyChart3DMeshHighlight(highlightEntries, part),
|
|
182987
|
-
setControlsEnabled: (enabled) => {
|
|
182988
|
-
params.controls.enabled = enabled;
|
|
182989
|
-
},
|
|
182990
|
-
onSelect: params.interaction?.onSelect,
|
|
182991
|
-
onValueDragPreview: params.interaction?.onValueDragPreview,
|
|
182992
|
-
onValueDragCommit: params.interaction?.onValueDragCommit
|
|
182993
|
-
});
|
|
182994
|
-
}
|
|
182995
|
-
var init_bar_chart_3d_interaction_wiring = __esm2({
|
|
182996
|
-
"src/render/bar-chart-3d-interaction-wiring.ts"() {
|
|
182997
|
-
init_bar_chart_3d_drag();
|
|
182998
|
-
init_chart_3d_interaction();
|
|
182999
|
-
init_chart_3d_mesh_highlight();
|
|
183000
|
-
init_chart_3d_pointer_interaction();
|
|
183001
|
-
}
|
|
183002
|
-
});
|
|
183003
|
-
function createBarChart3DScene(ctx, options) {
|
|
183004
|
-
const placement = computeCartesianCameraPlacement(
|
|
183005
|
-
options.cols,
|
|
183006
|
-
options.rows,
|
|
183007
|
-
options.view3D,
|
|
183008
|
-
options.horizontal
|
|
183009
|
-
);
|
|
183010
|
-
const stage = createHostedChart3DStage(ctx, placement, { minDistance: 0.5, maxDistance: 30 });
|
|
183011
|
-
const { three, scene, camera, canvas } = stage;
|
|
183012
|
-
const extent = computeCartesianGridExtent(
|
|
183013
|
-
options.cols,
|
|
183014
|
-
options.rows,
|
|
183015
|
-
options.view3D?.depthPercent
|
|
183016
|
-
);
|
|
183017
|
-
const floorSize = Math.max(extent.gridWidth, extent.gridDepth, MAX_VALUE_HEIGHT * 2) * 1.2;
|
|
183018
|
-
const gridFloor = new three.GridHelper(
|
|
183019
|
-
floorSize,
|
|
183020
|
-
Math.max(options.cols, options.rows),
|
|
183021
|
-
13421772,
|
|
183022
|
-
15263976
|
|
183023
|
-
);
|
|
183024
|
-
gridFloor.position.y = -0.02;
|
|
183025
|
-
scene.add(gridFloor);
|
|
183026
|
-
const walls = options.wallColors ? buildSurfaceWallMeshes(
|
|
183027
|
-
three,
|
|
183028
|
-
options.cols,
|
|
183029
|
-
options.rows,
|
|
183030
|
-
MAX_VALUE_HEIGHT,
|
|
183031
|
-
options.wallColors,
|
|
183032
|
-
extent
|
|
183033
|
-
) : null;
|
|
183034
|
-
for (const mesh of walls?.meshes ?? []) {
|
|
183035
|
-
scene.add(mesh);
|
|
183036
|
-
}
|
|
183037
|
-
const baseTextures = createBarChart3DTextureManager(three);
|
|
183038
|
-
const textures = {
|
|
183039
|
-
load: (url) => baseTextures.load(url).then((texture) => {
|
|
183040
|
-
setTimeout(ctx.requestRender, 0);
|
|
183041
|
-
return texture;
|
|
183042
|
-
}),
|
|
183043
|
-
disposeAll: () => baseTextures.disposeAll()
|
|
183044
|
-
};
|
|
183045
|
-
const {
|
|
183046
|
-
meshes: boxMeshes,
|
|
183047
|
-
materials: boxMaterials,
|
|
183048
|
-
geometries: boxGeometries,
|
|
183049
|
-
materialDisposers: boxMaterialDisposers
|
|
183050
|
-
} = buildBar3DMeshGroup(
|
|
183051
|
-
three,
|
|
183052
|
-
scene,
|
|
183053
|
-
options.boxes,
|
|
183054
|
-
options.horizontal,
|
|
183055
|
-
options.picture ? { context: options.picture, textures } : void 0
|
|
183056
|
-
);
|
|
183057
|
-
const hoverTooltip = attachChart3DHoverTooltip({
|
|
183058
|
-
three,
|
|
183059
|
-
canvas,
|
|
183060
|
-
camera,
|
|
183061
|
-
meshes: boxMeshes,
|
|
183062
|
-
buildTooltip: (intersection) => buildBarChart3DHoverTooltip(intersection?.object.userData, {
|
|
183063
|
-
categoryLabels: options.categoryLabels,
|
|
183064
|
-
seriesNames: options.seriesNames,
|
|
183065
|
-
numberFormats: options.numberFormats
|
|
183066
|
-
})
|
|
183067
|
-
});
|
|
183068
|
-
const interaction = hostedChart3DInteraction(ctx);
|
|
183069
|
-
const pointerInteraction = attachBarChart3DInteraction({
|
|
183070
|
-
three,
|
|
183071
|
-
canvas,
|
|
183072
|
-
camera,
|
|
183073
|
-
controls: stage.controls,
|
|
183074
|
-
width: stage.width,
|
|
183075
|
-
height: stage.height,
|
|
183076
|
-
boxMeshes,
|
|
183077
|
-
boxMaterials,
|
|
183078
|
-
boxes: options.boxes,
|
|
183079
|
-
grouping: options.grouping,
|
|
183080
|
-
horizontal: Boolean(options.horizontal),
|
|
183081
|
-
interaction
|
|
183082
|
-
});
|
|
183083
|
-
const labels = buildCartesianChart3DLabels(
|
|
183084
|
-
options.cols,
|
|
183085
|
-
options.rows,
|
|
183086
|
-
options.categoryLabels,
|
|
183087
|
-
options.seriesNames,
|
|
183088
|
-
options.view3D?.depthPercent,
|
|
183089
|
-
void 0,
|
|
183090
|
-
void 0,
|
|
183091
|
-
options.horizontal
|
|
183092
|
-
);
|
|
183093
|
-
const labelProjector = createChart3DLabelProjector(three, ctx.document, labels);
|
|
183094
|
-
labelProjector.applyTextStyle(options.textStyle);
|
|
183095
|
-
ctx.overlay.appendChild(labelProjector.layer);
|
|
183096
|
-
return finishHostedChart3DScene(
|
|
183097
|
-
ctx,
|
|
183098
|
-
stage,
|
|
183099
|
-
{
|
|
183100
|
-
afterRender: (cam, width, height) => labelProjector.update(cam, width, height),
|
|
183101
|
-
resize: (width, height) => pointerInteraction.updateSize(width, height),
|
|
183102
|
-
setSelectedPart: (part) => pointerInteraction.setSelectedPart(part),
|
|
183103
|
-
setTextStyle: (style) => labelProjector.applyTextStyle(style),
|
|
183104
|
-
dispose() {
|
|
183105
|
-
hoverTooltip.dispose();
|
|
183106
|
-
pointerInteraction.dispose();
|
|
183107
|
-
for (const g2 of boxGeometries) {
|
|
183108
|
-
g2.dispose();
|
|
183109
|
-
}
|
|
183110
|
-
for (const disposeMaterial of boxMaterialDisposers) {
|
|
183111
|
-
disposeMaterial();
|
|
183112
|
-
}
|
|
183113
|
-
textures.disposeAll();
|
|
183114
|
-
gridFloor.dispose();
|
|
183115
|
-
walls?.dispose();
|
|
183116
|
-
labelProjector.layer.remove();
|
|
183117
|
-
}
|
|
183118
|
-
},
|
|
183119
|
-
interaction
|
|
183120
|
-
);
|
|
183121
|
-
}
|
|
183122
|
-
var init_bar_chart_3d_scene = __esm2({
|
|
183123
|
-
"src/render/bar-chart-3d-scene.ts"() {
|
|
183124
|
-
init_bar_chart_3d_geometry();
|
|
183125
|
-
init_bar_chart_3d_hit_test();
|
|
183126
|
-
init_bar_chart_3d_interaction_wiring();
|
|
183127
|
-
init_bar_chart_3d_materials();
|
|
183128
|
-
init_cartesian_chart_3d_geom();
|
|
183129
|
-
init_chart_3d_hosted_stage();
|
|
183130
|
-
init_chart_3d_hover_tooltip();
|
|
183131
|
-
init_chart_3d_label_projection();
|
|
183132
|
-
init_surface_chart_3d_walls();
|
|
183133
|
-
}
|
|
183134
|
-
});
|
|
183135
|
-
function buildCartesianChart3DHoverTooltip(hit, data) {
|
|
183136
|
-
if (!hit) {
|
|
183137
|
-
return void 0;
|
|
183138
|
-
}
|
|
183139
|
-
return buildMarkTooltip(
|
|
183140
|
-
data.seriesNames[hit.seriesIndex],
|
|
183141
|
-
data.categoryLabels[hit.categoryIndex],
|
|
183142
|
-
hit.value,
|
|
183143
|
-
data.numberFormats?.[hit.seriesIndex]
|
|
183144
|
-
);
|
|
183145
|
-
}
|
|
183146
|
-
var init_cartesian_chart_3d_hit_test = __esm2({
|
|
183147
|
-
"src/render/cartesian-chart-3d-hit-test.ts"() {
|
|
183148
|
-
init_chart_view_model();
|
|
183149
|
-
}
|
|
183150
|
-
});
|
|
183151
|
-
function calibrateCartesianChart3DDrag(markerPosition, value) {
|
|
183152
|
-
if (Math.abs(value) < 1e-9) {
|
|
183153
|
-
return null;
|
|
183154
|
-
}
|
|
183155
|
-
return {
|
|
183156
|
-
worldAtValue0: [markerPosition[0], 0, markerPosition[2]],
|
|
183157
|
-
value0: 0,
|
|
183158
|
-
worldAtValue1: markerPosition,
|
|
183159
|
-
value1: value
|
|
183160
|
-
};
|
|
183161
|
-
}
|
|
183162
|
-
var init_cartesian_chart_3d_drag = __esm2({
|
|
183163
|
-
"src/render/cartesian-chart-3d-drag.ts"() {
|
|
183164
|
-
}
|
|
183165
|
-
});
|
|
183166
|
-
function attachCartesianChart3DInteraction(params) {
|
|
183167
|
-
const highlightEntries = params.markerMeshes.map((mesh, i2) => {
|
|
183168
|
-
const hit = mesh.userData;
|
|
183169
|
-
return {
|
|
183170
|
-
mark: { seriesIndex: hit.seriesIndex, pointIndex: hit.categoryIndex },
|
|
183171
|
-
material: params.markerMaterials[i2]
|
|
183172
|
-
};
|
|
183173
|
-
});
|
|
183174
|
-
return attachChart3DPointerInteraction({
|
|
183175
|
-
three: params.three,
|
|
183176
|
-
canvas: params.canvas,
|
|
183177
|
-
camera: params.camera,
|
|
183178
|
-
width: params.width,
|
|
183179
|
-
height: params.height,
|
|
183180
|
-
meshes: params.markerMeshes,
|
|
183181
|
-
resolveHit: (intersection) => {
|
|
183182
|
-
const hit = intersection.object.userData;
|
|
183183
|
-
return chart3DHitToPartRef(
|
|
183184
|
-
hit ? { seriesIndex: hit.seriesIndex, pointIndex: hit.categoryIndex } : null
|
|
183185
|
-
);
|
|
183186
|
-
},
|
|
183187
|
-
calibrateDrag: (intersection) => {
|
|
183188
|
-
const hit = intersection.object.userData;
|
|
183189
|
-
const vertex = params.series[hit.seriesIndex]?.vertices.find(
|
|
183190
|
-
(v) => v.categoryIndex === hit.categoryIndex
|
|
183191
|
-
);
|
|
183192
|
-
return vertex ? calibrateCartesianChart3DDrag(vertex.position, hit.value) : null;
|
|
183193
|
-
},
|
|
183194
|
-
applyHighlight: (part) => applyChart3DMeshHighlight(highlightEntries, part),
|
|
183195
|
-
setControlsEnabled: (enabled) => {
|
|
183196
|
-
params.controls.enabled = enabled;
|
|
183197
|
-
},
|
|
183198
|
-
onSelect: params.interaction?.onSelect,
|
|
183199
|
-
onValueDragPreview: params.interaction?.onValueDragPreview,
|
|
183200
|
-
onValueDragCommit: params.interaction?.onValueDragCommit
|
|
183201
|
-
});
|
|
183202
|
-
}
|
|
183203
|
-
var init_cartesian_chart_3d_interaction_wiring = __esm2({
|
|
183204
|
-
"src/render/cartesian-chart-3d-interaction-wiring.ts"() {
|
|
183205
|
-
init_cartesian_chart_3d_drag();
|
|
183206
|
-
init_chart_3d_interaction();
|
|
183207
|
-
init_chart_3d_mesh_highlight();
|
|
183208
|
-
init_chart_3d_pointer_interaction();
|
|
183209
|
-
}
|
|
183210
|
-
});
|
|
183211
|
-
function createLineChart3DScene(ctx, options) {
|
|
183212
|
-
const placement = computeCartesianCameraPlacement(options.cols, options.rows, options.view3D);
|
|
183213
|
-
const stage = createHostedChart3DStage(
|
|
183214
|
-
ctx,
|
|
183215
|
-
placement,
|
|
183216
|
-
{ minDistance: 0.5, maxDistance: 30 },
|
|
183217
|
-
0.6
|
|
183218
|
-
);
|
|
183219
|
-
const { three, scene, camera, canvas, controls, width, height } = stage;
|
|
183220
|
-
const interaction = hostedChart3DInteraction(ctx);
|
|
183221
|
-
const extent = computeCartesianGridExtent(
|
|
183222
|
-
options.cols,
|
|
183223
|
-
options.rows,
|
|
183224
|
-
options.view3D?.depthPercent
|
|
183225
|
-
);
|
|
183226
|
-
const floorSize = Math.max(extent.gridWidth, extent.gridDepth) * 1.2;
|
|
183227
|
-
const gridFloor = new three.GridHelper(
|
|
183228
|
-
floorSize,
|
|
183229
|
-
Math.max(options.cols, options.rows),
|
|
183230
|
-
13421772,
|
|
183231
|
-
15263976
|
|
183232
|
-
);
|
|
183233
|
-
gridFloor.position.y = -0.02;
|
|
183234
|
-
scene.add(gridFloor);
|
|
183235
|
-
const walls = options.wallColors ? buildSurfaceWallMeshes(
|
|
183236
|
-
three,
|
|
183237
|
-
options.cols,
|
|
183238
|
-
options.rows,
|
|
183239
|
-
MAX_VALUE_HEIGHT,
|
|
183240
|
-
options.wallColors,
|
|
183241
|
-
extent
|
|
183242
|
-
) : null;
|
|
183243
|
-
for (const mesh of walls?.meshes ?? []) {
|
|
183244
|
-
scene.add(mesh);
|
|
183245
|
-
}
|
|
183246
|
-
const markerGeometry = new three.SphereGeometry(MARKER_RADIUS2, 8, 6);
|
|
183247
|
-
const tubeGeometries = [];
|
|
183248
|
-
const tubeMaterials = [];
|
|
183249
|
-
const markerMeshes = [];
|
|
183250
|
-
const markerMaterials = [];
|
|
183251
|
-
for (const path of options.series) {
|
|
183252
|
-
if (path.vertices.length >= 2) {
|
|
183253
|
-
const curve = new three.CatmullRomCurve3(
|
|
183254
|
-
path.vertices.map((v) => new three.Vector3(...v.position))
|
|
183255
|
-
);
|
|
183256
|
-
const tubeGeometry = new three.TubeGeometry(
|
|
183257
|
-
curve,
|
|
183258
|
-
Math.max(path.vertices.length * 8, 16),
|
|
183259
|
-
TUBE_RADIUS,
|
|
183260
|
-
8,
|
|
183261
|
-
false
|
|
183262
|
-
);
|
|
183263
|
-
const tubeMaterial = new three.MeshPhongMaterial({ color: path.color, shininess: 30 });
|
|
183264
|
-
const tube = new three.Mesh(tubeGeometry, tubeMaterial);
|
|
183265
|
-
scene.add(tube);
|
|
183266
|
-
tubeGeometries.push(tubeGeometry);
|
|
183267
|
-
tubeMaterials.push(tubeMaterial);
|
|
183268
|
-
}
|
|
183269
|
-
for (const v of path.vertices) {
|
|
183270
|
-
const markerMaterial = new three.MeshPhongMaterial({ color: path.color, shininess: 30 });
|
|
183271
|
-
const marker = new three.Mesh(markerGeometry, markerMaterial);
|
|
183272
|
-
marker.position.set(...v.position);
|
|
183273
|
-
marker.userData = {
|
|
183274
|
-
seriesIndex: v.seriesIndex,
|
|
183275
|
-
categoryIndex: v.categoryIndex,
|
|
183276
|
-
value: v.value
|
|
183277
|
-
};
|
|
183278
|
-
scene.add(marker);
|
|
183279
|
-
markerMeshes.push(marker);
|
|
183280
|
-
markerMaterials.push(markerMaterial);
|
|
183281
|
-
}
|
|
183282
|
-
}
|
|
183283
|
-
const tooltipData = {
|
|
183284
|
-
categoryLabels: options.categoryLabels,
|
|
183285
|
-
seriesNames: options.seriesNames,
|
|
183286
|
-
numberFormats: options.numberFormats
|
|
183287
|
-
};
|
|
183288
|
-
const hoverTooltip = attachChart3DHoverTooltip({
|
|
183289
|
-
three,
|
|
183290
|
-
canvas,
|
|
183291
|
-
camera,
|
|
183292
|
-
meshes: markerMeshes,
|
|
183293
|
-
buildTooltip: (intersection) => buildCartesianChart3DHoverTooltip(
|
|
183294
|
-
intersection?.object.userData,
|
|
183295
|
-
tooltipData
|
|
183296
|
-
)
|
|
183297
|
-
});
|
|
183298
|
-
const pointerInteraction = attachCartesianChart3DInteraction({
|
|
183299
|
-
three,
|
|
183300
|
-
canvas,
|
|
183301
|
-
camera,
|
|
183302
|
-
controls,
|
|
183303
|
-
width,
|
|
183304
|
-
height,
|
|
183305
|
-
markerMeshes,
|
|
183306
|
-
markerMaterials,
|
|
183307
|
-
series: options.series,
|
|
183308
|
-
interaction
|
|
183309
|
-
});
|
|
183310
|
-
const labels = buildCartesianChart3DLabels(
|
|
183311
|
-
options.cols,
|
|
183312
|
-
options.rows,
|
|
183313
|
-
options.categoryLabels,
|
|
183314
|
-
options.seriesNames,
|
|
183315
|
-
options.view3D?.depthPercent
|
|
183316
|
-
);
|
|
183317
|
-
const labelProjector = createChart3DLabelProjector(three, ctx.document, labels);
|
|
183318
|
-
labelProjector.applyTextStyle(options.textStyle);
|
|
183319
|
-
ctx.overlay.appendChild(labelProjector.layer);
|
|
183320
|
-
return finishHostedChart3DScene(
|
|
183321
|
-
ctx,
|
|
183322
|
-
stage,
|
|
183323
|
-
{
|
|
183324
|
-
afterRender: (cam, w, h2) => labelProjector.update(cam, w, h2),
|
|
183325
|
-
resize: (w, h2) => pointerInteraction.updateSize(w, h2),
|
|
183326
|
-
setSelectedPart: (part) => pointerInteraction.setSelectedPart(part),
|
|
183327
|
-
setTextStyle: (style) => labelProjector.applyTextStyle(style),
|
|
183328
|
-
dispose() {
|
|
183329
|
-
hoverTooltip.dispose();
|
|
183330
|
-
pointerInteraction.dispose();
|
|
183331
|
-
markerGeometry.dispose();
|
|
183332
|
-
for (const g2 of tubeGeometries) {
|
|
183333
|
-
g2.dispose();
|
|
183334
|
-
}
|
|
183335
|
-
for (const m of [...tubeMaterials, ...markerMaterials]) {
|
|
183336
|
-
m.dispose();
|
|
183337
|
-
}
|
|
183338
|
-
gridFloor.dispose();
|
|
183339
|
-
walls?.dispose();
|
|
183340
|
-
labelProjector.layer.remove();
|
|
183341
|
-
}
|
|
183342
|
-
},
|
|
183343
|
-
interaction
|
|
183344
|
-
);
|
|
183345
|
-
}
|
|
183346
|
-
var TUBE_RADIUS;
|
|
183347
|
-
var MARKER_RADIUS2;
|
|
183348
|
-
var init_line_chart_3d_scene = __esm2({
|
|
183349
|
-
"src/render/line-chart-3d-scene.ts"() {
|
|
183350
|
-
init_cartesian_chart_3d_geom();
|
|
183351
|
-
init_cartesian_chart_3d_hit_test();
|
|
183352
|
-
init_cartesian_chart_3d_interaction_wiring();
|
|
183353
|
-
init_chart_3d_hosted_stage();
|
|
183354
|
-
init_chart_3d_hover_tooltip();
|
|
183355
|
-
init_chart_3d_label_projection();
|
|
183356
|
-
init_surface_chart_3d_walls();
|
|
183357
|
-
TUBE_RADIUS = 0.025;
|
|
183358
|
-
MARKER_RADIUS2 = 0.045;
|
|
183359
|
-
}
|
|
183360
|
-
});
|
|
183361
|
-
function buildAreaRibbonGeometry(three, path) {
|
|
183362
|
-
const triangles = buildAreaRibbonTriangles(path);
|
|
183363
|
-
if (triangles.length === 0) {
|
|
183364
|
-
return null;
|
|
183365
|
-
}
|
|
183366
|
-
const geometry = new three.BufferGeometry();
|
|
183367
|
-
geometry.setAttribute("position", new three.Float32BufferAttribute(triangles, 3));
|
|
183368
|
-
geometry.computeVertexNormals();
|
|
183369
|
-
return geometry;
|
|
183370
|
-
}
|
|
183371
|
-
var init_area_chart_3d_ribbon_geometry = __esm2({
|
|
183372
|
-
"src/render/area-chart-3d-ribbon-geometry.ts"() {
|
|
183373
|
-
init_cartesian_line_chart_3d_layout();
|
|
183374
|
-
}
|
|
183375
|
-
});
|
|
183376
|
-
function createAreaChart3DScene(ctx, options) {
|
|
183377
|
-
const placement = computeCartesianCameraPlacement(options.cols, options.rows, options.view3D);
|
|
183378
|
-
const stage = createHostedChart3DStage(
|
|
183379
|
-
ctx,
|
|
183380
|
-
placement,
|
|
183381
|
-
{ minDistance: 0.5, maxDistance: 30 },
|
|
183382
|
-
0.6
|
|
183383
|
-
);
|
|
183384
|
-
const { three, scene, camera, canvas, controls, width, height } = stage;
|
|
183385
|
-
const interaction = hostedChart3DInteraction(ctx);
|
|
183386
|
-
const extent = computeCartesianGridExtent(
|
|
183387
|
-
options.cols,
|
|
183388
|
-
options.rows,
|
|
183389
|
-
options.view3D?.depthPercent
|
|
183390
|
-
);
|
|
183391
|
-
const floorSize = Math.max(extent.gridWidth, extent.gridDepth) * 1.2;
|
|
183392
|
-
const gridSegs = Math.max(options.cols, options.rows);
|
|
183393
|
-
const gridFloor = new three.GridHelper(floorSize, gridSegs, 13421772, 15263976);
|
|
183394
|
-
gridFloor.position.y = -0.02;
|
|
183395
|
-
scene.add(gridFloor);
|
|
183396
|
-
const walls = options.wallColors ? buildSurfaceWallMeshes(
|
|
183397
|
-
three,
|
|
183398
|
-
options.cols,
|
|
183399
|
-
options.rows,
|
|
183400
|
-
MAX_VALUE_HEIGHT,
|
|
183401
|
-
options.wallColors,
|
|
183402
|
-
extent
|
|
183403
|
-
) : null;
|
|
183404
|
-
for (const mesh of walls?.meshes ?? []) {
|
|
183405
|
-
scene.add(mesh);
|
|
183406
|
-
}
|
|
183407
|
-
const markerGeometry = new three.SphereGeometry(MARKER_RADIUS3, 8, 6);
|
|
183408
|
-
const tubeGeometries = [];
|
|
183409
|
-
const ribbonGeometries = [];
|
|
183410
|
-
const otherMaterials = [];
|
|
183411
|
-
const markerMeshes = [];
|
|
183412
|
-
const markerMaterials = [];
|
|
183413
|
-
for (const path of options.series) {
|
|
183414
|
-
const ribbonGeometry = buildAreaRibbonGeometry(three, path);
|
|
183415
|
-
if (ribbonGeometry) {
|
|
183416
|
-
const ribbonMaterial = new three.MeshPhongMaterial({
|
|
183417
|
-
color: path.color,
|
|
183418
|
-
side: three.DoubleSide,
|
|
183419
|
-
transparent: true,
|
|
183420
|
-
opacity: RIBBON_OPACITY,
|
|
183421
|
-
shininess: 10
|
|
183422
|
-
});
|
|
183423
|
-
scene.add(new three.Mesh(ribbonGeometry, ribbonMaterial));
|
|
183424
|
-
ribbonGeometries.push(ribbonGeometry);
|
|
183425
|
-
otherMaterials.push(ribbonMaterial);
|
|
183426
|
-
}
|
|
183427
|
-
if (path.vertices.length >= 2) {
|
|
183428
|
-
const curve = new three.CatmullRomCurve3(
|
|
183429
|
-
path.vertices.map((v) => new three.Vector3(...v.position))
|
|
183430
|
-
);
|
|
183431
|
-
const tubeGeometry = new three.TubeGeometry(
|
|
183432
|
-
curve,
|
|
183433
|
-
Math.max(path.vertices.length * 8, 16),
|
|
183434
|
-
TUBE_RADIUS2,
|
|
183435
|
-
8,
|
|
183436
|
-
false
|
|
183437
|
-
);
|
|
183438
|
-
const tubeMaterial = new three.MeshPhongMaterial({ color: path.color, shininess: 30 });
|
|
183439
|
-
scene.add(new three.Mesh(tubeGeometry, tubeMaterial));
|
|
183440
|
-
tubeGeometries.push(tubeGeometry);
|
|
183441
|
-
otherMaterials.push(tubeMaterial);
|
|
183442
|
-
}
|
|
183443
|
-
for (const v of path.vertices) {
|
|
183444
|
-
const markerMaterial = new three.MeshPhongMaterial({ color: path.color, shininess: 30 });
|
|
183445
|
-
const marker = new three.Mesh(markerGeometry, markerMaterial);
|
|
183446
|
-
marker.position.set(...v.position);
|
|
183447
|
-
marker.userData = {
|
|
183448
|
-
seriesIndex: v.seriesIndex,
|
|
183449
|
-
categoryIndex: v.categoryIndex,
|
|
183450
|
-
value: v.value
|
|
183451
|
-
};
|
|
183452
|
-
scene.add(marker);
|
|
183453
|
-
markerMeshes.push(marker);
|
|
183454
|
-
markerMaterials.push(markerMaterial);
|
|
183455
|
-
otherMaterials.push(markerMaterial);
|
|
183456
|
-
}
|
|
183457
|
-
}
|
|
183458
|
-
const tooltipData = {
|
|
183459
|
-
categoryLabels: options.categoryLabels,
|
|
183460
|
-
seriesNames: options.seriesNames,
|
|
183461
|
-
numberFormats: options.numberFormats
|
|
183462
|
-
};
|
|
183463
|
-
const hoverTooltip = attachChart3DHoverTooltip({
|
|
183464
|
-
three,
|
|
183465
|
-
canvas,
|
|
183466
|
-
camera,
|
|
183467
|
-
meshes: markerMeshes,
|
|
183468
|
-
buildTooltip: (intersection) => buildCartesianChart3DHoverTooltip(
|
|
183469
|
-
intersection?.object.userData,
|
|
183470
|
-
tooltipData
|
|
183471
|
-
)
|
|
183472
|
-
});
|
|
183473
|
-
const pointerInteraction = attachCartesianChart3DInteraction({
|
|
183474
|
-
three,
|
|
183475
|
-
canvas,
|
|
183476
|
-
camera,
|
|
183477
|
-
controls,
|
|
183478
|
-
width,
|
|
183479
|
-
height,
|
|
183480
|
-
markerMeshes,
|
|
183481
|
-
markerMaterials,
|
|
183482
|
-
series: options.series,
|
|
183483
|
-
interaction
|
|
183484
|
-
});
|
|
183485
|
-
const labels = buildCartesianChart3DLabels(
|
|
183486
|
-
options.cols,
|
|
183487
|
-
options.rows,
|
|
183488
|
-
options.categoryLabels,
|
|
183489
|
-
options.seriesNames,
|
|
183490
|
-
options.view3D?.depthPercent
|
|
183491
|
-
);
|
|
183492
|
-
const labelProjector = createChart3DLabelProjector(three, ctx.document, labels);
|
|
183493
|
-
labelProjector.applyTextStyle(options.textStyle);
|
|
183494
|
-
ctx.overlay.appendChild(labelProjector.layer);
|
|
183495
|
-
return finishHostedChart3DScene(
|
|
183496
|
-
ctx,
|
|
183497
|
-
stage,
|
|
183498
|
-
{
|
|
183499
|
-
afterRender: (cam, w, h2) => labelProjector.update(cam, w, h2),
|
|
183500
|
-
resize: (w, h2) => pointerInteraction.updateSize(w, h2),
|
|
183501
|
-
setSelectedPart: (part) => pointerInteraction.setSelectedPart(part),
|
|
183502
|
-
setTextStyle: (style) => labelProjector.applyTextStyle(style),
|
|
183503
|
-
dispose() {
|
|
183504
|
-
hoverTooltip.dispose();
|
|
183505
|
-
pointerInteraction.dispose();
|
|
183506
|
-
markerGeometry.dispose();
|
|
183507
|
-
for (const g2 of [...tubeGeometries, ...ribbonGeometries]) {
|
|
183508
|
-
g2.dispose();
|
|
183509
|
-
}
|
|
183510
|
-
for (const m of otherMaterials) {
|
|
183511
|
-
m.dispose();
|
|
183512
|
-
}
|
|
183513
|
-
gridFloor.dispose();
|
|
183514
|
-
walls?.dispose();
|
|
183515
|
-
labelProjector.layer.remove();
|
|
183516
|
-
}
|
|
183517
|
-
},
|
|
183518
|
-
interaction
|
|
183519
|
-
);
|
|
183520
|
-
}
|
|
183521
|
-
var TUBE_RADIUS2;
|
|
183522
|
-
var MARKER_RADIUS3;
|
|
183523
|
-
var RIBBON_OPACITY;
|
|
183524
|
-
var init_area_chart_3d_scene = __esm2({
|
|
183525
|
-
"src/render/area-chart-3d-scene.ts"() {
|
|
183526
|
-
init_area_chart_3d_ribbon_geometry();
|
|
183527
|
-
init_cartesian_chart_3d_geom();
|
|
183528
|
-
init_cartesian_chart_3d_hit_test();
|
|
183529
|
-
init_cartesian_chart_3d_interaction_wiring();
|
|
183530
|
-
init_chart_3d_hosted_stage();
|
|
183531
|
-
init_chart_3d_hover_tooltip();
|
|
183532
|
-
init_chart_3d_label_projection();
|
|
183533
|
-
init_surface_chart_3d_walls();
|
|
183534
|
-
TUBE_RADIUS2 = 0.02;
|
|
183535
|
-
MARKER_RADIUS3 = 0.045;
|
|
183536
|
-
RIBBON_OPACITY = 0.75;
|
|
183537
|
-
}
|
|
183538
|
-
});
|
|
183539
|
-
function buildPieChart3DHoverTooltip(hit, data) {
|
|
183540
|
-
if (!hit) {
|
|
183541
|
-
return void 0;
|
|
183542
|
-
}
|
|
183543
|
-
return buildMarkTooltip(
|
|
183544
|
-
data.seriesName,
|
|
183545
|
-
data.categoryLabels[hit.pointIndex],
|
|
183546
|
-
hit.value,
|
|
183547
|
-
data.numberFormat
|
|
183548
|
-
);
|
|
183549
|
-
}
|
|
183550
|
-
var init_pie_chart_3d_hit_test = __esm2({
|
|
183551
|
-
"src/render/pie-chart-3d-hit-test.ts"() {
|
|
183552
|
-
init_chart_view_model();
|
|
183553
|
-
}
|
|
183554
|
-
});
|
|
183555
|
-
function pieChart3DPointerAngle(x, z) {
|
|
183556
|
-
return Math.atan2(x, z);
|
|
183557
|
-
}
|
|
183558
|
-
function resolvePieChart3DDragValue(geometry, pointerAngle) {
|
|
183559
|
-
return resolvePieSliceShareValue(
|
|
183560
|
-
pointerAngle,
|
|
183561
|
-
geometry.leadingAngle,
|
|
183562
|
-
geometry.values,
|
|
183563
|
-
geometry.pointIndex
|
|
183564
|
-
);
|
|
183565
|
-
}
|
|
183566
|
-
var init_pie_chart_3d_drag = __esm2({
|
|
183567
|
-
"src/render/pie-chart-3d-drag.ts"() {
|
|
183568
|
-
init_chart_interaction_pie();
|
|
183569
|
-
}
|
|
183570
|
-
});
|
|
183571
|
-
function attachPieChart3DInteraction(params) {
|
|
183572
|
-
const raycaster = new params.three.Raycaster();
|
|
183573
|
-
const ndc = new params.three.Vector2();
|
|
183574
|
-
const plane = new params.three.Plane(new params.three.Vector3(0, 1, 0), 0);
|
|
183575
|
-
const planeHit = new params.three.Vector3();
|
|
183576
|
-
let dragState = null;
|
|
183577
|
-
const highlightEntries = params.wedgeMeshes.map((mesh, i2) => {
|
|
183578
|
-
const hit = mesh.userData;
|
|
183579
|
-
return {
|
|
183580
|
-
mark: { seriesIndex: 0, pointIndex: hit.pointIndex },
|
|
183581
|
-
material: params.wedgeMaterials[i2]
|
|
183582
|
-
};
|
|
183583
|
-
});
|
|
183584
|
-
function setNdc(clientX, clientY) {
|
|
183585
|
-
const rect22 = params.canvas.getBoundingClientRect();
|
|
183586
|
-
if (rect22.width <= 0 || rect22.height <= 0) {
|
|
183587
|
-
return false;
|
|
183588
|
-
}
|
|
183589
|
-
ndc.x = (clientX - rect22.left) / rect22.width * 2 - 1;
|
|
183590
|
-
ndc.y = -((clientY - rect22.top) / rect22.height) * 2 + 1;
|
|
183591
|
-
return true;
|
|
183592
|
-
}
|
|
183593
|
-
function raycastWedge(clientX, clientY) {
|
|
183594
|
-
if (!setNdc(clientX, clientY)) {
|
|
183595
|
-
return void 0;
|
|
183596
|
-
}
|
|
183597
|
-
raycaster.setFromCamera(ndc, params.camera);
|
|
183598
|
-
return raycaster.intersectObjects(params.wedgeMeshes, false)[0];
|
|
183599
|
-
}
|
|
183600
|
-
function planeAngleAt(clientX, clientY) {
|
|
183601
|
-
if (!setNdc(clientX, clientY)) {
|
|
183602
|
-
return null;
|
|
183603
|
-
}
|
|
183604
|
-
raycaster.setFromCamera(ndc, params.camera);
|
|
183605
|
-
const hit = raycaster.ray.intersectPlane(plane, planeHit);
|
|
183606
|
-
return hit ? pieChart3DPointerAngle(hit.x, hit.z) : null;
|
|
183607
|
-
}
|
|
183608
|
-
function setSelectedPart(part) {
|
|
183609
|
-
applyChart3DMeshHighlight(highlightEntries, part);
|
|
183610
|
-
}
|
|
183611
|
-
function travelBelowThreshold(clientX, clientY, state) {
|
|
183612
|
-
const dx = clientX - state.startClientX;
|
|
183613
|
-
const dy = clientY - state.startClientY;
|
|
183614
|
-
return Math.hypot(dx, dy) < CHART_3D_DRAG_THRESHOLD_PX;
|
|
183615
|
-
}
|
|
183616
|
-
const onPointerDown = (event) => {
|
|
183617
|
-
params.canvas.setPointerCapture?.(
|
|
183618
|
-
event.pointerId
|
|
183619
|
-
);
|
|
183620
|
-
const hit = raycastWedge(event.clientX, event.clientY);
|
|
183621
|
-
const hitData = hit?.object.userData;
|
|
183622
|
-
const part = chart3DHitToPartRef(
|
|
183623
|
-
hitData ? { seriesIndex: 0, pointIndex: hitData.pointIndex } : null
|
|
183624
|
-
);
|
|
183625
|
-
const armed = part !== null && isChartInteractionArmed(params.canvas);
|
|
183626
|
-
if (armed) {
|
|
183627
|
-
event.stopPropagation();
|
|
183628
|
-
}
|
|
183629
|
-
let geometry = null;
|
|
183630
|
-
if (part && hitData && armed) {
|
|
183631
|
-
const wedges = params.getWedges();
|
|
183632
|
-
const wedge = wedges.find((w) => w.pointIndex === hitData.pointIndex);
|
|
183633
|
-
if (wedge) {
|
|
183634
|
-
geometry = {
|
|
183635
|
-
values: wedges.map((w) => w.value),
|
|
183636
|
-
pointIndex: hitData.pointIndex,
|
|
183637
|
-
leadingAngle: wedge.startAngle
|
|
183638
|
-
};
|
|
183639
|
-
}
|
|
183640
|
-
}
|
|
183641
|
-
dragState = {
|
|
183642
|
-
part,
|
|
183643
|
-
geometry,
|
|
183644
|
-
moved: false,
|
|
183645
|
-
startClientX: event.clientX,
|
|
183646
|
-
startClientY: event.clientY,
|
|
183647
|
-
lastAngle: null
|
|
183648
|
-
};
|
|
183649
|
-
if (geometry) {
|
|
183650
|
-
event.preventDefault();
|
|
183651
|
-
params.controls.enabled = false;
|
|
183652
|
-
}
|
|
183653
|
-
};
|
|
183654
|
-
const onPointerMove = (event) => {
|
|
183655
|
-
const state = dragState;
|
|
183656
|
-
if (!state || !state.part || !state.geometry) {
|
|
183657
|
-
return;
|
|
183658
|
-
}
|
|
183659
|
-
if (!state.moved && travelBelowThreshold(event.clientX, event.clientY, state)) {
|
|
183660
|
-
return;
|
|
183661
|
-
}
|
|
183662
|
-
state.moved = true;
|
|
183663
|
-
const angle = planeAngleAt(event.clientX, event.clientY);
|
|
183664
|
-
if (angle === null) {
|
|
183665
|
-
return;
|
|
183666
|
-
}
|
|
183667
|
-
state.lastAngle = angle;
|
|
183668
|
-
const value = resolvePieChart3DDragValue(state.geometry, angle);
|
|
183669
|
-
params.interaction?.onValueDragPreview?.(state.part, value);
|
|
183670
|
-
};
|
|
183671
|
-
const onPointerUp = (event) => {
|
|
183672
|
-
if (!dragState) {
|
|
183673
|
-
return;
|
|
183674
|
-
}
|
|
183675
|
-
const state = dragState;
|
|
183676
|
-
dragState = null;
|
|
183677
|
-
params.canvas.releasePointerCapture?.(event.pointerId);
|
|
183678
|
-
if (state.geometry) {
|
|
183679
|
-
params.controls.enabled = true;
|
|
183680
|
-
}
|
|
183681
|
-
if (state.moved && state.part && state.geometry) {
|
|
183682
|
-
const angle = planeAngleAt(event.clientX, event.clientY) ?? state.lastAngle;
|
|
183683
|
-
if (angle !== null) {
|
|
183684
|
-
const value = resolvePieChart3DDragValue(state.geometry, angle);
|
|
183685
|
-
params.interaction?.onValueDragCommit?.(state.part, value);
|
|
183686
|
-
}
|
|
183687
|
-
return;
|
|
183688
|
-
}
|
|
183689
|
-
setSelectedPart(state.part);
|
|
183690
|
-
params.interaction?.onSelect?.(state.part);
|
|
183691
|
-
};
|
|
183692
|
-
params.canvas.addEventListener("pointerdown", onPointerDown);
|
|
183693
|
-
params.canvas.addEventListener("pointermove", onPointerMove);
|
|
183694
|
-
params.canvas.addEventListener("pointerup", onPointerUp);
|
|
183695
|
-
params.canvas.addEventListener("pointercancel", onPointerUp);
|
|
183696
|
-
return {
|
|
183697
|
-
setSelectedPart,
|
|
183698
|
-
dispose() {
|
|
183699
|
-
params.canvas.removeEventListener("pointerdown", onPointerDown);
|
|
183700
|
-
params.canvas.removeEventListener("pointermove", onPointerMove);
|
|
183701
|
-
params.canvas.removeEventListener("pointerup", onPointerUp);
|
|
183702
|
-
params.canvas.removeEventListener("pointercancel", onPointerUp);
|
|
183703
|
-
}
|
|
183704
|
-
};
|
|
183705
|
-
}
|
|
183706
|
-
var init_pie_chart_3d_interaction_wiring = __esm2({
|
|
183707
|
-
"src/render/pie-chart-3d-interaction-wiring.ts"() {
|
|
183708
|
-
init_chart_3d_interaction();
|
|
183709
|
-
init_chart_3d_mesh_highlight();
|
|
183710
|
-
init_chart_canvas_drag();
|
|
183711
|
-
init_pie_chart_3d_drag();
|
|
183712
|
-
}
|
|
183713
|
-
});
|
|
183714
|
-
function wedgeSegments(thetaLength) {
|
|
183715
|
-
return Math.max(
|
|
183716
|
-
MIN_RADIAL_SEGMENTS,
|
|
183717
|
-
Math.round(thetaLength / (Math.PI * 2) * FULL_CIRCLE_SEGMENTS)
|
|
183718
|
-
);
|
|
183719
|
-
}
|
|
183720
|
-
function buildPieChart3DWedgeMeshes(three, scene, wedges, outerRadius, thickness) {
|
|
183721
|
-
const meshes = [];
|
|
183722
|
-
const geometries = [];
|
|
183723
|
-
const materials = [];
|
|
183724
|
-
for (const wedge of wedges) {
|
|
183725
|
-
const geometry = new three.CylinderGeometry(
|
|
183726
|
-
outerRadius,
|
|
183727
|
-
outerRadius,
|
|
183728
|
-
thickness,
|
|
183729
|
-
wedgeSegments(wedge.thetaLength),
|
|
183730
|
-
1,
|
|
183731
|
-
false,
|
|
183732
|
-
wedge.startAngle,
|
|
183733
|
-
wedge.thetaLength
|
|
183734
|
-
);
|
|
183735
|
-
const material = new three.MeshPhongMaterial({ color: wedge.color, shininess: 30 });
|
|
183736
|
-
const mesh = new three.Mesh(geometry, material);
|
|
183737
|
-
mesh.position.set(wedge.explodeOffset[0], 0, wedge.explodeOffset[1]);
|
|
183738
|
-
mesh.userData = { pointIndex: wedge.pointIndex, value: wedge.value };
|
|
183739
|
-
scene.add(mesh);
|
|
183740
|
-
meshes.push(mesh);
|
|
183741
|
-
geometries.push(geometry);
|
|
183742
|
-
materials.push(material);
|
|
183743
|
-
}
|
|
183744
|
-
return { meshes, geometries, materials };
|
|
183745
|
-
}
|
|
183746
|
-
function applyPieChart3DWedgeAngles(three, meshes, geometries, outerRadius, thickness, angles) {
|
|
183747
|
-
for (const angle of angles) {
|
|
183748
|
-
const mesh = meshes[angle.pointIndex];
|
|
183749
|
-
const oldGeometry = geometries[angle.pointIndex];
|
|
183750
|
-
if (!mesh || !oldGeometry) {
|
|
183751
|
-
continue;
|
|
183752
|
-
}
|
|
183753
|
-
const geometry = new three.CylinderGeometry(
|
|
183754
|
-
outerRadius,
|
|
183755
|
-
outerRadius,
|
|
183756
|
-
thickness,
|
|
183757
|
-
wedgeSegments(angle.thetaLength),
|
|
183758
|
-
1,
|
|
183759
|
-
false,
|
|
183760
|
-
angle.startAngle,
|
|
183761
|
-
angle.thetaLength
|
|
183762
|
-
);
|
|
183763
|
-
mesh.geometry = geometry;
|
|
183764
|
-
oldGeometry.dispose();
|
|
183765
|
-
geometries[angle.pointIndex] = geometry;
|
|
183766
|
-
mesh.position.set(angle.explodeOffset[0], 0, angle.explodeOffset[1]);
|
|
183767
|
-
mesh.userData = { pointIndex: angle.pointIndex, value: angle.value };
|
|
183768
|
-
}
|
|
183769
|
-
}
|
|
183770
|
-
var MIN_RADIAL_SEGMENTS;
|
|
183771
|
-
var FULL_CIRCLE_SEGMENTS;
|
|
183772
|
-
var init_pie_chart_3d_mesh = __esm2({
|
|
183773
|
-
"src/render/pie-chart-3d-mesh.ts"() {
|
|
183774
|
-
MIN_RADIAL_SEGMENTS = 3;
|
|
183775
|
-
FULL_CIRCLE_SEGMENTS = 64;
|
|
183776
|
-
}
|
|
183777
|
-
});
|
|
183778
|
-
function createPieChart3DScene(ctx, options) {
|
|
183779
|
-
const placement = computePieChart3DCameraPlacement(options.view3D);
|
|
183780
|
-
const stage = createHostedChart3DStage(
|
|
183781
|
-
ctx,
|
|
183782
|
-
placement,
|
|
183783
|
-
{ minDistance: 0.5, maxDistance: 30 },
|
|
183784
|
-
0.65
|
|
183785
|
-
);
|
|
183786
|
-
const { three, scene, camera, canvas, controls } = stage;
|
|
183787
|
-
const interaction = hostedChart3DInteraction(ctx);
|
|
183788
|
-
const {
|
|
183789
|
-
meshes: wedgeMeshes,
|
|
183790
|
-
geometries: wedgeGeometries,
|
|
183791
|
-
materials: wedgeMaterials
|
|
183792
|
-
} = buildPieChart3DWedgeMeshes(
|
|
183793
|
-
three,
|
|
183794
|
-
scene,
|
|
183795
|
-
options.wedges,
|
|
183796
|
-
options.outerRadius,
|
|
183797
|
-
options.thickness
|
|
183798
|
-
);
|
|
183799
|
-
const hoverTooltip = attachChart3DHoverTooltip({
|
|
183800
|
-
three,
|
|
183801
|
-
canvas,
|
|
183802
|
-
camera,
|
|
183803
|
-
meshes: wedgeMeshes,
|
|
183804
|
-
buildTooltip: (intersection) => buildPieChart3DHoverTooltip(intersection?.object.userData, {
|
|
183805
|
-
categoryLabels: options.categoryLabels,
|
|
183806
|
-
seriesName: options.seriesName,
|
|
183807
|
-
numberFormat: options.numberFormat
|
|
183808
|
-
})
|
|
183809
|
-
});
|
|
183810
|
-
let currentAngles = options.wedges;
|
|
183811
|
-
let liveValues = options.values.slice();
|
|
183812
|
-
function recomputeLiveAngles() {
|
|
183813
|
-
const angles = computePieChart3DSliceAngles(
|
|
183814
|
-
liveValues,
|
|
183815
|
-
options.explosions,
|
|
183816
|
-
options.firstSliceAngleDeg,
|
|
183817
|
-
options.outerRadius
|
|
183818
|
-
);
|
|
183819
|
-
currentAngles = angles;
|
|
183820
|
-
applyPieChart3DWedgeAngles(
|
|
183821
|
-
three,
|
|
183822
|
-
wedgeMeshes,
|
|
183823
|
-
wedgeGeometries,
|
|
183824
|
-
options.outerRadius,
|
|
183825
|
-
options.thickness,
|
|
183826
|
-
angles
|
|
183827
|
-
);
|
|
183828
|
-
}
|
|
183829
|
-
const pointerInteraction = attachPieChart3DInteraction({
|
|
183830
|
-
three,
|
|
183831
|
-
canvas,
|
|
183832
|
-
camera,
|
|
183833
|
-
controls,
|
|
183834
|
-
wedgeMeshes,
|
|
183835
|
-
wedgeMaterials,
|
|
183836
|
-
getWedges: () => currentAngles,
|
|
183837
|
-
interaction: {
|
|
183838
|
-
onSelect: interaction?.onSelect,
|
|
183839
|
-
onValueDragPreview: (part, value) => {
|
|
183840
|
-
if (part.pointIndex !== void 0) {
|
|
183841
|
-
liveValues = liveValues.map((v, i2) => i2 === part.pointIndex ? value : v);
|
|
183842
|
-
recomputeLiveAngles();
|
|
183843
|
-
}
|
|
183844
|
-
interaction?.onValueDragPreview?.(part, value);
|
|
183845
|
-
},
|
|
183846
|
-
onValueDragCommit: (part, value) => {
|
|
183847
|
-
if (part.pointIndex !== void 0) {
|
|
183848
|
-
liveValues = liveValues.map((v, i2) => i2 === part.pointIndex ? value : v);
|
|
183849
|
-
recomputeLiveAngles();
|
|
183850
|
-
}
|
|
183851
|
-
interaction?.onValueDragCommit?.(part, value);
|
|
183852
|
-
}
|
|
183853
|
-
}
|
|
183854
|
-
});
|
|
183855
|
-
return finishHostedChart3DScene(
|
|
183856
|
-
ctx,
|
|
183857
|
-
stage,
|
|
183858
|
-
{
|
|
183859
|
-
// No `resize`: this scene's own wiring re-derives the pointer's NDC
|
|
183860
|
-
// position from `canvas.getBoundingClientRect()` on every raycast.
|
|
183861
|
-
setSelectedPart: (part) => pointerInteraction.setSelectedPart(part),
|
|
183862
|
-
dispose() {
|
|
183863
|
-
hoverTooltip.dispose();
|
|
183864
|
-
pointerInteraction.dispose();
|
|
183865
|
-
for (const g2 of wedgeGeometries) {
|
|
183866
|
-
g2.dispose();
|
|
183867
|
-
}
|
|
183868
|
-
for (const m of wedgeMaterials) {
|
|
183869
|
-
m.dispose();
|
|
183870
|
-
}
|
|
183871
|
-
}
|
|
183872
|
-
},
|
|
183873
|
-
interaction
|
|
183874
|
-
);
|
|
183875
|
-
}
|
|
183876
|
-
var init_pie_chart_3d_scene = __esm2({
|
|
183877
|
-
"src/render/pie-chart-3d-scene.ts"() {
|
|
183878
|
-
init_chart_3d_hosted_stage();
|
|
183879
|
-
init_chart_3d_hover_tooltip();
|
|
183880
|
-
init_pie_chart_3d_geom();
|
|
183881
|
-
init_pie_chart_3d_hit_test();
|
|
183882
|
-
init_pie_chart_3d_interaction_wiring();
|
|
183883
|
-
init_pie_chart_3d_mesh();
|
|
183884
|
-
}
|
|
183885
|
-
});
|
|
183886
181566
|
function createRenderer(three, state) {
|
|
183887
181567
|
try {
|
|
183888
181568
|
const renderer = new three.WebGLRenderer({
|
|
@@ -184130,7 +181810,7 @@ function buildObliqueShapeGeometry(three, bar, horizontal) {
|
|
|
184130
181810
|
0.5 * bar.taper.top,
|
|
184131
181811
|
0.5 * bar.taper.bottom,
|
|
184132
181812
|
1,
|
|
184133
|
-
|
|
181813
|
+
ROUND_SEGMENTS
|
|
184134
181814
|
);
|
|
184135
181815
|
}
|
|
184136
181816
|
if (horizontal) {
|
|
@@ -184171,11 +181851,11 @@ function shadeObliqueShapeGeometry(three, geometry, bar, scale2, viewYaw) {
|
|
|
184171
181851
|
}
|
|
184172
181852
|
colors.needsUpdate = true;
|
|
184173
181853
|
}
|
|
184174
|
-
var
|
|
181854
|
+
var ROUND_SEGMENTS;
|
|
184175
181855
|
var init_chart_3d_oblique_shape_mesh = __esm2({
|
|
184176
181856
|
"src/render/chart-3d-oblique-shape-mesh.ts"() {
|
|
184177
181857
|
init_chart_3d_shading();
|
|
184178
|
-
|
|
181858
|
+
ROUND_SEGMENTS = 48;
|
|
184179
181859
|
}
|
|
184180
181860
|
});
|
|
184181
181861
|
function obliqueToScene(layout, svgWidth, svgHeight, p) {
|
|
@@ -184381,6 +182061,12 @@ var init_chart_3d_chrome_overlay = __esm2({
|
|
|
184381
182061
|
OBLIQUE_LEGEND_BASELINE = 14 * PT6;
|
|
184382
182062
|
}
|
|
184383
182063
|
});
|
|
182064
|
+
var CHART_3D_DRAG_THRESHOLD_PX;
|
|
182065
|
+
var init_chart_3d_interaction = __esm2({
|
|
182066
|
+
"src/render/chart-3d-interaction.ts"() {
|
|
182067
|
+
CHART_3D_DRAG_THRESHOLD_PX = 3;
|
|
182068
|
+
}
|
|
182069
|
+
});
|
|
184384
182070
|
function partOf(point) {
|
|
184385
182071
|
return point ? { role: "dataPoint", seriesIndex: point.seriesIndex, pointIndex: point.pointIndex } : null;
|
|
184386
182072
|
}
|
|
@@ -184536,9 +182222,9 @@ function obliqueDragValue(layout, startValue, dx, dy) {
|
|
|
184536
182222
|
function obliqueDraggedExtent(layout, value) {
|
|
184537
182223
|
const { min, max } = layout.range;
|
|
184538
182224
|
const base = Math.min(Math.max(0, min), max);
|
|
184539
|
-
const
|
|
184540
|
-
const lo = (
|
|
184541
|
-
const hi = (
|
|
182225
|
+
const clamp12 = (v) => Math.min(Math.max(v, min), max);
|
|
182226
|
+
const lo = (clamp12(Math.min(base, value)) - min) * layout.valueScale;
|
|
182227
|
+
const hi = (clamp12(Math.max(base, value)) - min) * layout.valueScale;
|
|
184542
182228
|
return { from: lo, length: hi - lo };
|
|
184543
182229
|
}
|
|
184544
182230
|
function obliqueBarAtValue(layout, bar, value) {
|
|
@@ -184678,6 +182364,7 @@ function buildPerspBarPrisms(chartData, layout, override) {
|
|
|
184678
182364
|
neg = to;
|
|
184679
182365
|
}
|
|
184680
182366
|
}
|
|
182367
|
+
const shape = chartData.series[s]?.shape ?? chartData.barShape ?? "box";
|
|
184681
182368
|
const slotIndex = layout.grouping === "clustered" ? s : 0;
|
|
184682
182369
|
const row = layout.grouping === "standard" ? s : 0;
|
|
184683
182370
|
const c0 = c * slot + gapWidth * barW / 2 + slotIndex * barW;
|
|
@@ -184696,7 +182383,16 @@ function buildPerspBarPrisms(chartData, layout, override) {
|
|
|
184696
182383
|
[x0, y1]
|
|
184697
182384
|
],
|
|
184698
182385
|
z0,
|
|
184699
|
-
z1: z0 + depth
|
|
182386
|
+
z1: z0 + depth,
|
|
182387
|
+
shape,
|
|
182388
|
+
taper: obliqueBarTaper(
|
|
182389
|
+
shape,
|
|
182390
|
+
v0,
|
|
182391
|
+
v1,
|
|
182392
|
+
(layout.range.max - layout.range.min) * layout.valueScale,
|
|
182393
|
+
raw
|
|
182394
|
+
),
|
|
182395
|
+
horizontal: layout.horizontal
|
|
184700
182396
|
});
|
|
184701
182397
|
}
|
|
184702
182398
|
}
|
|
@@ -184705,6 +182401,7 @@ function buildPerspBarPrisms(chartData, layout, override) {
|
|
|
184705
182401
|
var DEFAULT_GAP_WIDTH2;
|
|
184706
182402
|
var init_chart_3d_persp_bars = __esm2({
|
|
184707
182403
|
"src/render/chart-3d-persp-bars.ts"() {
|
|
182404
|
+
init_chart_3d_oblique_bars();
|
|
184708
182405
|
DEFAULT_GAP_WIDTH2 = 150;
|
|
184709
182406
|
}
|
|
184710
182407
|
});
|
|
@@ -184796,6 +182493,55 @@ var init_chart_3d_persp_marks = __esm2({
|
|
|
184796
182493
|
RIBBON_THICKNESS = 0.012;
|
|
184797
182494
|
}
|
|
184798
182495
|
});
|
|
182496
|
+
function isShapedPerspPrism(prism) {
|
|
182497
|
+
return prism.shape !== void 0 && prism.shape !== "box";
|
|
182498
|
+
}
|
|
182499
|
+
function outlineBounds2(prism) {
|
|
182500
|
+
const xs = prism.outline.map(([x]) => x);
|
|
182501
|
+
const ys = prism.outline.map(([, y]) => y);
|
|
182502
|
+
return [Math.min(...xs), Math.max(...xs), Math.min(...ys), Math.max(...ys)];
|
|
182503
|
+
}
|
|
182504
|
+
function buildShapedPrismGeometry(three, prism) {
|
|
182505
|
+
const shape = prism.shape ?? "box";
|
|
182506
|
+
const unit2 = buildObliqueShapeGeometry(
|
|
182507
|
+
three,
|
|
182508
|
+
{ shape, taper: prism.taper ?? { bottom: 1, top: 1 } },
|
|
182509
|
+
Boolean(prism.horizontal)
|
|
182510
|
+
);
|
|
182511
|
+
const geometry = unit2.index ? unit2.toNonIndexed() : unit2;
|
|
182512
|
+
if (geometry !== unit2) {
|
|
182513
|
+
unit2.dispose();
|
|
182514
|
+
}
|
|
182515
|
+
const [x0, x1, y0, y1] = outlineBounds2(prism);
|
|
182516
|
+
const sx = Math.max(x1 - x0, 1e-6);
|
|
182517
|
+
const sy = Math.max(y1 - y0, 1e-6);
|
|
182518
|
+
const sz = Math.max(prism.z1 - prism.z0, 1e-6);
|
|
182519
|
+
geometry.scale(sx, sy, sz);
|
|
182520
|
+
geometry.translate((x0 + x1) / 2, (y0 + y1) / 2, (prism.z0 + prism.z1) / 2);
|
|
182521
|
+
geometry.computeVertexNormals();
|
|
182522
|
+
const normals = geometry.getAttribute("normal");
|
|
182523
|
+
const colors = new Float32Array(normals.count * 3);
|
|
182524
|
+
const base = new three.Color(prism.color).getRGB(new three.Color(), three.SRGBColorSpace);
|
|
182525
|
+
const out = new three.Color();
|
|
182526
|
+
for (let i2 = 0; i2 < normals.count; i2++) {
|
|
182527
|
+
const f6 = chart3DNormalShade(shape, normals.getX(i2), normals.getY(i2), -normals.getZ(i2));
|
|
182528
|
+
out.setRGB(
|
|
182529
|
+
Math.min(1, base.r * f6),
|
|
182530
|
+
Math.min(1, base.g * f6),
|
|
182531
|
+
Math.min(1, base.b * f6),
|
|
182532
|
+
three.SRGBColorSpace
|
|
182533
|
+
);
|
|
182534
|
+
colors.set([out.r, out.g, out.b], i2 * 3);
|
|
182535
|
+
}
|
|
182536
|
+
geometry.setAttribute("color", new three.Float32BufferAttribute(colors, 3));
|
|
182537
|
+
return geometry;
|
|
182538
|
+
}
|
|
182539
|
+
var init_chart_3d_persp_shape_mesh = __esm2({
|
|
182540
|
+
"src/render/chart-3d-persp-shape-mesh.ts"() {
|
|
182541
|
+
init_chart_3d_oblique_shape_mesh();
|
|
182542
|
+
init_chart_3d_shading();
|
|
182543
|
+
}
|
|
182544
|
+
});
|
|
184799
182545
|
function shadePerspGeometry(three, geometry, color2) {
|
|
184800
182546
|
const normals = geometry.getAttribute("normal");
|
|
184801
182547
|
const colors = new Float32Array(normals.count * 3);
|
|
@@ -184816,6 +182562,9 @@ function shadePerspGeometry(three, geometry, color2) {
|
|
|
184816
182562
|
geometry.setAttribute("color", new three.Float32BufferAttribute(colors, 3));
|
|
184817
182563
|
}
|
|
184818
182564
|
function buildPrismGeometry(three, prism) {
|
|
182565
|
+
if (isShapedPerspPrism(prism)) {
|
|
182566
|
+
return buildShapedPrismGeometry(three, prism);
|
|
182567
|
+
}
|
|
184819
182568
|
const shape = new three.Shape(prism.outline.map(([x, y]) => new three.Vector2(x, y)));
|
|
184820
182569
|
const extruded = new three.ExtrudeGeometry(shape, {
|
|
184821
182570
|
depth: Math.max(prism.z1 - prism.z0, 1e-6),
|
|
@@ -184878,6 +182627,7 @@ function buildPerspMeshes(three, layout, prisms) {
|
|
|
184878
182627
|
var GRIDLINE_COLOR5;
|
|
184879
182628
|
var init_chart_3d_persp_mesh = __esm2({
|
|
184880
182629
|
"src/render/chart-3d-persp-mesh.ts"() {
|
|
182630
|
+
init_chart_3d_persp_shape_mesh();
|
|
184881
182631
|
init_chart_3d_persp_view();
|
|
184882
182632
|
init_chart_3d_shading();
|
|
184883
182633
|
GRIDLINE_COLOR5 = 14277081;
|
|
@@ -185655,24 +183405,6 @@ function buildObliqueCamera(three, svgWidth, svgHeight, shearX, shearY) {
|
|
|
185655
183405
|
camera.projectionMatrixInverse.copy(camera.projectionMatrix).invert();
|
|
185656
183406
|
return camera;
|
|
185657
183407
|
}
|
|
185658
|
-
function mountPerspectiveScene(perspective2, ctx) {
|
|
185659
|
-
switch (perspective2.kind) {
|
|
185660
|
-
case "bar":
|
|
185661
|
-
return createBarChart3DScene(ctx, perspective2.options);
|
|
185662
|
-
case "line":
|
|
185663
|
-
return createLineChart3DScene(ctx, perspective2.options);
|
|
185664
|
-
case "area":
|
|
185665
|
-
return createAreaChart3DScene(ctx, perspective2.options);
|
|
185666
|
-
case "pie":
|
|
185667
|
-
return createPieChart3DScene(ctx, perspective2.options);
|
|
185668
|
-
case "surface":
|
|
185669
|
-
return createSurfaceChart3DScene(ctx, perspective2.options);
|
|
185670
|
-
default: {
|
|
185671
|
-
const exhaustive2 = perspective2;
|
|
185672
|
-
return exhaustive2;
|
|
185673
|
-
}
|
|
185674
|
-
}
|
|
185675
|
-
}
|
|
185676
183408
|
async function mountChart3DView(spec2, ctx) {
|
|
185677
183409
|
if (spec2.geometry?.kind === "pie") {
|
|
185678
183410
|
const chartData2 = spec2.element.chartData;
|
|
@@ -185701,9 +183433,6 @@ async function mountChart3DView(spec2, ctx) {
|
|
|
185701
183433
|
);
|
|
185702
183434
|
}
|
|
185703
183435
|
if (spec2.projection.mode !== "oblique" || spec2.geometry?.kind !== "oblique") {
|
|
185704
|
-
if (spec2.perspective) {
|
|
185705
|
-
return mountPerspectiveScene(spec2.perspective, ctx);
|
|
185706
|
-
}
|
|
185707
183436
|
throw new Error(`no 3D chart scene for chartType=${spec2.chartType}`);
|
|
185708
183437
|
}
|
|
185709
183438
|
const three = ctx.three;
|
|
@@ -185765,17 +183494,12 @@ async function mountChart3DView(spec2, ctx) {
|
|
|
185765
183494
|
}
|
|
185766
183495
|
var init_chart_3d_view_scene = __esm2({
|
|
185767
183496
|
"src/render/chart-3d-view-scene.ts"() {
|
|
185768
|
-
init_area_chart_3d_scene();
|
|
185769
|
-
init_bar_chart_3d_scene();
|
|
185770
183497
|
init_chart_3d_bar_mesh();
|
|
185771
183498
|
init_chart_3d_chrome_overlay();
|
|
185772
183499
|
init_chart_3d_oblique_interaction();
|
|
185773
183500
|
init_chart_3d_persp_scene();
|
|
185774
183501
|
init_chart_3d_pie_layout();
|
|
185775
183502
|
init_chart_3d_pie_scene();
|
|
185776
|
-
init_line_chart_3d_scene();
|
|
185777
|
-
init_pie_chart_3d_scene();
|
|
185778
|
-
init_surface_chart_3d_scene();
|
|
185779
183503
|
}
|
|
185780
183504
|
});
|
|
185781
183505
|
function isSmartArt3DGlassMaterial(material) {
|
|
@@ -186585,10 +184309,10 @@ function threeViewOverflowChanged(a, b) {
|
|
|
186585
184309
|
return a.top !== b.top || a.right !== b.right || a.bottom !== b.bottom || a.left !== b.left;
|
|
186586
184310
|
}
|
|
186587
184311
|
function overflowPixelSize(size, overflow) {
|
|
186588
|
-
const
|
|
184312
|
+
const clamp12 = (px32) => Math.max(1, Math.min(MAX_VIEW_PIXELS, Math.round(px32)));
|
|
186589
184313
|
return {
|
|
186590
|
-
width:
|
|
186591
|
-
height:
|
|
184314
|
+
width: clamp12(size.pixelWidth * (1 + overflow.left + overflow.right)),
|
|
184315
|
+
height: clamp12(size.pixelHeight * (1 + overflow.top + overflow.bottom))
|
|
186592
184316
|
};
|
|
186593
184317
|
}
|
|
186594
184318
|
function overflowViewOffset(size, overflow) {
|
|
@@ -186719,7 +184443,12 @@ async function mountSmartArt3DView(model, ctx) {
|
|
|
186719
184443
|
const built = lit ? buildLitMeshObject(
|
|
186720
184444
|
three,
|
|
186721
184445
|
mesh,
|
|
186722
|
-
resolveSmartArt3DLightModel(
|
|
184446
|
+
resolveSmartArt3DLightModel(
|
|
184447
|
+
model.lighting,
|
|
184448
|
+
mesh.solid?.material,
|
|
184449
|
+
eye !== void 0,
|
|
184450
|
+
model.camera !== void 0
|
|
184451
|
+
),
|
|
186723
184452
|
eye
|
|
186724
184453
|
) : buildFlatMeshObject(three, mesh);
|
|
186725
184454
|
if (lit && isSmartArt3DTranslucentMesh(mesh)) {
|
|
@@ -187121,10 +184850,20 @@ function renderSelectMenu(menu, choices2, value) {
|
|
|
187121
184850
|
}
|
|
187122
184851
|
function positionSelectMenu(menu, trigger) {
|
|
187123
184852
|
const rect22 = trigger.getBoundingClientRect();
|
|
187124
|
-
|
|
187125
|
-
|
|
187126
|
-
|
|
187127
|
-
|
|
184853
|
+
const margin = 8;
|
|
184854
|
+
const gap = 4;
|
|
184855
|
+
const width = Math.max(0, window.innerWidth - margin * 2);
|
|
184856
|
+
const below = Math.max(0, window.innerHeight - rect22.bottom - gap - margin);
|
|
184857
|
+
const above = Math.max(0, rect22.top - gap - margin);
|
|
184858
|
+
menu.style.minWidth = `${Math.min(rect22.width, width)}px`;
|
|
184859
|
+
menu.style.maxWidth = `${width}px`;
|
|
184860
|
+
menu.style.maxHeight = "240px";
|
|
184861
|
+
const preferredHeight = menu.getBoundingClientRect().height;
|
|
184862
|
+
const flip = below < preferredHeight && above > below;
|
|
184863
|
+
menu.style.maxHeight = `${Math.min(240, flip ? above : below)}px`;
|
|
184864
|
+
const { height, width: menuWidth } = menu.getBoundingClientRect();
|
|
184865
|
+
menu.style.top = `${Math.max(margin, flip ? rect22.top - gap - height : rect22.bottom + gap)}px`;
|
|
184866
|
+
menu.style.left = `${Math.max(margin, Math.min(rect22.left, window.innerWidth - menuWidth - margin))}px`;
|
|
187128
184867
|
}
|
|
187129
184868
|
function markSelectActive(menu, trigger, active2, open) {
|
|
187130
184869
|
for (const item3 of menu.querySelectorAll("[data-index]")) {
|
|
@@ -187402,6 +185141,9 @@ function definePptxSelect(registry) {
|
|
|
187402
185141
|
}
|
|
187403
185142
|
this.text.textContent = this.choices.find((choice) => choice.value === this.value)?.label ?? "";
|
|
187404
185143
|
this.trigger.disabled = this.disabled;
|
|
185144
|
+
if (this.disabled) {
|
|
185145
|
+
this.close();
|
|
185146
|
+
}
|
|
187405
185147
|
this.trigger.setAttribute("aria-label", this.getAttribute("aria-label") ?? "");
|
|
187406
185148
|
this.internals?.setFormValue?.(this.disabled ? null : this.value);
|
|
187407
185149
|
if (this.open || this.menu.childElementCount) {
|
|
@@ -187410,16 +185152,12 @@ function definePptxSelect(registry) {
|
|
|
187410
185152
|
}
|
|
187411
185153
|
renderMenu() {
|
|
187412
185154
|
renderSelectMenu(this.menu, this.choices, this.value);
|
|
187413
|
-
this.
|
|
185155
|
+
markSelectActive(this.menu, this.trigger, this.active, this.open);
|
|
187414
185156
|
}
|
|
187415
185157
|
show() {
|
|
187416
185158
|
if (this.disabled || !this.choices.some((choice) => !choice.disabled && !choice.hidden) || this.open) {
|
|
187417
185159
|
return;
|
|
187418
185160
|
}
|
|
187419
|
-
const availableBelow = window.innerHeight - this.trigger.getBoundingClientRect().bottom;
|
|
187420
|
-
if (availableBelow < Math.min(this.choices.length * 32 + 12, 160)) {
|
|
187421
|
-
this.trigger.scrollIntoView?.({ block: "center" });
|
|
187422
|
-
}
|
|
187423
185161
|
this.open = true;
|
|
187424
185162
|
this.setAttribute("open", "");
|
|
187425
185163
|
const selected = this.choices.findIndex(
|
|
@@ -187434,7 +185172,7 @@ function definePptxSelect(registry) {
|
|
|
187434
185172
|
}
|
|
187435
185173
|
this.trigger.setAttribute("aria-expanded", "true");
|
|
187436
185174
|
this.position();
|
|
187437
|
-
this.
|
|
185175
|
+
markSelectActive(this.menu, this.trigger, this.active, this.open);
|
|
187438
185176
|
document.addEventListener("pointerdown", this.onOutside, true);
|
|
187439
185177
|
window.addEventListener("resize", this.position);
|
|
187440
185178
|
window.addEventListener("scroll", this.position, true);
|
|
@@ -187444,6 +185182,8 @@ function definePptxSelect(registry) {
|
|
|
187444
185182
|
return;
|
|
187445
185183
|
}
|
|
187446
185184
|
this.open = false;
|
|
185185
|
+
window.clearTimeout(this.searchTimer);
|
|
185186
|
+
this.search = "";
|
|
187447
185187
|
this.removeAttribute("open");
|
|
187448
185188
|
if (this.menu.matches(":popover-open")) {
|
|
187449
185189
|
this.menu.hidePopover();
|
|
@@ -187466,9 +185206,6 @@ function definePptxSelect(registry) {
|
|
|
187466
185206
|
}
|
|
187467
185207
|
positionSelectMenu(this.menu, this.trigger);
|
|
187468
185208
|
};
|
|
187469
|
-
markActive() {
|
|
187470
|
-
markSelectActive(this.menu, this.trigger, this.active, this.open);
|
|
187471
|
-
}
|
|
187472
185209
|
move(step) {
|
|
187473
185210
|
if (!this.open) {
|
|
187474
185211
|
this.show();
|
|
@@ -187477,7 +185214,7 @@ function definePptxSelect(registry) {
|
|
|
187477
185214
|
return;
|
|
187478
185215
|
}
|
|
187479
185216
|
this.active = nextSelectActive(this.choices, this.active, step);
|
|
187480
|
-
this.
|
|
185217
|
+
markSelectActive(this.menu, this.trigger, this.active, this.open);
|
|
187481
185218
|
}
|
|
187482
185219
|
commit(index) {
|
|
187483
185220
|
const choice = this.choices[index];
|
|
@@ -187505,8 +185242,8 @@ function definePptxSelect(registry) {
|
|
|
187505
185242
|
event.preventDefault();
|
|
187506
185243
|
event.stopPropagation();
|
|
187507
185244
|
this.show();
|
|
187508
|
-
this.active = event.key === "Home" ? this.choices
|
|
187509
|
-
this.
|
|
185245
|
+
this.active = event.key === "Home" ? nextSelectActive(this.choices, -1, 1) : nextSelectActive(this.choices, 0, -1);
|
|
185246
|
+
markSelectActive(this.menu, this.trigger, this.active, this.open);
|
|
187510
185247
|
} else if (event.key === "Enter" || event.key === " ") {
|
|
187511
185248
|
event.preventDefault();
|
|
187512
185249
|
event.stopPropagation();
|
|
@@ -187520,6 +185257,8 @@ function definePptxSelect(registry) {
|
|
|
187520
185257
|
event.stopPropagation();
|
|
187521
185258
|
this.close();
|
|
187522
185259
|
this.trigger.focus();
|
|
185260
|
+
} else if (event.key === "Tab") {
|
|
185261
|
+
this.close();
|
|
187523
185262
|
} else if (event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey) {
|
|
187524
185263
|
event.stopPropagation();
|
|
187525
185264
|
this.search += event.key.toLocaleLowerCase();
|
|
@@ -187533,7 +185272,7 @@ function definePptxSelect(registry) {
|
|
|
187533
185272
|
);
|
|
187534
185273
|
if (index >= 0) {
|
|
187535
185274
|
this.active = index;
|
|
187536
|
-
this.
|
|
185275
|
+
markSelectActive(this.menu, this.trigger, this.active, this.open);
|
|
187537
185276
|
}
|
|
187538
185277
|
}
|
|
187539
185278
|
}
|
|
@@ -200593,8 +198332,8 @@ function hexToRgb4(hex22) {
|
|
|
200593
198332
|
};
|
|
200594
198333
|
}
|
|
200595
198334
|
function rgbToHex3(r, g2, b) {
|
|
200596
|
-
const
|
|
200597
|
-
return `#${
|
|
198335
|
+
const clamp12 = (v) => Math.max(0, Math.min(255, Math.round(v)));
|
|
198336
|
+
return `#${clamp12(r).toString(16).padStart(2, "0")}${clamp12(g2).toString(16).padStart(2, "0")}${clamp12(b).toString(16).padStart(2, "0")}`;
|
|
200598
198337
|
}
|
|
200599
198338
|
function rgbToHsl2(r, g2, b) {
|
|
200600
198339
|
const rn = r / 255;
|
|
@@ -207968,8 +205707,8 @@ function hexToRgb5(hex22) {
|
|
|
207968
205707
|
};
|
|
207969
205708
|
}
|
|
207970
205709
|
function rgbToHex4(r, g2, b) {
|
|
207971
|
-
const
|
|
207972
|
-
return `#${
|
|
205710
|
+
const clamp12 = (v) => Math.max(0, Math.min(255, Math.round(v)));
|
|
205711
|
+
return `#${clamp12(r).toString(16).padStart(2, "0").toUpperCase()}${clamp12(g2).toString(16).padStart(2, "0").toUpperCase()}${clamp12(b).toString(16).padStart(2, "0").toUpperCase()}`;
|
|
207973
205712
|
}
|
|
207974
205713
|
function tintColor(hex22, tintFactor) {
|
|
207975
205714
|
const { r, g: g2, b } = hexToRgb5(hex22);
|
|
@@ -223144,8 +220883,8 @@ function hexToRgb6(hex22) {
|
|
|
223144
220883
|
};
|
|
223145
220884
|
}
|
|
223146
220885
|
function rgbToHex5(r, g2, b) {
|
|
223147
|
-
const
|
|
223148
|
-
return `#${
|
|
220886
|
+
const clamp12 = (v) => Math.max(0, Math.min(255, Math.round(v)));
|
|
220887
|
+
return `#${clamp12(r).toString(16).padStart(2, "0").toUpperCase()}${clamp12(g2).toString(16).padStart(2, "0").toUpperCase()}${clamp12(b).toString(16).padStart(2, "0").toUpperCase()}`;
|
|
223149
220888
|
}
|
|
223150
220889
|
function tintColor2(hex22, tintFactor) {
|
|
223151
220890
|
const { r, g: g2, b } = hexToRgb6(hex22);
|
|
@@ -232638,242 +230377,6 @@ function buildSmartArt3DSpecForElement(element, options = {}) {
|
|
|
232638
230377
|
});
|
|
232639
230378
|
return model.meshes.length > 0 ? model : null;
|
|
232640
230379
|
}
|
|
232641
|
-
init_cartesian_line_chart_3d_layout();
|
|
232642
|
-
init_chart_3d_surfaces();
|
|
232643
|
-
init_chart_datapoint_style();
|
|
232644
|
-
init_chart_view_model();
|
|
232645
|
-
function buildPoints(chartData, catCount) {
|
|
232646
|
-
const series = chartData.series;
|
|
232647
|
-
const palette = chartData.colorPalette;
|
|
232648
|
-
const points4 = [];
|
|
232649
|
-
for (let si = 0; si < series.length; si++) {
|
|
232650
|
-
const baseColor = seriesColor22(series[si], si, palette);
|
|
232651
|
-
for (let ci = 0; ci < catCount; ci++) {
|
|
232652
|
-
const value = series[si].values[ci] ?? 0;
|
|
232653
|
-
const color2 = resolveDataPointFill(series[si], ci, paletteColor2(si, palette)) ?? baseColor;
|
|
232654
|
-
points4.push({ seriesIndex: si, categoryIndex: ci, value, color: color2 });
|
|
232655
|
-
}
|
|
232656
|
-
}
|
|
232657
|
-
return points4;
|
|
232658
|
-
}
|
|
232659
|
-
function buildCartesianLine3DSceneData(chartData, categoryLabels, options) {
|
|
232660
|
-
const rows = chartData.series.length;
|
|
232661
|
-
const cols = categoryLabels.length;
|
|
232662
|
-
if (rows === 0 || cols === 0) {
|
|
232663
|
-
return null;
|
|
232664
|
-
}
|
|
232665
|
-
const points4 = buildPoints(chartData, cols);
|
|
232666
|
-
const range = computeValueRange2(chartData.series, options.height);
|
|
232667
|
-
const depthPercent = chartData.view3D?.depthPercent;
|
|
232668
|
-
const series = layoutCartesianLine3DSeries(points4, cols, rows, range, depthPercent);
|
|
232669
|
-
return {
|
|
232670
|
-
cols,
|
|
232671
|
-
rows,
|
|
232672
|
-
series,
|
|
232673
|
-
categoryLabels,
|
|
232674
|
-
seriesNames: chartData.series.map((s) => s.name),
|
|
232675
|
-
numberFormats: chartData.series.map((s) => s.numberFormat),
|
|
232676
|
-
width: options.width,
|
|
232677
|
-
height: options.height,
|
|
232678
|
-
view3D: chartData.view3D ? {
|
|
232679
|
-
rotX: chartData.view3D.rotX,
|
|
232680
|
-
rotY: chartData.view3D.rotY,
|
|
232681
|
-
rperspective: chartData.view3D.perspective,
|
|
232682
|
-
depthPercent: chartData.view3D.depthPercent,
|
|
232683
|
-
rAngAx: chartData.view3D.rAngAx
|
|
232684
|
-
} : void 0,
|
|
232685
|
-
wallColors: resolveChart3DWallColors(chartData)
|
|
232686
|
-
};
|
|
232687
|
-
}
|
|
232688
|
-
function buildAreaChart3DDataForElement(element, options) {
|
|
232689
|
-
if (element.type !== "chart") {
|
|
232690
|
-
return null;
|
|
232691
|
-
}
|
|
232692
|
-
const chartEl = element;
|
|
232693
|
-
const chartData = chartEl.chartData;
|
|
232694
|
-
if (!chartData || chartData.series.length === 0) {
|
|
232695
|
-
return null;
|
|
232696
|
-
}
|
|
232697
|
-
if (chartData.chartType !== "area3D") {
|
|
232698
|
-
return null;
|
|
232699
|
-
}
|
|
232700
|
-
const longestLen = chartData.series.reduce((m, s) => Math.max(m, s.values.length), 0);
|
|
232701
|
-
const categoryLabels = chartData.categories.length > 0 ? chartData.categories : Array.from({ length: longestLen }, (_, i2) => String(i2 + 1));
|
|
232702
|
-
return buildCartesianLine3DSceneData(chartData, categoryLabels, options);
|
|
232703
|
-
}
|
|
232704
|
-
init_cartesian_chart_3d_geom();
|
|
232705
|
-
function coneToMaxTopRadiusFactor(shape, value, max) {
|
|
232706
|
-
if (shape !== "coneToMax" && shape !== "pyramidToMax") {
|
|
232707
|
-
return void 0;
|
|
232708
|
-
}
|
|
232709
|
-
if (!(max > 0)) {
|
|
232710
|
-
return 0;
|
|
232711
|
-
}
|
|
232712
|
-
return Math.max(0, Math.min(1, 1 - Math.abs(value) / max));
|
|
232713
|
-
}
|
|
232714
|
-
var MIN_BOX_HEIGHT = 0.02;
|
|
232715
|
-
var BOX_GAP = 0.15;
|
|
232716
|
-
function normalizeToHeight2(value, range) {
|
|
232717
|
-
if (range.span <= 0) {
|
|
232718
|
-
return 0;
|
|
232719
|
-
}
|
|
232720
|
-
return (value - range.min) / range.span * MAX_VALUE_HEIGHT;
|
|
232721
|
-
}
|
|
232722
|
-
function layoutClustered(points4, cols, rows, range, depthPercent) {
|
|
232723
|
-
const { gridWidth, gridDepth } = computeCartesianGridExtent(cols, rows, depthPercent);
|
|
232724
|
-
const colStep = gridWidth / cols;
|
|
232725
|
-
const rowStep = gridDepth / Math.max(rows, 1);
|
|
232726
|
-
const boxW = colStep * (1 - BOX_GAP);
|
|
232727
|
-
const boxD = rowStep * (1 - BOX_GAP);
|
|
232728
|
-
const zeroH = normalizeToHeight2(0, range);
|
|
232729
|
-
return points4.map((p) => {
|
|
232730
|
-
const valueH = normalizeToHeight2(p.plotValue, range);
|
|
232731
|
-
const top = Math.max(valueH, zeroH);
|
|
232732
|
-
const bottom = Math.min(valueH, zeroH);
|
|
232733
|
-
const h2 = Math.max(top - bottom, MIN_BOX_HEIGHT);
|
|
232734
|
-
const x = -gridWidth / 2 + colStep * (p.categoryIndex + 0.5);
|
|
232735
|
-
const z = -gridDepth / 2 + rowStep * (p.seriesIndex + 0.5);
|
|
232736
|
-
return {
|
|
232737
|
-
seriesIndex: p.seriesIndex,
|
|
232738
|
-
categoryIndex: p.categoryIndex,
|
|
232739
|
-
value: p.value,
|
|
232740
|
-
color: p.color,
|
|
232741
|
-
center: [x, bottom + h2 / 2, z],
|
|
232742
|
-
size: [boxW, h2, boxD],
|
|
232743
|
-
shape: p.shape,
|
|
232744
|
-
coneToMaxTopRadiusFactor: coneToMaxTopRadiusFactor(p.shape, p.value, range.max)
|
|
232745
|
-
};
|
|
232746
|
-
});
|
|
232747
|
-
}
|
|
232748
|
-
function layoutStacked(points4, cols, rows, range, depthPercent) {
|
|
232749
|
-
const { gridWidth, gridDepth } = computeCartesianGridExtent(cols, rows, depthPercent);
|
|
232750
|
-
const colStep = gridWidth / cols;
|
|
232751
|
-
const boxW = colStep * (1 - BOX_GAP);
|
|
232752
|
-
const boxD = gridDepth * (1 - BOX_GAP);
|
|
232753
|
-
const boxes = [];
|
|
232754
|
-
for (let ci = 0; ci < cols; ci++) {
|
|
232755
|
-
const x = -gridWidth / 2 + colStep * (ci + 0.5);
|
|
232756
|
-
let posRunning = 0;
|
|
232757
|
-
let negRunning = 0;
|
|
232758
|
-
const catPoints = points4.filter((p) => p.categoryIndex === ci).sort((a, b) => a.seriesIndex - b.seriesIndex);
|
|
232759
|
-
for (const p of catPoints) {
|
|
232760
|
-
const isNeg = p.plotValue < 0;
|
|
232761
|
-
const base = isNeg ? negRunning : posRunning;
|
|
232762
|
-
const top = base + p.plotValue;
|
|
232763
|
-
if (isNeg) {
|
|
232764
|
-
negRunning = top;
|
|
232765
|
-
} else {
|
|
232766
|
-
posRunning = top;
|
|
232767
|
-
}
|
|
232768
|
-
const baseH = normalizeToHeight2(base, range);
|
|
232769
|
-
const topH = normalizeToHeight2(top, range);
|
|
232770
|
-
const h2 = Math.max(Math.abs(topH - baseH), MIN_BOX_HEIGHT);
|
|
232771
|
-
boxes.push({
|
|
232772
|
-
seriesIndex: p.seriesIndex,
|
|
232773
|
-
categoryIndex: p.categoryIndex,
|
|
232774
|
-
value: p.value,
|
|
232775
|
-
color: p.color,
|
|
232776
|
-
center: [x, Math.min(baseH, topH) + h2 / 2, 0],
|
|
232777
|
-
size: [boxW, h2, boxD],
|
|
232778
|
-
shape: p.shape,
|
|
232779
|
-
coneToMaxTopRadiusFactor: coneToMaxTopRadiusFactor(p.shape, p.value, range.max)
|
|
232780
|
-
});
|
|
232781
|
-
}
|
|
232782
|
-
}
|
|
232783
|
-
return boxes;
|
|
232784
|
-
}
|
|
232785
|
-
function layoutBarChart3D(points4, cols, rows, range, grouping, depthPercent, horizontal = false) {
|
|
232786
|
-
const boxes = grouping === "clustered" ? layoutClustered(points4, cols, rows, range, depthPercent) : layoutStacked(points4, cols, rows, range, depthPercent);
|
|
232787
|
-
if (!horizontal) {
|
|
232788
|
-
return boxes;
|
|
232789
|
-
}
|
|
232790
|
-
return boxes.map((box) => ({ ...box, center: transposeForHorizontalBar3D(box.center) }));
|
|
232791
|
-
}
|
|
232792
|
-
init_chart_3d_surfaces();
|
|
232793
|
-
init_chart_datapoint_style();
|
|
232794
|
-
init_chart_view_model();
|
|
232795
|
-
function categoryTotals3(series, catCount) {
|
|
232796
|
-
return Array.from(
|
|
232797
|
-
{ length: catCount },
|
|
232798
|
-
(_, ci) => series.reduce((sum, s) => sum + Math.abs(s.values[ci] ?? 0), 0)
|
|
232799
|
-
);
|
|
232800
|
-
}
|
|
232801
|
-
function buildPoints2(chartData, catCount, isPercent) {
|
|
232802
|
-
const series = chartData.series;
|
|
232803
|
-
const palette = chartData.colorPalette;
|
|
232804
|
-
const totals = isPercent ? categoryTotals3(series, catCount) : void 0;
|
|
232805
|
-
const points4 = [];
|
|
232806
|
-
for (let si = 0; si < series.length; si++) {
|
|
232807
|
-
const baseColor = seriesColor22(series[si], si, palette);
|
|
232808
|
-
for (let ci = 0; ci < catCount; ci++) {
|
|
232809
|
-
const value = series[si].values[ci] ?? 0;
|
|
232810
|
-
const color2 = resolveDataPointFill(series[si], ci, paletteColor2(si, palette)) ?? baseColor;
|
|
232811
|
-
const catTotal = totals?.[ci];
|
|
232812
|
-
const plotValue = isPercent && catTotal !== void 0 && catTotal > 0 ? value / catTotal * 100 : value;
|
|
232813
|
-
points4.push({
|
|
232814
|
-
seriesIndex: si,
|
|
232815
|
-
categoryIndex: ci,
|
|
232816
|
-
value,
|
|
232817
|
-
plotValue,
|
|
232818
|
-
color: color2,
|
|
232819
|
-
// Per-series `c:ser/c:shape` wins over the chart-level `c:bar3DChart/c:shape`.
|
|
232820
|
-
shape: series[si].shape ?? chartData.barShape
|
|
232821
|
-
});
|
|
232822
|
-
}
|
|
232823
|
-
}
|
|
232824
|
-
return points4;
|
|
232825
|
-
}
|
|
232826
|
-
function buildBarChart3DData(chartData, categoryLabels, options) {
|
|
232827
|
-
const rows = chartData.series.length;
|
|
232828
|
-
const cols = categoryLabels.length;
|
|
232829
|
-
if (rows === 0 || cols === 0) {
|
|
232830
|
-
return null;
|
|
232831
|
-
}
|
|
232832
|
-
const grouping = chartData.grouping === "stacked" || chartData.grouping === "percentStacked" ? chartData.grouping : "clustered";
|
|
232833
|
-
const isPercent = grouping === "percentStacked";
|
|
232834
|
-
const horizontal = chartData.barDirection === "bar";
|
|
232835
|
-
const points4 = buildPoints2(chartData, cols, isPercent);
|
|
232836
|
-
const range = isPercent ? { min: 0, max: 100, span: 100 } : grouping === "stacked" ? computeStackedValueRange(chartData.series, cols, options.height) : computeValueRange2(chartData.series, options.height);
|
|
232837
|
-
const depthPercent = chartData.view3D?.depthPercent;
|
|
232838
|
-
const boxes = layoutBarChart3D(points4, cols, rows, range, grouping, depthPercent, horizontal);
|
|
232839
|
-
return {
|
|
232840
|
-
cols,
|
|
232841
|
-
rows,
|
|
232842
|
-
boxes,
|
|
232843
|
-
categoryLabels,
|
|
232844
|
-
seriesNames: chartData.series.map((s) => s.name),
|
|
232845
|
-
numberFormats: chartData.series.map((s) => s.numberFormat),
|
|
232846
|
-
grouping,
|
|
232847
|
-
width: options.width,
|
|
232848
|
-
height: options.height,
|
|
232849
|
-
view3D: chartData.view3D ? {
|
|
232850
|
-
rotX: chartData.view3D.rotX,
|
|
232851
|
-
rotY: chartData.view3D.rotY,
|
|
232852
|
-
rperspective: chartData.view3D.perspective,
|
|
232853
|
-
depthPercent: chartData.view3D.depthPercent,
|
|
232854
|
-
rAngAx: chartData.view3D.rAngAx
|
|
232855
|
-
} : void 0,
|
|
232856
|
-
wallColors: resolveChart3DWallColors(chartData),
|
|
232857
|
-
picture: { series: chartData.series },
|
|
232858
|
-
...horizontal ? { horizontal: true } : {}
|
|
232859
|
-
};
|
|
232860
|
-
}
|
|
232861
|
-
function buildBarChart3DDataForElement(element, options) {
|
|
232862
|
-
if (element.type !== "chart") {
|
|
232863
|
-
return null;
|
|
232864
|
-
}
|
|
232865
|
-
const chartEl = element;
|
|
232866
|
-
const chartData = chartEl.chartData;
|
|
232867
|
-
if (!chartData || chartData.series.length === 0) {
|
|
232868
|
-
return null;
|
|
232869
|
-
}
|
|
232870
|
-
if (chartData.chartType !== "bar3D") {
|
|
232871
|
-
return null;
|
|
232872
|
-
}
|
|
232873
|
-
const longestLen = chartData.series.reduce((m, s) => Math.max(m, s.values.length), 0);
|
|
232874
|
-
const categoryLabels = chartData.categories.length > 0 ? chartData.categories : Array.from({ length: longestLen }, (_, i2) => String(i2 + 1));
|
|
232875
|
-
return buildBarChart3DData(chartData, categoryLabels, options);
|
|
232876
|
-
}
|
|
232877
230380
|
init_chart_3d_oblique_bars();
|
|
232878
230381
|
init_chart_view_model_chrome();
|
|
232879
230382
|
var PT = 4 / 3;
|
|
@@ -233362,16 +230865,16 @@ var DEFAULT_ROT_X3 = 15;
|
|
|
233362
230865
|
var DEFAULT_ROT_Y2 = 20;
|
|
233363
230866
|
var DEFAULT_PIE_ROT_X = 30;
|
|
233364
230867
|
var DEFAULT_PIE_ROT_Y = 0;
|
|
233365
|
-
var
|
|
233366
|
-
var
|
|
233367
|
-
var
|
|
233368
|
-
var
|
|
233369
|
-
function
|
|
230868
|
+
var DEFAULT_PERSPECTIVE_DEG = 30;
|
|
230869
|
+
var PERSPECTIVE_MAX_DEG = 120;
|
|
230870
|
+
var FOV_MIN = 15;
|
|
230871
|
+
var FOV_MAX = 75;
|
|
230872
|
+
function clamp7(value, min, max) {
|
|
233370
230873
|
return Math.min(Math.max(value, min), max);
|
|
233371
230874
|
}
|
|
233372
230875
|
function resolvePerspectiveFov(perspectiveDeg) {
|
|
233373
|
-
const perspective2 =
|
|
233374
|
-
return
|
|
230876
|
+
const perspective2 = clamp7(perspectiveDeg ?? DEFAULT_PERSPECTIVE_DEG, 0, PERSPECTIVE_MAX_DEG);
|
|
230877
|
+
return FOV_MIN + perspective2 / PERSPECTIVE_MAX_DEG * (FOV_MAX - FOV_MIN);
|
|
233375
230878
|
}
|
|
233376
230879
|
function resolveChart3DProjection(chartType, view3D) {
|
|
233377
230880
|
const isPie = chartType === "pie3D";
|
|
@@ -233397,149 +230900,6 @@ function resolveChart3DProjection(chartType, view3D) {
|
|
|
233397
230900
|
};
|
|
233398
230901
|
}
|
|
233399
230902
|
init_chart_view_model_build();
|
|
233400
|
-
function buildLineChart3DDataForElement(element, options) {
|
|
233401
|
-
if (element.type !== "chart") {
|
|
233402
|
-
return null;
|
|
233403
|
-
}
|
|
233404
|
-
const chartEl = element;
|
|
233405
|
-
const chartData = chartEl.chartData;
|
|
233406
|
-
if (!chartData || chartData.series.length === 0) {
|
|
233407
|
-
return null;
|
|
233408
|
-
}
|
|
233409
|
-
if (chartData.chartType !== "line3D") {
|
|
233410
|
-
return null;
|
|
233411
|
-
}
|
|
233412
|
-
const longestLen = chartData.series.reduce((m, s) => Math.max(m, s.values.length), 0);
|
|
233413
|
-
const categoryLabels = chartData.categories.length > 0 ? chartData.categories : Array.from({ length: longestLen }, (_, i2) => String(i2 + 1));
|
|
233414
|
-
return buildCartesianLine3DSceneData(chartData, categoryLabels, options);
|
|
233415
|
-
}
|
|
233416
|
-
init_chart_datapoint_style();
|
|
233417
|
-
init_chart_view_model();
|
|
233418
|
-
init_pie_chart_3d_geom();
|
|
233419
|
-
function buildPieChart3DData(chartData, categoryLabels, options) {
|
|
233420
|
-
const pieSeries = chartData.series[0];
|
|
233421
|
-
if (!pieSeries || pieSeries.values.length === 0) {
|
|
233422
|
-
return null;
|
|
233423
|
-
}
|
|
233424
|
-
const values = pieSeries.values;
|
|
233425
|
-
const explosions = values.map((_v, i2) => resolveDataPointExplosion(pieSeries, i2));
|
|
233426
|
-
const outerRadius = PIE_RADIUS;
|
|
233427
|
-
const angles = computePieChart3DSliceAngles(
|
|
233428
|
-
values,
|
|
233429
|
-
explosions,
|
|
233430
|
-
chartData.firstSliceAngle,
|
|
233431
|
-
outerRadius
|
|
233432
|
-
);
|
|
233433
|
-
const wedges = angles.map((angle) => ({
|
|
233434
|
-
...angle,
|
|
233435
|
-
color: resolveVaryColorFill(
|
|
233436
|
-
pieSeries,
|
|
233437
|
-
angle.pointIndex,
|
|
233438
|
-
paletteColor2(angle.pointIndex, chartData.colorPalette)
|
|
233439
|
-
)
|
|
233440
|
-
}));
|
|
233441
|
-
const view3D = chartData.view3D ? {
|
|
233442
|
-
rotX: chartData.view3D.rotX,
|
|
233443
|
-
rotY: chartData.view3D.rotY,
|
|
233444
|
-
rperspective: chartData.view3D.perspective,
|
|
233445
|
-
rAngAx: chartData.view3D.rAngAx,
|
|
233446
|
-
hPercent: chartData.view3D.hPercent
|
|
233447
|
-
} : void 0;
|
|
233448
|
-
return {
|
|
233449
|
-
wedges,
|
|
233450
|
-
categoryLabels,
|
|
233451
|
-
seriesName: pieSeries.name,
|
|
233452
|
-
numberFormat: pieSeries.numberFormat,
|
|
233453
|
-
outerRadius,
|
|
233454
|
-
thickness: computePieChart3DThickness(view3D),
|
|
233455
|
-
width: options.width,
|
|
233456
|
-
height: options.height,
|
|
233457
|
-
view3D,
|
|
233458
|
-
values,
|
|
233459
|
-
explosions,
|
|
233460
|
-
firstSliceAngleDeg: chartData.firstSliceAngle
|
|
233461
|
-
};
|
|
233462
|
-
}
|
|
233463
|
-
function buildPieChart3DDataForElement(element, options) {
|
|
233464
|
-
if (element.type !== "chart") {
|
|
233465
|
-
return null;
|
|
233466
|
-
}
|
|
233467
|
-
const chartEl = element;
|
|
233468
|
-
const chartData = chartEl.chartData;
|
|
233469
|
-
if (!chartData || chartData.series.length === 0) {
|
|
233470
|
-
return null;
|
|
233471
|
-
}
|
|
233472
|
-
if (chartData.chartType !== "pie3D") {
|
|
233473
|
-
return null;
|
|
233474
|
-
}
|
|
233475
|
-
const pieSeries = chartData.series[0];
|
|
233476
|
-
const categoryLabels = chartData.categories.length > 0 ? chartData.categories : Array.from({ length: pieSeries.values.length }, (_, i2) => String(i2 + 1));
|
|
233477
|
-
return buildPieChart3DData(chartData, categoryLabels, options);
|
|
233478
|
-
}
|
|
233479
|
-
init_chart_3d_surfaces();
|
|
233480
|
-
init_chart_surface_bands();
|
|
233481
|
-
init_chart_surface_treemap();
|
|
233482
|
-
init_chart_view_model();
|
|
233483
|
-
function resolveSurfaceColors(chartData) {
|
|
233484
|
-
return resolveChart3DWallColors(chartData);
|
|
233485
|
-
}
|
|
233486
|
-
function buildSurfaceChart3DData(chartData, categoryLabels, options) {
|
|
233487
|
-
const seriesCount = chartData.series.length;
|
|
233488
|
-
const catCount = categoryLabels.length;
|
|
233489
|
-
if (seriesCount === 0 || catCount === 0) {
|
|
233490
|
-
return null;
|
|
233491
|
-
}
|
|
233492
|
-
const range = computeValueRange2(chartData.series, options.height);
|
|
233493
|
-
const heightMap = new Float32Array(seriesCount * catCount);
|
|
233494
|
-
const colorMap = new Float32Array(seriesCount * catCount * 3);
|
|
233495
|
-
const values = new Float32Array(seriesCount * catCount);
|
|
233496
|
-
for (let row = 0; row < seriesCount; row++) {
|
|
233497
|
-
for (let col = 0; col < catCount; col++) {
|
|
233498
|
-
const idx = row * catCount + col;
|
|
233499
|
-
const val2 = chartData.series[row]?.values[col] ?? 0;
|
|
233500
|
-
values[idx] = val2;
|
|
233501
|
-
const t = range.span > 0 ? (val2 - range.min) / range.span : 0;
|
|
233502
|
-
heightMap[idx] = t;
|
|
233503
|
-
const bandFill = resolveSurfaceBandFill(t, chartData.bandFmts);
|
|
233504
|
-
const { r, g: g2, b } = bandFill ? hexToRgb4(bandFill) : surfaceColor(t);
|
|
233505
|
-
const ci = idx * 3;
|
|
233506
|
-
colorMap[ci] = r / 255;
|
|
233507
|
-
colorMap[ci + 1] = g2 / 255;
|
|
233508
|
-
colorMap[ci + 2] = b / 255;
|
|
233509
|
-
}
|
|
233510
|
-
}
|
|
233511
|
-
return {
|
|
233512
|
-
cols: catCount,
|
|
233513
|
-
rows: seriesCount,
|
|
233514
|
-
heightMap,
|
|
233515
|
-
colorMap,
|
|
233516
|
-
values,
|
|
233517
|
-
numberFormats: chartData.series.map((s) => s.numberFormat),
|
|
233518
|
-
wireframe: options.wireframe ?? chartData.wireframe ?? true,
|
|
233519
|
-
categoryLabels,
|
|
233520
|
-
seriesNames: chartData.series.map((s) => s.name),
|
|
233521
|
-
width: options.width,
|
|
233522
|
-
height: options.height,
|
|
233523
|
-
view3D: chartData.view3D ? { rotX: chartData.view3D.rotX, rotY: chartData.view3D.rotY } : void 0,
|
|
233524
|
-
surfaceColors: resolveSurfaceColors(chartData)
|
|
233525
|
-
};
|
|
233526
|
-
}
|
|
233527
|
-
function buildSurfaceChart3DDataForElement(element, options) {
|
|
233528
|
-
if (element.type !== "chart") {
|
|
233529
|
-
return null;
|
|
233530
|
-
}
|
|
233531
|
-
const chartEl = element;
|
|
233532
|
-
const chartData = chartEl.chartData;
|
|
233533
|
-
if (!chartData || chartData.series.length === 0) {
|
|
233534
|
-
return null;
|
|
233535
|
-
}
|
|
233536
|
-
if (resolveChartKind(chartData.chartType ?? "bar") !== "surface") {
|
|
233537
|
-
return null;
|
|
233538
|
-
}
|
|
233539
|
-
const longestLen = chartData.series.reduce((m, s) => Math.max(m, s.values.length), 0);
|
|
233540
|
-
const categoryLabels = chartData.categories.length > 0 ? chartData.categories : Array.from({ length: longestLen }, (_, i2) => String(i2 + 1));
|
|
233541
|
-
return buildSurfaceChart3DData(chartData, categoryLabels, options);
|
|
233542
|
-
}
|
|
233543
230903
|
var CHART_3D_TYPES = /* @__PURE__ */ new Set([
|
|
233544
230904
|
"bar3D",
|
|
233545
230905
|
"line3D",
|
|
@@ -233576,6 +230936,9 @@ function buildChart3DSpecForElement(element) {
|
|
|
233576
230936
|
const vm = buildChartViewModel(element);
|
|
233577
230937
|
const projection = resolveChart3DProjection(chartType, chartData.view3D);
|
|
233578
230938
|
const geometry = chartType === "bar3D" && projection.mode === "oblique" ? buildBarGeometry(element, vm) : PERSP_BOX_TYPES.has(chartType) && (projection.mode === "perspective" || chartType !== "bar3D") ? buildPerspGeometry(element, vm, projection.mode === "oblique") : chartType === "pie3D" ? buildPieGeometry(element, vm) : null;
|
|
230939
|
+
if (!geometry) {
|
|
230940
|
+
return null;
|
|
230941
|
+
}
|
|
233579
230942
|
const longest = chartData.series.reduce((m, series) => Math.max(m, series.values.length), 0);
|
|
233580
230943
|
const categoryLabels = chartData.categories.length > 0 ? chartData.categories : Array.from({ length: longest }, (_, i2) => String(i2 + 1));
|
|
233581
230944
|
return {
|
|
@@ -233586,37 +230949,9 @@ function buildChart3DSpecForElement(element) {
|
|
|
233586
230949
|
projection,
|
|
233587
230950
|
vm,
|
|
233588
230951
|
geometry,
|
|
233589
|
-
categoryLabels
|
|
233590
|
-
perspective: geometry ? null : buildPerspectiveScene(element)
|
|
230952
|
+
categoryLabels
|
|
233591
230953
|
};
|
|
233592
230954
|
}
|
|
233593
|
-
function buildPerspectiveScene(element) {
|
|
233594
|
-
const size = { width: element.width, height: element.height };
|
|
233595
|
-
switch (element.chartData?.chartType) {
|
|
233596
|
-
case "bar3D": {
|
|
233597
|
-
const options = buildBarChart3DDataForElement(element, size);
|
|
233598
|
-
return options ? { kind: "bar", options } : null;
|
|
233599
|
-
}
|
|
233600
|
-
case "line3D": {
|
|
233601
|
-
const options = buildLineChart3DDataForElement(element, size);
|
|
233602
|
-
return options ? { kind: "line", options } : null;
|
|
233603
|
-
}
|
|
233604
|
-
case "area3D": {
|
|
233605
|
-
const options = buildAreaChart3DDataForElement(element, size);
|
|
233606
|
-
return options ? { kind: "area", options } : null;
|
|
233607
|
-
}
|
|
233608
|
-
case "pie3D": {
|
|
233609
|
-
const options = buildPieChart3DDataForElement(element, size);
|
|
233610
|
-
return options ? { kind: "pie", options } : null;
|
|
233611
|
-
}
|
|
233612
|
-
case "surface": {
|
|
233613
|
-
const options = buildSurfaceChart3DDataForElement(element, size);
|
|
233614
|
-
return options ? { kind: "surface", options } : null;
|
|
233615
|
-
}
|
|
233616
|
-
default:
|
|
233617
|
-
return null;
|
|
233618
|
-
}
|
|
233619
|
-
}
|
|
233620
230955
|
function observeElementHeight(el, onHeight) {
|
|
233621
230956
|
onHeight(el.getBoundingClientRect().height);
|
|
233622
230957
|
if (typeof ResizeObserver === "undefined") {
|
|
@@ -233977,19 +231312,7 @@ async function mountModel3D(container, modelUrl, options) {
|
|
|
233977
231312
|
}
|
|
233978
231313
|
};
|
|
233979
231314
|
}
|
|
233980
|
-
init_surface_chart_3d_geom();
|
|
233981
|
-
init_surface_chart_3d_scene();
|
|
233982
|
-
init_surface_chart_3d_hit_test();
|
|
233983
|
-
init_cartesian_chart_3d_geom();
|
|
233984
|
-
init_bar_chart_3d_scene();
|
|
233985
231315
|
init_bar_chart_3d_hit_test();
|
|
233986
|
-
init_cartesian_line_chart_3d_layout();
|
|
233987
|
-
init_cartesian_chart_3d_hit_test();
|
|
233988
|
-
init_line_chart_3d_scene();
|
|
233989
|
-
init_area_chart_3d_scene();
|
|
233990
|
-
init_pie_chart_3d_geom();
|
|
233991
|
-
init_pie_chart_3d_scene();
|
|
233992
|
-
init_pie_chart_3d_hit_test();
|
|
233993
231316
|
init_text_wrap_estimate();
|
|
233994
231317
|
function collectFontsFromElement(element, fonts) {
|
|
233995
231318
|
if (hasTextProperties(element)) {
|
|
@@ -240431,16 +237754,16 @@ function trimmedMediaDurationMs(trimStartMs, trimEndMs, durationMs) {
|
|
|
240431
237754
|
}
|
|
240432
237755
|
return effectiveEnd - trimStartMs;
|
|
240433
237756
|
}
|
|
240434
|
-
function
|
|
237757
|
+
function clamp11(value, minimum, maximum) {
|
|
240435
237758
|
return Math.min(maximum, Math.max(minimum, value));
|
|
240436
237759
|
}
|
|
240437
237760
|
function mediaTrimEndSeconds(durationSeconds, trimEndMs) {
|
|
240438
237761
|
const duration = Math.max(0, durationSeconds);
|
|
240439
|
-
return trimEndMs > 0 ?
|
|
237762
|
+
return trimEndMs > 0 ? clamp11(duration - trimEndMs / 1e3, 0, duration) : duration;
|
|
240440
237763
|
}
|
|
240441
237764
|
function mediaTrimEndMsFromSeconds(durationSeconds, endSeconds) {
|
|
240442
237765
|
const duration = Math.max(0, durationSeconds);
|
|
240443
|
-
return Math.max(0, duration -
|
|
237766
|
+
return Math.max(0, duration - clamp11(endSeconds, 0, duration)) * 1e3;
|
|
240444
237767
|
}
|
|
240445
237768
|
function buildSummaryZoomView(element, lookup, translate) {
|
|
240446
237769
|
if (element.zoomType !== "summary" || !element.summaryTargets?.length) {
|
|
@@ -243292,9 +240615,9 @@ function resolveAuthoredSlideRange(selection, slideCount) {
|
|
|
243292
240615
|
if (typeof from !== "number" || typeof to !== "number" || !Number.isFinite(from) || !Number.isFinite(to)) {
|
|
243293
240616
|
return void 0;
|
|
243294
240617
|
}
|
|
243295
|
-
const
|
|
243296
|
-
const clampedFrom =
|
|
243297
|
-
const clampedTo =
|
|
240618
|
+
const clamp12 = (value) => Math.min(Math.max(Math.round(value), 1), slideCount);
|
|
240619
|
+
const clampedFrom = clamp12(from);
|
|
240620
|
+
const clampedTo = clamp12(to);
|
|
243298
240621
|
return {
|
|
243299
240622
|
fromIndex: Math.min(clampedFrom, clampedTo) - 1,
|
|
243300
240623
|
toIndex: Math.max(clampedFrom, clampedTo) - 1
|
|
@@ -247711,14 +245034,14 @@ function shadowMatches(style, spec2) {
|
|
|
247711
245034
|
}
|
|
247712
245035
|
function tileEffects(spec2) {
|
|
247713
245036
|
const { x, y } = shadowOffsets(spec2.distEmu, spec2.dir);
|
|
247714
|
-
const
|
|
245037
|
+
const clamp12 = (v) => Math.max(-4, Math.min(4, v * 0.6));
|
|
247715
245038
|
return {
|
|
247716
245039
|
shadow: {
|
|
247717
245040
|
color: "#000000",
|
|
247718
245041
|
opacity: Math.min(0.8, (spec2.alpha ?? 1e5) / 1e5 + 0.25),
|
|
247719
245042
|
blur: Math.min(6, spec2.blurEmu / EMU_PER_PX62 / 1.5),
|
|
247720
|
-
dx:
|
|
247721
|
-
dy:
|
|
245043
|
+
dx: clamp12(x),
|
|
245044
|
+
dy: clamp12(y) + (spec2.sy !== void 0 && spec2.sy < 0 ? 3 : 0),
|
|
247722
245045
|
inner: spec2.kind === "inner"
|
|
247723
245046
|
}
|
|
247724
245047
|
};
|
|
@@ -249131,9 +246454,9 @@ function effectFilter(style, id) {
|
|
|
249131
246454
|
merge.push('<feMergeNode in="glow"/>');
|
|
249132
246455
|
}
|
|
249133
246456
|
if (style.textShadowColor) {
|
|
249134
|
-
const
|
|
246457
|
+
const clamp12 = (v) => Math.max(-2, Math.min(2, (v ?? 0) / 2));
|
|
249135
246458
|
parts.push(
|
|
249136
|
-
`<feDropShadow dx="${num7(
|
|
246459
|
+
`<feDropShadow dx="${num7(clamp12(style.textShadowOffsetX))}" dy="${num7(clamp12(style.textShadowOffsetY))}" stdDeviation="${num7(Math.min(1.5, (style.textShadowBlur ?? 2) / 4))}" flood-color="${safeColor(style.textShadowColor, "#000000")}" flood-opacity="${num7(style.textShadowOpacity ?? 1)}" result="shadow"/>`
|
|
249137
246460
|
);
|
|
249138
246461
|
merge.push('<feMergeNode in="shadow"/>');
|
|
249139
246462
|
} else {
|
|
@@ -250810,9 +248133,6 @@ function getActiveXControlOverlayView(control, slideSize, index = 0, resolveFall
|
|
|
250810
248133
|
className: imageUrl ? "image" : "placeholder"
|
|
250811
248134
|
};
|
|
250812
248135
|
}
|
|
250813
|
-
init_bar_chart_3d_geometry();
|
|
250814
|
-
init_bar_chart_3d_face_fill();
|
|
250815
|
-
init_bar_chart_3d_materials();
|
|
250816
248136
|
init_chart_bar3d_face_picture_sample();
|
|
250817
248137
|
var BAR3D_SHAPE_OPTIONS = [
|
|
250818
248138
|
{ value: "box", labelKey: "pptx.chart.bar3DShapeBox" },
|
|
@@ -251478,10 +248798,6 @@ var ThreeViewController = class {
|
|
|
251478
248798
|
spec2.spec,
|
|
251479
248799
|
{
|
|
251480
248800
|
three,
|
|
251481
|
-
// No camera orbit: PowerPoint never rotates a chart or SmartArt
|
|
251482
|
-
// under the pointer, and an orbit would turn the scene while the
|
|
251483
|
-
// user drags the element to move it on the slide.
|
|
251484
|
-
OrbitControls: null,
|
|
251485
248801
|
size: this.size,
|
|
251486
248802
|
eventTarget: this.opts.eventTarget,
|
|
251487
248803
|
overlay,
|
|
@@ -251610,12 +248926,12 @@ function computeThreeViewSize(layoutWidth, layoutHeight, screenWidth, screenHeig
|
|
|
251610
248926
|
const dpr = Math.min(MAX_DEVICE_PIXEL_RATIO, Math.max(1, devicePixelRatio || 1));
|
|
251611
248927
|
const onScreenW = screenWidth > 0 ? screenWidth : width;
|
|
251612
248928
|
const onScreenH = screenHeight > 0 ? screenHeight : height;
|
|
251613
|
-
const
|
|
248929
|
+
const clamp12 = (px32) => Math.max(1, Math.min(MAX_VIEW_PIXELS, Math.round(px32)));
|
|
251614
248930
|
return {
|
|
251615
248931
|
width,
|
|
251616
248932
|
height,
|
|
251617
|
-
pixelWidth:
|
|
251618
|
-
pixelHeight:
|
|
248933
|
+
pixelWidth: clamp12(onScreenW * dpr),
|
|
248934
|
+
pixelHeight: clamp12(onScreenH * dpr)
|
|
251619
248935
|
};
|
|
251620
248936
|
}
|
|
251621
248937
|
function measureThreeViewSize(element) {
|
|
@@ -251657,6 +248973,7 @@ function createElementClass() {
|
|
|
251657
248973
|
#resize = null;
|
|
251658
248974
|
#intersect = null;
|
|
251659
248975
|
#poll = null;
|
|
248976
|
+
#teardownPending = false;
|
|
251660
248977
|
get spec() {
|
|
251661
248978
|
return this.#spec;
|
|
251662
248979
|
}
|
|
@@ -251665,9 +248982,7 @@ function createElementClass() {
|
|
|
251665
248982
|
return;
|
|
251666
248983
|
}
|
|
251667
248984
|
this.#spec = value;
|
|
251668
|
-
|
|
251669
|
-
void this.#controller?.setSpec(value);
|
|
251670
|
-
}
|
|
248985
|
+
void this.#controller?.setSpec(value);
|
|
251671
248986
|
}
|
|
251672
248987
|
get interactive() {
|
|
251673
248988
|
return this.hasAttribute("interactive");
|
|
@@ -251708,6 +249023,10 @@ function createElementClass() {
|
|
|
251708
249023
|
}
|
|
251709
249024
|
connectedCallback() {
|
|
251710
249025
|
this.setAttribute(THREE_VIEW_MARKER_ATTR, "");
|
|
249026
|
+
if (this.#controller) {
|
|
249027
|
+
this.#teardownPending = false;
|
|
249028
|
+
return;
|
|
249029
|
+
}
|
|
251711
249030
|
const root = this.shadowRoot ?? this.attachShadow({ mode: "open" });
|
|
251712
249031
|
if (!this.#canvas) {
|
|
251713
249032
|
root.innerHTML = `<style>${SHADOW_CSS}</style><div class="fallback" part="fallback"><slot></slot></div><div class="stage" part="stage"><canvas></canvas><div class="hit" part="hit"></div><div class="overlay" part="overlay"></div></div>`;
|
|
@@ -251735,6 +249054,15 @@ function createElementClass() {
|
|
|
251735
249054
|
void this.#controller.setSpec(this.#spec);
|
|
251736
249055
|
}
|
|
251737
249056
|
disconnectedCallback() {
|
|
249057
|
+
this.#teardownPending = true;
|
|
249058
|
+
queueMicrotask(() => {
|
|
249059
|
+
if (this.#teardownPending && !this.isConnected) {
|
|
249060
|
+
this.#teardown();
|
|
249061
|
+
}
|
|
249062
|
+
});
|
|
249063
|
+
}
|
|
249064
|
+
#teardown() {
|
|
249065
|
+
this.#teardownPending = false;
|
|
251738
249066
|
this.#resize?.disconnect();
|
|
251739
249067
|
this.#intersect?.disconnect();
|
|
251740
249068
|
if (this.#poll !== null) {
|
|
@@ -254431,24 +251759,42 @@ function isChart3DViewEnabled(flags, chartType) {
|
|
|
254431
251759
|
}
|
|
254432
251760
|
var chartSpecs = /* @__PURE__ */ new WeakMap();
|
|
254433
251761
|
var smartArtSpecs = /* @__PURE__ */ new WeakMap();
|
|
254434
|
-
|
|
254435
|
-
|
|
254436
|
-
|
|
251762
|
+
var lastByIdChart = /* @__PURE__ */ new Map();
|
|
251763
|
+
var lastByIdSmartArt = /* @__PURE__ */ new Map();
|
|
251764
|
+
var POSITION_KEYS = /* @__PURE__ */ new Set(["x", "y"]);
|
|
251765
|
+
function differsOnlyInPosition(a, b) {
|
|
251766
|
+
const ra = a;
|
|
251767
|
+
const rb = b;
|
|
251768
|
+
const keys = /* @__PURE__ */ new Set([...Object.keys(ra), ...Object.keys(rb)]);
|
|
251769
|
+
for (const key2 of keys) {
|
|
251770
|
+
if (!POSITION_KEYS.has(key2) && ra[key2] !== rb[key2]) {
|
|
251771
|
+
return false;
|
|
251772
|
+
}
|
|
254437
251773
|
}
|
|
254438
|
-
|
|
254439
|
-
const view = spec2 ? { kind: "chart", spec: spec2 } : null;
|
|
254440
|
-
chartSpecs.set(element, view);
|
|
254441
|
-
return view;
|
|
251774
|
+
return true;
|
|
254442
251775
|
}
|
|
254443
|
-
function
|
|
254444
|
-
if (
|
|
254445
|
-
return
|
|
251776
|
+
function memoised(element, byObject, byId, build7) {
|
|
251777
|
+
if (byObject.has(element)) {
|
|
251778
|
+
return byObject.get(element) ?? null;
|
|
254446
251779
|
}
|
|
254447
|
-
const
|
|
254448
|
-
const view =
|
|
254449
|
-
|
|
251780
|
+
const last = byId.get(element.id);
|
|
251781
|
+
const view = last && differsOnlyInPosition(last.element, element) ? last.view : build7();
|
|
251782
|
+
byObject.set(element, view);
|
|
251783
|
+
byId.set(element.id, { element, view });
|
|
254450
251784
|
return view;
|
|
254451
251785
|
}
|
|
251786
|
+
function chartThreeViewSpec(element) {
|
|
251787
|
+
return memoised(element, chartSpecs, lastByIdChart, () => {
|
|
251788
|
+
const spec2 = buildChart3DSpecForElement(element);
|
|
251789
|
+
return spec2 ? { kind: "chart", spec: spec2 } : null;
|
|
251790
|
+
});
|
|
251791
|
+
}
|
|
251792
|
+
function smartArtThreeViewSpec(element) {
|
|
251793
|
+
return memoised(element, smartArtSpecs, lastByIdSmartArt, () => {
|
|
251794
|
+
const spec2 = buildSmartArt3DSpecForElement(element);
|
|
251795
|
+
return spec2 ? { kind: "smartart", spec: spec2 } : null;
|
|
251796
|
+
});
|
|
251797
|
+
}
|
|
254452
251798
|
function resolveChartThreeViewSpec(element, flags) {
|
|
254453
251799
|
if (element.type !== "chart" || !isChart3DViewEnabled(flags, element.chartData?.chartType)) {
|
|
254454
251800
|
return null;
|