add a log10 transform

components/content/RefseqDb.vue

@@ -10,6 +10,8 @@ const facetStore = useFacetsStore()
 const sortBy: Ref<{ key: string, order: string }[]> = ref([{ key: 'type', order: "asc" }])
 const itemValue = ref("id");
 const { width } = useDisplay();
+const fullWidth = ref(false)
+const logTransform = ref(false)
 const distriTaxoFullscreen = ref(false)
 const distriSystemFullscreen = ref(false)
 const facets = ref([
@@ -78,7 +80,7 @@ const defaultBarPlotOptions = computed(() => {
 const computedSystemDistribution = computed(() => {
     if (facetStore.facets?.facetDistribution?.type) {
         return Object.entries(facetStore.facets.facetDistribution.type).map(([key, value]) => {
-            return { type: key, count: value }
+            return { type: key, count: logTransform.value ? Math.log10(value) : value }
         }).sort()
     } else { return [] }
 
@@ -104,7 +106,7 @@ const computedDistriSystemOptions = computed(() => {
 const computedTaxonomyDistribution = computed(() => {
     if (facetStore.facets?.facetDistribution?.[selectedTaxoRank.value]) {
         return Object.entries(facetStore.facets.facetDistribution[selectedTaxoRank.value]).map(([key, value]) => {
-            return { [selectedTaxoRank.value]: key, count: value }
+            return { [selectedTaxoRank.value]: key, count: logTransform.value ? Math.log10(value) : value }
         }).sort()
     } else { return [] }
 
@@ -136,23 +138,27 @@ function capitalize([first, ...rest]) {
 
 <template>
     <v-card flat class="mb-2">
+        <v-toolbar density="compact">
+            <!-- <v-spacer></v-spacer> -->
+            <v-toolbar-items>
+                <v-btn variant="plain" :icon="fullWidth ? 'md:fullscreen_exit' : 'md:fullscreen'"
+                    @click="fullWidth = !fullWidth"></v-btn>
+                <v-switch v-model="logTransform" color="primary" hide-details="auto" inline label="Log transform" density="compact"></v-switch>
+            </v-toolbar-items>
+        </v-toolbar>
         <v-row align="start" class="mb-2">
-            <v-col :cols="distriSystemFullscreen ? 12 : 6" :class="distriTaxoFullscreen ? 'd-none' : null">
+            <v-col :cols="fullWidth ? 12 : 6">
                 <v-card flat class="my-3">
-                    <v-card-title> Systems Distribution <v-btn variant="plain"
-                            :icon="distriSystemFullscreen ? 'md:fullscreen_exit' : 'md:fullscreen'"
-                            @click="distriSystemFullscreen = !distriSystemFullscreen"></v-btn></v-card-title>
+                    <v-card-title> Systems Distribution </v-card-title>
 
                     <v-card-text>
                         <PlotFigure :options="unref(computedDistriSystemOptions)" defer></PlotFigure>
                     </v-card-text>
                 </v-card>
             </v-col>
-            <v-col :cols="distriTaxoFullscreen ? 12 : 6" :class="distriSystemFullscreen ? 'd-none' : null">
+            <v-col :cols="fullWidth ? 12 : 6">
                 <v-card flat>
-                    <v-card-title> Taxonomic Distribution <v-btn variant="plain"
-                            :icon="distriTaxoFullscreen ? 'md:fullscreen_exit' : 'md:fullscreen'"
-                            @click="distriTaxoFullscreen = !distriTaxoFullscreen"></v-btn></v-card-title>
+                    <v-card-title> Taxonomic Distribution </v-card-title>
                     <v-card-text>
                         <v-select v-model="selectedTaxoRank" :items="availableTaxo" density="compact"
                             label="Select taxonomic rank"></v-select>