@cardenelabs/cdl 0.40.4 → 0.40.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -1
- package/dist/index.cjs +44 -11
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +44 -11
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +44 -11
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +44 -11
- package/dist/react.js.map +1 -1
- package/package.json +1 -1
- package/src/kinds/chart-gauge.tsx +88 -17
package/dist/index.js
CHANGED
|
@@ -24890,13 +24890,46 @@ function ChartGaugeNode({
|
|
|
24890
24890
|
const \u5F27\u3068\u5185\u8A33\u306E\u9593 = 16;
|
|
24891
24891
|
const \u5370\u306E\u5E452 = 30;
|
|
24892
24892
|
const \u533A\u753B\u306E\u9593 = 12;
|
|
24893
|
-
const \
|
|
24894
|
-
const \
|
|
24895
|
-
|
|
24896
|
-
|
|
24897
|
-
|
|
24893
|
+
const \u6570\u5024\u306E\u884C = (d) => `${\u5B9F\u5024\u8868\u8A18(d.value)} ${\u5272\u5408\u8868\u8A18(d.value / total)}`;
|
|
24894
|
+
const \u5272\u308A\u4ED8\u3051\u308B = (\u4EF6\u305F\u3061) => {
|
|
24895
|
+
const \u5E45 = Math.max(\u5370\u306E\u5E452, ...\u4EF6\u305F\u3061.map((d) => textWidth(\u6570\u5024\u306E\u884C(d), \u6570\u5024\u306E\u7D1A))) + \u533A\u753B\u306E\u9593;
|
|
24896
|
+
const \u884C\u306E\u4EF6\u65702 = Math.min(
|
|
24897
|
+
Math.max(1, Math.floor(\u4F7F\u3048\u308B\u5E452 / Math.max(\u5E45, 1))),
|
|
24898
|
+
Math.max(\u4EF6\u305F\u3061.length, 1)
|
|
24899
|
+
);
|
|
24900
|
+
return { \u884C\u306E\u4EF6\u6570: \u884C\u306E\u4EF6\u65702, \u6BB5\u6570: Math.ceil(Math.max(\u4EF6\u305F\u3061.length, 1) / \u884C\u306E\u4EF6\u65702) };
|
|
24901
|
+
};
|
|
24902
|
+
const \u5F27\u306B\u6B8B\u3059\u9AD8\u3055 = 48;
|
|
24903
|
+
const \u7F6E\u3051\u308B\u6BB5\u6570 = Math.max(
|
|
24904
|
+
1,
|
|
24905
|
+
Math.floor((\u4F7F\u3048\u308B\u9AD8\u3055 - \u5F27\u306B\u6B8B\u3059\u9AD8\u3055 - \u5F27\u3068\u5185\u8A33\u306E\u9593) / \u6BB5\u306E\u9AD8\u3055)
|
|
24898
24906
|
);
|
|
24899
|
-
const \
|
|
24907
|
+
const \u7573\u3080 = (\u6B8B\u3059\u4EF6\u6570) => {
|
|
24908
|
+
if (\u6B8B\u3059\u4EF6\u6570 >= data.length) return data;
|
|
24909
|
+
const \u524D = data.slice(0, Math.max(0, \u6B8B\u3059\u4EF6\u6570 - 1));
|
|
24910
|
+
const \u6B8B\u308A = data.slice(Math.max(0, \u6B8B\u3059\u4EF6\u6570 - 1));
|
|
24911
|
+
const \u5024 = \u6B8B\u308A.reduce((acc, d) => acc + d.value, 0);
|
|
24912
|
+
const \u8AAD\u3081\u306A\u3044 = \u6B8B\u308A.some((d) => d.unresolved);
|
|
24913
|
+
const \u7573\u3093\u3060 = {
|
|
24914
|
+
...\u6B8B\u308A[0],
|
|
24915
|
+
label: "\u305D\u306E\u4ED6",
|
|
24916
|
+
value: \u5024,
|
|
24917
|
+
previous: void 0,
|
|
24918
|
+
...\u8AAD\u3081\u306A\u3044 ? { unresolved: true } : { unresolved: void 0 }
|
|
24919
|
+
};
|
|
24920
|
+
return [...\u524D, \u7573\u3093\u3060];
|
|
24921
|
+
};
|
|
24922
|
+
const \u51FA\u3059\u4EF6\u305F\u3061 = (() => {
|
|
24923
|
+
let \u4EF6\u305F\u3061 = data;
|
|
24924
|
+
for (let i = 0; i < 4; i++) {
|
|
24925
|
+
const { \u884C\u306E\u4EF6\u6570: \u884C\u306E\u4EF6\u65702, \u6BB5\u6570 } = \u5272\u308A\u4ED8\u3051\u308B(\u4EF6\u305F\u3061);
|
|
24926
|
+
if (\u6BB5\u6570 <= \u7F6E\u3051\u308B\u6BB5\u6570) return \u4EF6\u305F\u3061;
|
|
24927
|
+
\u4EF6\u305F\u3061 = \u7573\u3080(Math.max(1, \u7F6E\u3051\u308B\u6BB5\u6570 * \u884C\u306E\u4EF6\u65702));
|
|
24928
|
+
}
|
|
24929
|
+
return \u4EF6\u305F\u3061;
|
|
24930
|
+
})();
|
|
24931
|
+
const \u5185\u8A33\u306E\u6570\u5024 = \u51FA\u3059\u4EF6\u305F\u3061.map((d) => \u6570\u5024\u306E\u884C(d));
|
|
24932
|
+
const { \u884C\u306E\u4EF6\u6570, \u6BB5\u6570: \u5185\u8A33\u306E\u6BB5\u6570 } = \u5272\u308A\u4ED8\u3051\u308B(\u51FA\u3059\u4EF6\u305F\u3061);
|
|
24900
24933
|
const \u5185\u8A33\u306E\u9AD8\u3055 = \u6BB5\u306E\u9AD8\u3055 * \u5185\u8A33\u306E\u6BB5\u6570;
|
|
24901
24934
|
const \u5F27\u306B\u4F7F\u3048\u308B\u9AD8\u3055 = \u4F7F\u3048\u308B\u9AD8\u3055 - \u5185\u8A33\u306E\u9AD8\u3055 - \u5F27\u3068\u5185\u8A33\u306E\u9593;
|
|
24902
24935
|
const radius = Math.max(24, Math.min(\u5F27\u306B\u4F7F\u3048\u308B\u9AD8\u3055, \u4F7F\u3048\u308B\u5E452 / 2));
|
|
@@ -24904,7 +24937,7 @@ function ChartGaugeNode({
|
|
|
24904
24937
|
const cx = node.w / 2;
|
|
24905
24938
|
const cy = PAD_TOP2 + radius;
|
|
24906
24939
|
let cumFrac = 0;
|
|
24907
|
-
const slices =
|
|
24940
|
+
const slices = \u51FA\u3059\u4EF6\u305F\u3061.map((d) => {
|
|
24908
24941
|
const frac = d.value / total;
|
|
24909
24942
|
const a0 = Math.PI + cumFrac * Math.PI;
|
|
24910
24943
|
const a1 = a0 + frac * Math.PI;
|
|
@@ -24917,10 +24950,10 @@ function ChartGaugeNode({
|
|
|
24917
24950
|
return { d, frac, path };
|
|
24918
24951
|
});
|
|
24919
24952
|
const \u5408\u8A08\u306E\u6587\u5B57 = \u5B9F\u5024\u8868\u8A18(Math.round(total));
|
|
24920
|
-
const \
|
|
24953
|
+
const \u5358\u4F4D\u5E45 = Math.max(textWidth(\u5408\u8A08\u306E\u6587\u5B57, 100), 1) / 100;
|
|
24921
24954
|
const \u7D1A\u306E\u5019\u88DC = Math.min(
|
|
24922
|
-
// 横 =
|
|
24923
|
-
\
|
|
24955
|
+
// 横 = 字の上の角が内側の円に入る大きさ
|
|
24956
|
+
\u5185\u534A\u5F84 / Math.sqrt((\u5358\u4F4D\u5E45 / 2) ** 2 + 1.25 ** 2),
|
|
24924
24957
|
// 縦 = 合計 1 行 + 見出し 1 行が内側の高さに収まる比
|
|
24925
24958
|
\u5185\u534A\u5F84 * 0.52
|
|
24926
24959
|
);
|
|
@@ -24983,7 +25016,7 @@ function ChartGaugeNode({
|
|
|
24983
25016
|
children: "\u5408\u8A08"
|
|
24984
25017
|
}
|
|
24985
25018
|
),
|
|
24986
|
-
|
|
25019
|
+
\u51FA\u3059\u4EF6\u305F\u3061.map((d, idx) => {
|
|
24987
25020
|
const \u5217 = idx % \u884C\u306E\u4EF6\u6570;
|
|
24988
25021
|
const \u6BB5 = Math.floor(idx / \u884C\u306E\u4EF6\u6570);
|
|
24989
25022
|
const x = PAD_SIDE + \u5185\u8A33\u306E\u5E45 * \u5217;
|