Normalize by given clade

components/content/RefseqDb.vue

@@ -25,26 +25,29 @@ onBeforeMount(async () => {
         index: toValue(dbName), query: "", params: {
             facets: ["*"],
             filter: [],
-            page: 1,
-            hitsPerPage: 25,
+            limit: 500000,
+            sort: ["type:asc"]
         }
     })
 
     autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
+    allHitsDb.value = toValue(data)?.hits
 
 })
-
+const allHitsDb = ref<Record<string, any>[] | undefined>(undefined)
 onMounted(async () => {
     const { data } = await useAsyncMeiliSearch({
         index: toValue(dbName), query: "", params: {
             facets: ["*"],
             filter: [],
-            page: 1,
-            hitsPerPage: 25,
+            // page: 1,
+            // hitsPerPage: 25,
+            limit: 500000,
+            sort: ["type:asc"]
         }
     })
-
     autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
+    allHitsDb.value = toValue(data)?.hits
 
 })
 
@@ -238,11 +241,12 @@ const computedDistriSystemOptions = computed(() => {
 
 // Taxo distri
 const computedTaxonomyDistribution = computed(() => {
-    const toValNormalizePerAssembly = toValue(normalizePerAssembly)
-    if (toValNormalizePerAssembly?.length > 0) {
-        return Object.entries(toValue(msResult).facetDistribution[selectedTaxoRank.value]).map(([key, value]) => {
+    const toValSelectedTaxoRank = toValue(selectedTaxoRank)
+    const toValFacetsPerRank = toValue(msResult)?.facetDistribution?.[toValSelectedTaxoRank]
+    if (toValFacetsPerRank) {
+        return Object.entries(toValFacetsPerRank).map(([key, value]) => {
             return {
-                [selectedTaxoRank.value]: key,
+                [toValSelectedTaxoRank]: key,
                 count: value
             }
         }).sort()
@@ -298,11 +302,27 @@ const binPlotOptions = ref({
     grid: true,
     x: { tickRotate: 90, tip: true, label: "Systems" },
     // y: { tickFormat: 's' },
-    color: { scheme: "plasma", legend: true },
+    color: { scheme: "plasma", legend: true, domain: [0, 100] },
+})
+
+
+const binPlotGroup = computed(() => {
+    return Plot.group(
+        {
+            fill: "count"
+        },
+        {
+            x: "type",
+            y: selectedTaxoRank.value,
+            tip: true,
+            inset: 0.5,
+            sort: { y: "fill" }
+        })
 })
 
 const binPlotDataOptions = computed(() => {
     const toValueAllHits = toValue(allHits)
+    const data = toValueAllHits?.hits ?? []
     return toValueAllHits?.hits?.length > 0 ? {
         ...binPlotOptions.value,
         width: width.value,
@@ -312,9 +332,47 @@ const binPlotDataOptions = computed(() => {
             type: scaleType.value,
             tickFormat: '~s',
             ticks: scaleType.value === 'symlog' ? 3 : 5,
+
         },
         marks: [
-            Plot.cell(toValueAllHits?.hits ?? [], Plot.group({ fill: "count" }, { x: "type", y: selectedTaxoRank.value, tip: true, inset: 0.5, sort: { y: "fill" } })),
+            Plot.cell(data, Plot.group(
+                {
+                    fill: {
+                        label: `Normalize by ${selectedTaxoRank.value} clade`,
+                        reduceIndex: function (I, X) {
+                            const toValAssemblyPerRank = toValue(assemblyPerRank)
+                            if (toValAssemblyPerRank?.size > 0) {
+                                const clade = X[I[0]][selectedTaxoRank.value]
+                                const system = X[I[0]].type
+                                console.log(I)
+                                console.log(X)
+                                // Get the list of item for this group
+                                const itemsPerGroup = d3.rollup(I.map(index => {
+                                    return X[index]
+                                }), D => D.length, d => d.type, d => d.Assembly)
+                                console.log(itemsPerGroup)
+                                // console.log(clade)
+                                // console.log(toValAssemblyPerRank.get(clade))
+                                const countForClade = toValAssemblyPerRank.get(clade).size
+                                // console.log(countForClade)
+                                // console.log(I);
+                                // console.log(X);
+
+                                const frequency = (itemsPerGroup.get(system).size / countForClade) * 100
+                                console.log(frequency)
+                                return frequency
+                            }
+                            return I.length
+                        }
+                    }
+                },
+                {
+                    x: "type",
+                    y: selectedTaxoRank.value,
+                    tip: true,
+                    inset: 0.5,
+                    sort: { y: "fill" }
+                }))
         ]
 
     } : null
@@ -357,11 +415,21 @@ const systemPerAssemblyPerRank = computed(() => {
     }
 })
 
-const assemblyPerRank = computed(() => {
+const systemPerRankPerAssembly = computed(() => {
     const toValueAllHits = toValue(allHits)
-
+    console.log("all hits dans system per...")
+    console.log(toValueAllHits)
     if (toValueAllHits && toValueAllHits?.hits?.length > 0) {
-        return d3.rollup(toValueAllHits.hits, D => D.length, d => d[toValue(selectedTaxoRank)], d => d.Assembly)
+        return d3.rollup(toValueAllHits.hits, D => D.length, d => d[toValue(selectedTaxoRank)], d => d.type, d => d.Assembly)
+    }
+})
+
+
+const assemblyPerRank = computed(() => {
+    const toValueAllHits = toValue(allHitsDb)
+
+    if (toValueAllHits && toValueAllHits?.length > 0) {
+        return d3.rollup(toValueAllHits, D => D.length, d => d[toValue(selectedTaxoRank)], d => d.Assembly)
     }
 })
 
@@ -585,8 +653,8 @@ async function downloadPng(component: ComponentPublicInstance | null, filename:
                     </v-chip>
                 </template>
                 <template #[`item.replicon`]="{ item }">
-                    <v-chip color="info" link size="small"
-                        :href="`https://www.ncbi.nlm.nih.gov/nuccore/${item.replicon}`" target="_blank"> {{
+                    <v-chip color="info" link size="small" :href="`https://www.ncbi.nlm.nih.gov/nuccore/${item.replicon}`"
+                        target="_blank"> {{
                             item.replicon }}
                     </v-chip>
                 </template>