(fix) 円グラフが出ない

This commit is contained in:
kakkokari-gtyih 2023-12-18 16:49:33 +09:00
parent 4c47eb20ee
commit 6d1d5efb66

View File

@ -2,6 +2,9 @@
<svg viewBox="-3 -3 70 70"> <svg viewBox="-3 -3 70 70">
<circle <circle
v-for="(item, index) in sortedData" v-for="(item, index) in sortedData"
cx="32"
cy="32"
r="16"
:class="[ :class="[
$style.pie, $style.pie,
(focusedIndex === index) && $style.focused, (focusedIndex === index) && $style.focused,
@ -90,7 +93,7 @@ const dasharrays = computed(() => {
function getStyle(index: number) { function getStyle(index: number) {
return `stroke: rgb(${steppedColors.value[index][0]}, ${steppedColors.value[index][1]}, ${steppedColors.value[index][2]}); return `stroke: rgb(${steppedColors.value[index][0]}, ${steppedColors.value[index][1]}, ${steppedColors.value[index][2]});
--dasharray: ${dasharrays.value[index]}`; stroke-dasharray: ${dasharrays.value[index]}`;
} }
onMounted(() => { onMounted(() => {
@ -109,12 +112,8 @@ onMounted(() => {
@apply transition-transform; @apply transition-transform;
transform-origin: center; transform-origin: center;
fill: transparent; fill: transparent;
cx: 32;
cy: 32;
r: 16;
stroke-width: 32; stroke-width: 32;
stroke-dashoffset: 25; stroke-dashoffset: 25;
stroke-dasharray: var(--dasharray);
} }
.focused.pie { .focused.pie {