feat(mapa): Adiciona mapa de especies

Author: phenome

web/src/components/Map.astro

@@ -1,21 +1,25 @@
 ---
 interface Props {
-  stateList: string[]
+  full?: boolean
+  data?: [string, any][]
+  stateList?: string[]
 }
 
-const { stateList } = Astro.props
-const data = [
-  ['Estado', 'Ocorrência'],
-  ...stateList.map((state) => [state, state])
-]
+const { full, stateList } = Astro.props
+const data =
+  Astro.props.data ??
+  (stateList && [
+    ['Estado', 'Ocorrência'],
+    ...stateList.map((state) => [state, state])
+  ])
 ---
 
 <script type="module">
   import 'https://cdn.skypack.dev/@google-web-components/google-chart'
 </script>
 
 <google-chart
-  class="h-[200px] w-auto"
+  class={full ? 'w-full h-full' : 'h-[200px] w-auto'}
   type="geo"
   data={JSON.stringify(data)}
   options='{"region":"BR", "resolution":"provinces","title":"Ocorrências"}'

web/src/lib/mongo.ts

@@ -72,6 +72,32 @@ export async function countTaxa(filter: Record<string, unknown> = {}) {
   return await taxa.countDocuments(filter)
 }
 
+export async function countTaxaRegions() {
+  const taxa = await getCollection('dwc2json', 'taxa')
+  return await taxa
+    .aggregate([
+      {
+        $match: {
+          taxonomicStatus: 'NOME ACEITO'
+        }
+      },
+      {
+        $unwind: {
+          path: '$distribution.occurrence'
+        }
+      },
+      {
+        $group: {
+          _id: '$distribution.occurrence',
+          count: {
+            $count: {}
+          }
+        }
+      }
+    ])
+    .toArray()
+}
+
 export async function getTaxon(
   kingdom: 'Plantae' | 'Fungi' | 'Animalia',
   id: string,

web/src/pages/mapa.astro

@@ -0,0 +1,18 @@
+---
+import Map from '../components/Map.astro'
+import { countTaxaRegions } from '../lib/mongo'
+
+const taxaRegions: { _id: string; count: number }[] = await countTaxaRegions()
+---
+
+<div
+  class="h-screen w-screen flex items-stretch justify-stretch overflow-hidden"
+>
+  <Map
+    full
+    data={[
+      ['Estado', 'Taxa'],
+      ...taxaRegions.map(({ _id, count }) => [_id, count] as [string, number])
+    ]}
+  />
+</div>

web/src/pages/taxa.astro

@@ -1,8 +1,6 @@
 ---
 import BaseLayout from '../layouts/base.astro'
-import { listTaxaPaginated } from '../lib/mongo'
-
-import { countTaxa } from '../lib/mongo'
+import { countTaxa, listTaxaPaginated } from '../lib/mongo'
 
 const taxaNum = await countTaxa()
 
@@ -43,8 +41,8 @@ const searchParamsWithPage = (page: number) => {
 }
 ---
 
-<img src="/logoReflora.svg" alt="Reflora Logo" />
-<BaseLayout useTransition title="Procura de Taxa">
+<BaseLayout title="Procura de Taxa">
+  <img src="/logoReflora.svg" alt="Reflora Logo" />
   <section class="m-2 p-2 border rounded border-slate-400 inline-block">
     <h2 class="text-xl font-bold">Filtro</h2>
     <form class="inline-flex flex-col gap-1">