Linear volume heatmap visualization

plate-tool-web/src/components/callbacks/main_window_callbacks.rs

@@ -43,6 +43,17 @@ pub fn toggle_in_transfer_hashes_callback(
     })
 }
 
+pub fn toggle_volume_heatmap_callback(
+    main_dispatch: Dispatch<MainState>,
+) -> Callback<web_sys::MouseEvent> {
+    let main_dispatch = main_dispatch.clone();
+    Callback::from(move |_| {
+        main_dispatch.reduce_mut(|state| {
+            state.preferences.volume_heatmap ^= true;
+        })
+    })
+}
+
 pub fn new_plate_dialog_callback(
     new_plate_dialog_is_open: UseStateHandle<bool>,
 ) -> NoParamsCallback {

plate-tool-web/src/components/main_window.rs

@@ -43,6 +43,11 @@ pub fn MainWindow() -> Html {
         main_window_callbacks::toggle_in_transfer_hashes_callback(main_dispatch)
     };
     
+    let toggle_volume_heatmap_callback = {
+        let main_dispatch = main_dispatch.clone();
+        main_window_callbacks::toggle_volume_heatmap_callback(main_dispatch)
+    };
+
     let new_plate_dialog_is_open = use_state_eq(|| false);
     let new_plate_dialog_callback =
         main_window_callbacks::new_plate_dialog_callback(new_plate_dialog_is_open.clone());
@@ -98,6 +103,7 @@ pub fn MainWindow() -> Html {
                     <button>{"Styles"}</button>
                     <div>
                     <button onclick={toggle_in_transfer_hashes_callback}>{"Toggle transfer hashes"}</button>
+                    <button onclick={toggle_volume_heatmap_callback}>{"Toggle volume heatmap"}</button>
                     </div>
                 </div>
             </div>

plate-tool-web/src/components/plates/plate.rs

@@ -40,26 +40,40 @@ pub fn Plate(props: &PlateProps) -> Html {
         m_end_handle.set(Some(pt2));
     }
 
-    let tooltip_map = {
+    let tooltip_map: HashMap<(u8, u8), Vec<&Transfer>>;
+    let volume_map: HashMap<(u8, u8), f32>;
+    let volume_max: f32;
+    {
         let transfers = main_state.transfers.iter().filter(|t| match props.ptype {
             PlateType::Source => t.source_id == props.source_plate.get_uuid(),
             PlateType::Destination => t.dest_id == props.destination_plate.get_uuid(),
         });
-        let mut tooltip_map: HashMap<(u8, u8), Vec<&Transfer>> = HashMap::new();
+        let mut tooltip_map_temp: HashMap<(u8, u8), Vec<&Transfer>> = HashMap::new();
+        let mut volume_map_temp: HashMap<(u8,u8), f32> = HashMap::new();
+        let mut volume_max_temp: f32 = f32::NEG_INFINITY;
         for transfer in transfers {
             let wells = match props.ptype {
                 PlateType::Source => transfer.transfer_region.get_source_wells(),
                 PlateType::Destination => transfer.transfer_region.get_destination_wells(),
             };
             for well in wells {
-                if let Some(val) = tooltip_map.get_mut(&well) {
+                if let Some(val) = tooltip_map_temp.get_mut(&well) {
                     val.push(transfer);
                 } else {
-                    tooltip_map.insert(well, vec![transfer]);
+                    tooltip_map_temp.insert(well, vec![transfer]);
+                }
+                if let Some(val) = volume_map_temp.get_mut(&well) {
+                    *val += transfer.volume;
+                } else {
+                    log::info!("well: {:?}, vol: {:?}", well, transfer.volume);
+                    volume_map_temp.insert(well, transfer.volume);
+                }
+                volume_max_temp = f32::max(volume_max_temp, transfer.volume);
             }
         }
-        }
+        tooltip_map = tooltip_map_temp;
-        tooltip_map
+        volume_map = volume_map_temp;
+        volume_max = volume_max_temp;
     };
 
     let wells = match props.ptype {
@@ -120,18 +134,39 @@ pub fn Plate(props: &PlateProps) -> Html {
             let row_header = html! {<th>{num_to_letters(i)}</th>};
             let row = (1..=width)
                 .map(|j| {
+                    let color = {
+                        if !main_state.preferences.volume_heatmap {
+                        tooltip_map.get(&(i,j))
+                            .and_then(|t| t.last())
+                            .map(|t| PALETTE.get_ordered(t.get_uuid(), &ordered_ids))
+                        } else {
+                            volume_map.get(&(i,j))
+                                .map(|t| PALETTE.get_linear(*t as f64, volume_max as f64))
+                        }
+                    };
+                    let title = {
+                        let mut out = String::new();
+                        let used_by = tooltip_map.get(&(i,j)).map(|transfers| format!("Used by: {}", transfers.iter().map(|t| t.name.clone())
+                                    .collect::<Vec<_>>().join(", ")));
+                        if let Some(val) = used_by {
+                            out += &val;
+                        }
+                        let volume_sum = volume_map.get(&(i,j))
+                            .map(|t| format!("Volume: {}", t));
+                        if let Some(val) = volume_sum {
+                            if !out.is_empty() { out += "\n" }
+                            out += &val;
+                        }
+                        out
+                    };
                     html! {
                         <PlateCell i={i} j={j}
                         selected={in_rect(*m_start_handle.clone(), *m_end_handle.clone(), (i,j))}
                         mouse={mouse_callback.clone()}
                         in_transfer={wells.contains(&(i,j)) && main_state.preferences.in_transfer_hashes}
-                        color={tooltip_map.get(&(i,j))
+                        color={ color }
-                            .and_then(|t| t.last())
-                            .map(|t| PALETTE.get_ordered(t.get_uuid(), &ordered_ids))
-                        }
                         cell_height={props.cell_height}
-                        title={tooltip_map.get(&(i,j)).map(|transfers| format!("Used by: {}", transfers.iter().map(|t| t.name.clone())
+                        title={title}
-                                    .collect::<Vec<_>>().join(", ")))}
                         />
                     }
                 })

plate-tool-web/src/components/plates/util.rs

@@ -26,7 +26,7 @@ impl ColorPalette {
         ]
     }
 
-    pub fn _get_u8(&self, t: u8) -> [f64; 3] {
+    fn get_u8(&self, t: u8) -> [f64; 3] {
         assert!(t > 0, "t must be greater than zero!");
         self.get((2f64.powi(-(t.ilog2() as i32))) * (t as f64 + 0.5f64) - 1.0f64)
     }
@@ -43,6 +43,11 @@ impl ColorPalette {
         self.get(Self::space_evenly(index))
     }
 
+    pub fn get_linear(&self, t: f64, max: f64) -> [f64; 3] {
+        let scaled = t / max;
+        self.get(scaled)
+    }
+
     fn space_evenly(x: usize) -> f64 {
         let e: usize = (x.ilog2() + 1) as usize;
         let d: usize = 2usize.pow(e as u32);

plate-tool-web/src/components/states.rs

@@ -15,12 +15,15 @@ pub struct CurrentTransfer {
 
 #[derive(PartialEq, Clone, Copy, Serialize, Deserialize)]
 pub struct Preferences {
+    #[serde(default)]
     pub in_transfer_hashes: bool,
+    #[serde(default)]
+    pub volume_heatmap: bool,
 }
 
 impl Default for Preferences {
     fn default() -> Self {
-        Self { in_transfer_hashes: true }
+        Self { in_transfer_hashes: true, volume_heatmap: false }
     }
 }