diff --git a/src/components/Map/VMap.global.vue b/src/components/Map/VMap.global.vue
index 9a54fb0..c7f75e4 100644
--- a/src/components/Map/VMap.global.vue
+++ b/src/components/Map/VMap.global.vue
@@ -73,7 +73,12 @@ const props = defineProps({
   }
 })
 
-const emit = defineEmits(['geojson:ready', 'geojson'])
+const emit = defineEmits([
+  'geojson:ready',
+  'geojson',
+  'add:layer',
+  'draw:start'
+])
 
 let mapObject
 let observeMap
@@ -129,11 +134,12 @@ onMounted(() => {
       drawText: false,
       drawCircle: false,
       drawPolyline: false,
+      drawCircleMarker: false,
       drawMarker: false,
       cutPolygon: false
     })
 
-    mapObject.on('pm:create', () => {
+    mapObject.on('pm:create', (e) => {
       const fg = L.featureGroup()
 
       drawnItems.eachLayer((layer) => {
@@ -146,6 +152,12 @@ onMounted(() => {
       })
 
       emit('geojson', fg.toGeoJSON())
+      emit('add:layer', convertGeoJSONWithPointRadius(e.layer))
+    })
+
+    mapObject.on('pm:drawstart', (e) => {
+      clearDrawLayers()
+      emit('draw:start', e)
     })
   }
 
@@ -153,6 +165,20 @@ onMounted(() => {
   initEvents()
 })
 
+function clearDrawLayers() {
+  drawnItems.clearLayers()
+}
+
+function convertGeoJSONWithPointRadius(layer) {
+  const layerJson = layer.toGeoJSON()
+
+  if (typeof layer.getRadius === 'function') {
+    layerJson.properties.radius = layer.getRadius()
+  }
+
+  return layerJson
+}
+
 const resizeMap = () => {
   if (!geoJSONGroup) return
   const bounds = geoJSONGroup.getBounds()
@@ -194,6 +220,8 @@ const setGeoJSON = (geojson) => {
 
   emit('geojson:ready', geoJSONGroup)
 }
-</script>
 
-<style></style>
+defineExpose({
+  clearDrawLayers
+})
+</script>
diff --git a/src/components/Table/VTable.vue b/src/components/Table/VTable.global.vue
similarity index 100%
rename from src/components/Table/VTable.vue
rename to src/components/Table/VTable.global.vue
diff --git a/src/components/Table/VTableBody.vue b/src/components/Table/VTableBody.global.vue
similarity index 65%
rename from src/components/Table/VTableBody.vue
rename to src/components/Table/VTableBody.global.vue
index f9b2d7b..4cb74d5 100644
--- a/src/components/Table/VTableBody.vue
+++ b/src/components/Table/VTableBody.global.vue
@@ -1,5 +1,5 @@
 <template>
-  <tbody class="normal-case">
+  <tbody class="normal-case text-xs">
     <slot />
   </tbody>
 </template>
diff --git a/src/components/Table/VTableBodyCell.vue b/src/components/Table/VTableBodyCell.global.vue
similarity index 73%
rename from src/components/Table/VTableBodyCell.vue
rename to src/components/Table/VTableBodyCell.global.vue
index 26d8be9..027461c 100644
--- a/src/components/Table/VTableBodyCell.vue
+++ b/src/components/Table/VTableBodyCell.global.vue
@@ -1,5 +1,5 @@
 <template>
-  <td class="px-6 py-4">
+  <td class="px-4 py-4">
     <slot />
   </td>
 </template>
diff --git a/src/components/Table/VTableBodyRow.vue b/src/components/Table/VTableBodyRow.global.vue
similarity index 100%
rename from src/components/Table/VTableBodyRow.vue
rename to src/components/Table/VTableBodyRow.global.vue
diff --git a/src/components/Table/VTableHeader.vue b/src/components/Table/VTableHeader.global.vue
similarity index 100%
rename from src/components/Table/VTableHeader.vue
rename to src/components/Table/VTableHeader.global.vue
diff --git a/src/components/Table/VTableHeaderCell.vue b/src/components/Table/VTableHeaderCell.global.vue
similarity index 73%
rename from src/components/Table/VTableHeaderCell.vue
rename to src/components/Table/VTableHeaderCell.global.vue
index 031c04b..319e147 100644
--- a/src/components/Table/VTableHeaderCell.vue
+++ b/src/components/Table/VTableHeaderCell.global.vue
@@ -1,5 +1,5 @@
 <template>
-  <th class="px-6 py-3">
+  <th class="px-4 py-3">
     <slot />
   </th>
 </template>
diff --git a/src/components/Table/VTableHeaderRow.vue b/src/components/Table/VTableHeaderRow.global.vue
similarity index 100%
rename from src/components/Table/VTableHeaderRow.vue
rename to src/components/Table/VTableHeaderRow.global.vue
diff --git a/src/modules/otus/components/Panel/PanelMap/PanelMap.vue b/src/modules/otus/components/Panel/PanelMap/PanelMap.vue
index 7c3824e..4045082 100644
--- a/src/modules/otus/components/Panel/PanelMap/PanelMap.vue
+++ b/src/modules/otus/components/Panel/PanelMap/PanelMap.vue
@@ -1,19 +1,37 @@
 <template>
   <VCard>
     <VSpinner v-if="isLoading" />
-    <VMap
-      ref="map"
-      class="h-96 max-h-96"
-      :zoom="zoom"
-      :geojson="geojson"
-      @geojson:ready="isLoading = false"
-    />
-    <div v-if="false" class="text-sm flex flex-row justify-around">
+    <div class="relative">
+      <VMap
+        ref="map"
+        class="h-96 max-h-96"
+        :zoom="zoom"
+        :geojson="geojson"
+        @geojson:ready="isLoading = false"
+      />
+
+      <VButton
+        class="h-6 text-sm absolute right-3 top-3 z-[3000]"
+        primary
+        @click="() => (isOtuSearchVisible = true)"
+      >
+        Search
+      </VButton>
+      <OtuSearch
+        v-if="isOtuSearchVisible"
+        :otu="otu"
+        @close="() => (isOtuSearchVisible = false)"
+      />
+    </div>
+    <div
+      v-if="false"
+      class="text-sm flex flex-row justify-around"
+    >
       <div class="flex flex-row items-center p-2">
         <div class="w-3 h-3 bg-map-georeference m-1" />
         <span>Georeference</span>
       </div>
-      <div class="flex flex-row items-center p-2 ">
+      <div class="flex flex-row items-center p-2">
         <div class="w-3 h-3 m-1 bg-map-asserted" />
         <span>Asserted distribution</span>
       </div>
@@ -22,33 +40,37 @@
 </template>
 
 <script setup>
-import { ref, watch } from "vue"
+import { ref, watch } from 'vue'
 import TaxonWorks from '../../../services/TaxonWorks'
+import OtuSearch from '../../Search/OtuSearch.vue'
 
 const props = defineProps({
   otuId: {
     type: [String, Number],
     required: true
+  },
+
+  otu: {
+    type: Object,
+    required: true
   }
 })
 
 const zoom = 2
 const geojson = ref(undefined)
 const isLoading = ref(true)
+const isOtuSearchVisible = ref(false)
 
 watch(
   () => props.otuId,
   (newId, oldId) => {
-    if(newId === oldId) return
+    if (newId === oldId) return
     isLoading.value = true
 
     TaxonWorks.getOtuDistribution(props.otuId).then(({ data }) => {
-      geojson.value = data.request_too_large
-        ? null
-        : data
+      geojson.value = data.request_too_large ? null : data
     })
   },
   { immediate: true }
 )
-
 </script>
diff --git a/src/modules/otus/components/Search/ListResults.vue b/src/modules/otus/components/Search/ListResults.vue
new file mode 100644
index 0000000..35272a3
--- /dev/null
+++ b/src/modules/otus/components/Search/ListResults.vue
@@ -0,0 +1,45 @@
+<template>
+  <VTable v-if="list.length">
+    <VTableHeader>
+      <VTableHeaderRow>
+        <VTableHeaderCell
+          class="w-full flex justify-between box-border items-center"
+        >
+          <span>OTU</span>
+          <IconClose
+            class="opacity-30 cursor-pointer"
+            @click="emit('close:table')"
+          />
+        </VTableHeaderCell>
+      </VTableHeaderRow>
+    </VTableHeader>
+    <VTableBody>
+      <VTableBodyRow
+        v-for="otu in list"
+        :key="otu.id"
+      >
+        <VTableBodyCell>
+          <RouterLink
+            v-html="otu.object_tag"
+            :to="{ name: 'otus-id', params: { id: otu.id } }"
+            @click="() => emit('close')"
+          />
+        </VTableBodyCell>
+      </VTableBodyRow>
+    </VTableBody>
+  </VTable>
+  <div class="text-lg text-center text-base-lighter align-middle p-4">
+    No OTUs found in this area
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  list: {
+    type: Array,
+    default: () => []
+  }
+})
+
+const emit = defineEmits(['close', 'close:table'])
+</script>
diff --git a/src/modules/otus/components/Search/OtuSearch.vue b/src/modules/otus/components/Search/OtuSearch.vue
new file mode 100644
index 0000000..96ca565
--- /dev/null
+++ b/src/modules/otus/components/Search/OtuSearch.vue
@@ -0,0 +1,101 @@
+<template>
+  <div
+    ref="root"
+    class="w-screen h-screen fixed top-0 left-0 z-[5000]"
+  >
+    <VSpinner v-if="isLoading" />
+    <SearchBar
+      :label="otu.object_tag"
+      @search="loadOTUs"
+      @close="() => emit('close')"
+    />
+    <div class="relative">
+      <VMap
+        ref="mapRef"
+        class="w-screen h-screen"
+        controls
+        @draw:start="() => (geojson = {})"
+        @add:layer="
+          ($event) => {
+            geoJson = JSON.stringify($event.geometry)
+          }
+        "
+        :zoom="4"
+      />
+      <div
+        class="h-screen md:w-96 absolute top-0 bg-base-background z-[2000] overflow-auto ease-in-out duration-300 w-full"
+        :class="{
+          'md:-right-96 -right-full': !isTableVisible,
+          'right-0': isTableVisible
+        }"
+      >
+        <ListResults
+          v-if="isTableVisible"
+          :list="list"
+          @close="() => emit('close')"
+          @close:table="() => (isTableVisible = false)"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, onUnmounted, watch } from 'vue'
+import { makeAPIRequest } from '@/utils/request'
+import SearchBar from './SearchBar.vue'
+import ListResults from './ListResults.vue'
+
+const props = defineProps({
+  otu: {
+    type: Array,
+    default: () => []
+  }
+})
+
+const root = ref()
+const emit = defineEmits(['close'])
+const geoJson = ref({})
+const mapRef = ref(null)
+const list = ref([])
+const isTableVisible = ref(false)
+const isLoading = ref()
+
+onMounted(() => {
+  document.addEventListener('keyup', handleKeyboard)
+  document.body.classList.add('overflow-hidden')
+})
+
+onUnmounted(() => {
+  document.removeEventListener('keyup', handleKeyboard)
+  document.body.classList.remove('overflow-hidden')
+})
+
+const handleKeyboard = ({ key }) => {
+  switch (key) {
+    case 'Escape':
+      emit('close')
+      break
+  }
+}
+
+function loadOTUs() {
+  const payload = {
+    geo_json: geoJson.value,
+    taxon_name_id: [props.otu.taxon_name_id],
+    descendants: true
+  }
+
+  isLoading.value = true
+
+  makeAPIRequest
+    .get('/otus.json', { params: payload })
+    .then(({ data }) => {
+      list.value = data
+      isTableVisible.value = true
+    })
+    .finally((_) => {
+      isLoading.value = false
+    })
+}
+</script>
diff --git a/src/modules/search/otus/SearchBar.vue b/src/modules/otus/components/Search/SearchBar.vue
similarity index 71%
rename from src/modules/search/otus/SearchBar.vue
rename to src/modules/otus/components/Search/SearchBar.vue
index f443cea..785e2d0 100644
--- a/src/modules/search/otus/SearchBar.vue
+++ b/src/modules/otus/components/Search/SearchBar.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="bottom-0 w-screen bg-base-foreground z-[1000] left-0 p-4 text-sm flex flex-row justify-between align-middle box-border"
+    class="bottom-0 w-screen bg-base-foreground z-[1000] left-0 p-4 text-sm flex flex-row justify-between align-middle box-border border-b border-base-muted"
   >
     <div>
       <VButton
@@ -9,6 +9,10 @@
       >
         Search
       </VButton>
+      <span
+        class="ml-2"
+        v-html="label"
+      />
     </div>
     <IconClose
       class="cursor-pointer"
@@ -19,4 +23,11 @@
 
 <script setup>
 const emit = defineEmits(['search', 'close'])
+
+const props = defineProps({
+  label: {
+    type: String,
+    required: true
+  }
+})
 </script>
diff --git a/src/modules/otus/views/Index.vue b/src/modules/otus/views/Index.vue
index 6630a9a..129e676 100644
--- a/src/modules/otus/views/Index.vue
+++ b/src/modules/otus/views/Index.vue
@@ -21,7 +21,7 @@
           />
         </div>
 
-        <div class="mt-8">
+        <div class="mt-8 flex justify-between middle">
           <TaxaInfo
             :taxon="taxon"
             :otu-id="otu.id"
@@ -51,11 +51,15 @@
           :taxon="taxon"
           :taxon-rank="taxon.rank_string"
           :otu-id="otu.id"
+          :otu="otu"
         />
       </div>
     </div>
   </div>
-  <OtuSearch />
+  <OtuSearch
+    v-if="isOtuSearchVisible"
+    @close="() => (isOtuSearchVisible = false)"
+  />
 </template>
 
 <script setup>
@@ -64,13 +68,13 @@ import { useRoute, useRouter } from 'vue-router'
 import Breadcrumb from '../components/Breadcrumb/Breadcrumb.vue'
 import TaxaInfo from '../components/TaxaInfo.vue'
 import TaxonWorks from '../services/TaxonWorks'
-import OtuSearch from '@/modules/search/otus/OtuSearch.vue'
 //import useChildrenRoutes from '../composables/useChildrenRoutes'
 
 const route = useRoute()
 const router = useRouter()
 const routeParams = ref(route.params)
 const tabs = [] // useChildrenRoutes()
+const isOtuSearchVisible = ref(false)
 
 router.afterEach((route) => {
   routeParams.value = route.params
diff --git a/src/modules/otus/views/Overview.vue b/src/modules/otus/views/Overview.vue
index 28d19dc..2209191 100644
--- a/src/modules/otus/views/Overview.vue
+++ b/src/modules/otus/views/Overview.vue
@@ -3,13 +3,14 @@
     <div class="grid grid-cols-1 gap-3 md:grid-cols-2">
       <div class="grid grid-cols-1 gap-3 auto-rows-min">
         <template
-          v-for="({ component, available }) in overviewLayout.left"
+          v-for="{ component, available } in overviewLayout.left"
           :key="component"
         >
           <component
             :is="component"
             v-if="!available || isComponentForRank(available, taxonRank)"
             :otu-id="otuId"
+            :otu="otu"
             :taxon-id="taxonId"
             :taxon="taxon"
           />
@@ -17,13 +18,14 @@
       </div>
       <div class="grid grid-cols-1 auto-rows-min gap-3">
         <template
-          v-for="({ component, available }) in overviewLayout.right"
+          v-for="{ component, available } in overviewLayout.right"
           :key="component"
         >
           <component
             :is="component"
             v-if="!available || isComponentForRank(available, taxonRank)"
             :otu-id="otuId"
+            :otu="otu"
             :taxon-id="taxonId"
             :taxon="taxon"
           />
@@ -52,12 +54,17 @@ defineProps({
     required: true
   },
 
+  otu: {
+    type: Object,
+    required: true
+  },
+
   taxon: {
     type: Object,
     required: true
   }
 })
 
-const isComponentForRank = (available, rankString) => available.some(rankGroup => rankString?.includes(rankGroup))
-
-</script>
\ No newline at end of file
+const isComponentForRank = (available, rankString) =>
+  available.some((rankGroup) => rankString?.includes(rankGroup))
+</script>
diff --git a/src/modules/search/otus/OtuSearch.vue b/src/modules/search/otus/OtuSearch.vue
deleted file mode 100644
index 6b6502d..0000000
--- a/src/modules/search/otus/OtuSearch.vue
+++ /dev/null
@@ -1,53 +0,0 @@
-<template>
-  <div
-    ref="root"
-    class="w-screen h-screen fixed top-0 left-0 z-[5000]"
-  >
-    <SearchBar @search="loadOTUs" />
-    <div class="relative">
-      <VMap
-        class="w-screen h-screen"
-        controls
-        @geojson="
-          ($event) =>
-            (parameters.geo_json = JSON.stringify(
-              $event.features.map((feature) => feature.geometry)[0]
-            ))
-        "
-        :zoom="4"
-      />
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, onMounted, onUnmounted } from 'vue'
-import { makeAPIRequest } from '@/utils/request'
-import SearchBar from './SearchBar.vue'
-
-const root = ref()
-const emit = defineEmits(['close'])
-const parameters = ref({})
-
-onMounted(() => {
-  document.addEventListener('keyup', handleKeyboard)
-  document.body.classList.add('overflow-hidden')
-})
-
-onUnmounted(() => {
-  document.removeEventListener('keyup', handleKeyboard)
-  document.body.classList.remove('overflow-hidden')
-})
-
-const handleKeyboard = ({ key }) => {
-  switch (key) {
-    case 'Escape':
-      emit('close')
-      break
-  }
-}
-
-function loadOTUs() {
-  makeAPIRequest.get('/otus.json', { params: parameters.value })
-}
-</script>