チャートの連合グラフでその他が割合計算に含まれない問題を修正 (kokonect-link#439)

penginn-net · Sep 15, 2024 · 7949122 · 7949122
1 parent 4ae086f
commit 7949122
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 8 deletions.
diff --git a/packages/frontend/src/components/MkInstanceStats.vue b/packages/frontend/src/components/MkInstanceStats.vue
@@ -164,8 +164,8 @@ onMounted(() => {
 			value: number,
 			onClick?: () => void,
 		}[];
-		let totalFollowersCount = fedStats.topSubInstances.reduce((partialSum, a) => partialSum + a.followersCount, 0);
-		let totalFollowingCount = fedStats.topPubInstances.reduce((partialSum, a) => partialSum + a.followingCount, 0);
+		let totalFollowersCount = fedStats.topSubInstances.reduce((partialSum, a) => partialSum + a.followersCount, 0) + fedStats.otherFollowersCount;
+		let totalFollowingCount = fedStats.topPubInstances.reduce((partialSum, a) => partialSum + a.followingCount, 0) + fedStats.otherFollowingCount;
 
 		const { handler: externalTooltipHandler1 } = useChartTooltip({
 			position: 'middle',

diff --git a/packages/frontend/src/pages/admin/overview.federation.vue b/packages/frontend/src/pages/admin/overview.federation.vue
@@ -10,12 +10,12 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<div v-if="topSubInstancesForPie && topPubInstancesForPie" class="pies">
 			<div class="pie deliver _panel">
 				<div class="title">Sub</div>
-				<XPie :data="topSubInstancesForPie" class="chart"/>
+				<XPie :data="topSubInstancesForPie" :total="totalFollowersCount" class="chart"/>
 				<div class="subTitle">Top 10</div>
 			</div>
 			<div class="pie inbox _panel">
 				<div class="title">Pub</div>
-				<XPie :data="topPubInstancesForPie" class="chart"/>
+				<XPie :data="topPubInstancesForPie" :total="totalFollowingCount" class="chart"/>
 				<div class="subTitle">Top 10</div>
 			</div>
 		</div>
@@ -55,6 +55,8 @@ import MkNumberDiff from '@/components/MkNumberDiff.vue';
 import { i18n } from '@/i18n.js';
 import { useChartTooltip } from '@/scripts/use-chart-tooltip.js';
 
+const totalFollowersCount = ref<number | undefined>(undefined);
+const totalFollowingCount = ref<number | undefined>(undefined);
 const topSubInstancesForPie = ref<InstanceForPie[] | null>(null);
 const topPubInstancesForPie = ref<InstanceForPie[] | null>(null);
 const federationPubActive = ref<number | null>(null);
@@ -73,6 +75,8 @@ onMounted(async () => {
 	federationSubActiveDiff.value = chart.subActive[0] - chart.subActive[1];
 
 	misskeyApiGet('federation/stats', { limit: 10 }).then(res => {
+		totalFollowersCount.value = res.topSubInstances.reduce((partialSum, a) => partialSum + a.followersCount, 0) + res.otherFollowersCount;
+		totalFollowingCount.value = res.topPubInstances.reduce((partialSum, a) => partialSum + a.followingCount, 0) + res.otherFollowingCount;
 		topSubInstancesForPie.value = [
 			...res.topSubInstances.map(x => ({
 				name: x.host,

diff --git a/packages/frontend/src/pages/admin/overview.pie.vue b/packages/frontend/src/pages/admin/overview.pie.vue
@@ -24,17 +24,18 @@ initChart();
 
 const props = defineProps<{
 	data: InstanceForPie[];
+	total?:number;
 }>();
 
 const chartEl = shallowRef<HTMLCanvasElement>(null);
 
-const { handler: externalTooltipHandler } = useChartTooltip({
-	position: 'middle',
-});
-
 let chartInstance: Chart;
 
 onMounted(() => {
+	const { handler: externalTooltipHandler } = useChartTooltip({
+		position: 'middle',
+		total: props.total,
+	});
 	chartInstance = new Chart(chartEl.value, {
 		type: 'doughnut',
 		data: {