Try to make it work with yay, maybe try dioxus again?

Cargo.toml

@@ -1,6 +1,7 @@
 [package]
+authors = ["David Holland <info@dustvoice.de>"]
 name = "beanconqueror"
-version = "0.4.0"
+version = "0.5.0"
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
@@ -11,11 +12,9 @@ chrono = "0.4.22"
 colourado = "0.2.0"
 fast-float = "0.2.0"
 palette = "0.6.1"
-plotters-canvas = "*"
+plotly = { version = "=0.8.1", features = ["wasm"] }
 serde = "1.0.144"
 serde_derive = "1.0.144"
 toml = "0.5.9"
-wasm-bindgen-test = "0.2"
-
-[dependencies.plotters]
-git = "https://github.com/plotters-rs/plotters"
+yew = "0.19.0"
+yew-hooks = "0.1.56"

src/main.rs

@@ -1,9 +1,15 @@
 use calamine::{open_workbook, Reader, Xlsx};
 use chrono::{Duration, NaiveTime};
 use colourado::{ColorPalette, PaletteType};
-use plotters::prelude::*;
 use serde_derive::Deserialize;
 
+use plotly::{
+    Layout, Plot, Scatter,
+    common::{Mode, Title}
+};
+
+use yew::prelude::*;
+
 use std::collections::HashMap;
 use std::fs;
 
@@ -93,16 +99,14 @@ fn process_sheet(
             std_duration.as_secs_f32() as f64
         });
 
-        let map_weight_range = weight_range
-            .cells()
-            .map(|c| {
-                c.2.get_float().unwrap_or_else(|| {
-                    panic!(
-                        "Can't get float value of weight column at position ({},{})",
-                        c.0, c.1
-                    )
-                })
-            });
+        let map_weight_range = weight_range.cells().map(|c| {
+            c.2.get_float().unwrap_or_else(|| {
+                panic!(
+                    "Can't get float value of weight column at position ({},{})",
+                    c.0, c.1
+                )
+            })
+        });
 
         map_time_range.zip(map_weight_range).collect()
     } else {
@@ -132,36 +136,19 @@ fn load_data(path: &str, cutoff: Option<f64>) -> Option<Data> {
     }
 }
 
-fn main() {
+pub fn generate_plots() -> Vec<(String, Plot)> {
     let config_file = fs::read_to_string("config.toml").expect("Can't read config.toml");
     let config: Config = toml::from_str(&config_file).expect("Can't deserialize config.toml");
 
+    let mut result: Vec<(String, Plot)> = Vec::with_capacity(config.charts.len());
+
     for chart in config.charts {
         // println!("Chart: {}\n", chart.1.title);
 
-        let title = format!("{}/{}.svg", config.output_dir, chart.1.title);
-        let root_area = SVGBackend::new(&title, (config.width, config.height)).into_drawing_area();
-        root_area.fill(&WHITE).unwrap();
+        let filename = format!("{}/{}.html", config.output_dir, &chart.1.title);
+        let mut plot = Plot::new();
 
-        let mut ctx = ChartBuilder::on(&root_area)
-            .set_label_area_size(LabelAreaPosition::Left, 40)
-            .set_label_area_size(LabelAreaPosition::Bottom, 40)
-            .caption(&chart.1.title, ("Fira Code", 24))
-            .build_cartesian_2d(
-                0f64..(chart.1.max_time as f64),
-                0f64..(chart.1.max_weight as f64),
-            )
-            .unwrap();
-
-        ctx.configure_mesh()
-            .label_style(("Fira Code", 12))
-            .draw()
-            .unwrap();
-
-        let shot_count = chart.1.shots.len();
-
-        let palette = ColorPalette::new(shot_count as u32, PaletteType::Random, false);
-        let mut palette_iter = palette.colors.iter();
+        let _shot_count = chart.1.shots.len();
 
         for shot_nr in chart.1.shots {
             if let Some(shot) = config.shots.get(&shot_nr.to_string()) {
@@ -176,48 +163,63 @@ fn main() {
                             continue;
                         }
                     }
-                    // println!("\ttweight: {:?}, flowrate: {:?}\n", data.weight, data.flowrate);
 
-                    // ctx.draw_series(data.weight.iter().map(|x| {
-                    //     Pixel::new(*x, &RED)
-                    // })).unwrap();
-
-                    let f32_to_u8 = |color: f32| (color * 255.0) as u8;
-
-                    let palette_color = palette_iter.next();
-
-                    if let Some(color) = palette_color {
-                        let color = RGBAColor(
-                            f32_to_u8(color.red),
-                            f32_to_u8(color.green),
-                            f32_to_u8(color.blue),
-                            1.0,
-                        );
-
-                        ctx.draw_series(LineSeries::new(data.weight, color))
-                            .unwrap()
-                            .label(&shot.title)
-                            .legend(move |(x, y)| {
-                                Rectangle::new(
-                                    [(x - 20, y + 2), (x, y - 2)],
-                                    ShapeStyle {
-                                        color,
-                                        filled: true,
-                                        stroke_width: 1,
-                                    },
-                                )
-                            });
-                    }
+                    let (x, y): (Vec<_>, Vec<_>) = data.weight.into_iter().unzip();
+                    let trace = Scatter::new(x, y).name(&shot.title).mode(Mode::Lines);
+                    plot.add_trace(trace);
                 }
             }
         }
 
-        ctx.configure_series_labels()
-            .position(SeriesLabelPosition::UpperLeft)
-            .margin(25)
-            .legend_area_size(10)
-            .label_font(("Fira Code", 12))
-            .draw()
-            .unwrap();
+        let layout = Layout::new().title(Title::new(&chart.1.title));
+        plot.set_layout(layout);
+
+        result.push((chart.1.title, plot))
+        // plot.use_local_plotly();
+        // plot.write_html(filename);
+    }
+
+    result
+}
+
+#[function_component(App)]
+pub fn plot_component() -> Html {
+    let plot_compounds: Vec<(String, Plot)> = generate_plots();
+    let (names, plots): (Vec<_>, Vec<_>) = plot_compounds.into_iter().unzip();
+    let ids = names.clone();
+
+    let p = yew_hooks::use_async::<_, _, ()>({
+        async move {
+            for i in names.iter().zip(plots.iter()) {
+                let (name, plot) = i;
+                plotly::bindings::new_plot(&name, &plot).await;
+            }
+
+            Ok(())
+        }
+    });
+
+    use_effect_with_deps(
+        move |_| {
+            p.run();
+            || ()
+        },
+        (),
+    );
+
+    html! {
+        <div id="plot-div">
+            {
+                ids.into_iter().map(|name| {
+                    html!{
+                        <div id={name}></div>
+                    }
+                }).collect::<Html>()
+            }
+        </div>
     }
 }
+
+fn main() {
+    yew::start_app::<App>();
+}