plotly · mfreeborn · Nov 3, 2022 · May 24, 2022 · May 31, 2022 · May 31, 2022
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -60,7 +60,9 @@ jobs:
           basic_charts,
           custom_controls,
           financial_charts,
+          images,
           kaleido,
+          maps,
           ndarray,
           scientific_charts,
           shapes,

diff --git a/.github/workflows/release_ci.yml b/.github/workflows/release_ci.yml
@@ -60,7 +60,9 @@ jobs:
           basic_charts,
           custom_controls,
           financial_charts,
+          images,
           kaleido,
+          maps,
           ndarray,
           scientific_charts,
           shapes,

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [0.8.2] - 2022-11-xx
 ### Added
 - [[#110](https://github.com/igiagkiozis/plotly/pull/110)] `LegendGroupTitle` to existing traces.
+- [[#88](https://github.com/igiagkiozis/plotly/pull/88)] `Mesh3D`, `Image`, `ScatterMapbox` traces.
 
 ### Changed
 - [[#113](https://github.com/igiagkiozis/plotly/pull/113)] Refactored the structure of the examples to make them more accessible, whilst adding more examples e.g. for `wasm`.

diff --git a/examples/3d_charts/src/main.rs b/examples/3d_charts/src/main.rs
@@ -4,7 +4,7 @@ use ndarray::Array;
 use plotly::{
     common::{ColorScale, ColorScalePalette, Marker, MarkerSymbol, Mode, Title},
     layout::{Axis, Layout},
-    Plot, Scatter3D, Surface,
+    Mesh3D, Plot, Scatter3D, Surface,
 };
 
 // 3D Scatter Plots
@@ -101,12 +101,35 @@ fn surface_plot() {
     plot.show();
 }
 
+fn mesh_3d_plot() {
+    let trace = Mesh3D::new(
+        vec![0, 1, 2, 0],
+        vec![0, 0, 1, 2],
+        vec![0, 2, 0, 1],
+        vec![0, 0, 0, 1],
+        vec![1, 2, 3, 2],
+        vec![2, 3, 1, 3],
+    )
+    .intensity(vec![0.0, 0.33, 0.66, 1.0])
+    .color_scale(ColorScale::Palette(ColorScalePalette::Rainbow));
+
+    let mut plot = Plot::new();
+    plot.add_trace(trace);
+
+    plot.show();
+}
+
 fn main() {
     // Uncomment any of these lines to display the example.
 
     // Scatter3D Plots
-    simple_scatter3d_plot();
-    simple_line3d_plot();
-    customized_scatter3d_plot();
-    surface_plot();
+    // simple_scatter3d_plot();
+    // simple_line3d_plot();
+    // customized_scatter3d_plot();
+
+    // Surface Plots
+    // surface_plot();
+
+    // Mesh Plots
+    // mesh_3d_plot();
 }
diff --git a/examples/custom_controls/src/main.rs b/examples/custom_controls/src/main.rs
@@ -10,7 +10,8 @@ use plotly::{
     Bar, HeatMap, Layout, Plot,
 };
 
-/// Display a bar chart with an associated dropdown selector to show different data.
+/// Display a bar chart with an associated dropdown selector to show different
+/// data.
 fn bar_plot_with_dropdown_for_different_data() {
     type BarType = Bar<&'static str, i32>;
     let mut plot = Plot::new();
@@ -40,7 +41,8 @@ fn bar_plot_with_dropdown_for_different_data() {
     plot.show();
 }
 
-/// Display a heat map, with buttons to allow for toggling of different colorscales.
+/// Display a heat map, with buttons to allow for toggling of different
+/// colorscales.
 fn heat_map_with_modifiable_colorscale() {
     type HeatMapType = HeatMap<f64, f64, Vec<f64>>;
     let gauss = |v: i32| (-v as f64 * v as f64 / 200.0).exp();
@@ -72,7 +74,8 @@ fn heat_map_with_modifiable_colorscale() {
     plot.show();
 }
 
-/// Display a bar chart, with buttons to toggle between stacked or grouped display maodes.
+/// Display a bar chart, with buttons to toggle between stacked or grouped
+/// display maodes.
 fn bar_chart_with_modifiable_bar_mode() {
     type BarType = Bar<&'static str, i32>;
     let mut plot = Plot::new();

diff --git a/examples/images/Cargo.toml b/examples/images/Cargo.toml
@@ -0,0 +1,10 @@
+[package]
+name = "images"
+version = "0.1.0"
+authors = ["Michael Freeborn <michaelfreeborn1@gmail.com>"]
+edition = "2021"
+
+[dependencies]
+image = "0.24.4"
+ndarray = "0.15.6"
+plotly = { path = "../../plotly", features = ["plotly_image", "plotly_ndarray"] }
diff --git a/examples/images/README.md b/examples/images/README.md
@@ -0,0 +1,6 @@
+# Images
+
+## How to Run
+
+1. Configure which example(s) you want to run by commenting/uncommenting lines in the `main` function, located in `src/main.rs`.
+2. Run `cargo run`.
diff --git a/examples/images/assets/mario.png b/examples/images/assets/mario.png
diff --git a/examples/images/src/main.rs b/examples/images/src/main.rs
@@ -0,0 +1,98 @@
+#![allow(dead_code)]
+
+use ndarray::arr2;
+use plotly::{color::Rgb, image::ColorModel, Image, Plot};
+
+fn basic_image() {
+    let w = Rgb::new(255, 255, 255);
+    let b = Rgb::new(0, 0, 0);
+    let r = Rgb::new(240, 8, 5);
+    let db = Rgb::new(145, 67, 7);
+    let lb = Rgb::new(251, 200, 129);
+    let s = Rgb::new(153, 75, 10);
+    let bl = Rgb::new(3, 111, 191);
+    let y = Rgb::new(251, 250, 15);
+
+    let pixels = vec![
+        vec![w, w, w, w, r, r, r, r, r, w, w, w, w, w, w],
+        vec![w, w, w, r, r, r, r, r, r, r, r, r, w, w, w],
+        vec![w, w, w, db, db, db, lb, lb, b, lb, w, w, w, w, w],
+        vec![w, w, db, lb, db, lb, lb, lb, b, lb, lb, lb, w, w, w],
+        vec![w, w, db, lb, db, db, lb, lb, lb, db, lb, lb, lb, w, w],
+        vec![w, w, db, db, lb, lb, lb, lb, db, db, db, db, w, w, w],
+        vec![w, w, w, w, lb, lb, lb, lb, lb, lb, lb, w, w, w, w],
+        vec![w, w, w, r, r, bl, r, r, r, w, w, w, w, w, w],
+        vec![w, w, r, r, r, bl, r, r, bl, r, r, r, w, w, w],
+        vec![w, r, r, r, r, bl, bl, bl, bl, r, r, r, r, w, w],
+        vec![w, lb, lb, r, bl, y, bl, bl, y, bl, r, lb, lb, w, w],
+        vec![w, lb, lb, lb, bl, bl, bl, bl, bl, bl, lb, lb, lb, w, w],
+        vec![w, lb, lb, bl, bl, bl, bl, bl, bl, bl, bl, lb, lb, w, w],
+        vec![w, w, w, bl, bl, bl, w, w, bl, bl, bl, w, w, w, w],
+        vec![w, w, s, s, s, w, w, w, w, s, s, s, w, w, w],
+        vec![w, s, s, s, s, w, w, w, w, w, s, s, s, s, w],
+    ];
+    let trace = Image::new(pixels).color_model(ColorModel::RGB);
+
+    let mut plot = Plot::new();
+    plot.add_trace(trace);
+
+    plot.show()
+}
+
+fn trace_from_image_crate_rgb() {
+    let im = image::open("assets/mario.png").unwrap().into_rgb8();
+    let trace = Image::new(im).color_model(ColorModel::RGB);
+
+    let mut plot = Plot::new();
+    plot.add_trace(trace);
+
+    plot.show()
+}
+
+fn trace_from_image_crate_rgba() {
+    let im = image::open("assets/mario.png").unwrap().into_rgba8();
+    let trace = Image::new(im).color_model(ColorModel::RGBA);
+
+    let mut plot = Plot::new();
+    plot.add_trace(trace);
+
+    plot.show()
+}
+
+fn trace_from_ndarray_rgb() {
+    let pixels = arr2(&[
+        [(255, 255, 255), (0, 0, 0)],
+        [(0, 0, 0), (255, 255, 255)],
+        [(255, 255, 255), (0, 0, 0)],
+    ]);
+    let trace = Image::new(pixels).color_model(ColorModel::RGB);
+
+    let mut plot = Plot::new();
+    plot.add_trace(trace);
+
+    plot.show()
+}
+
+fn trace_from_ndarray_rgba() {
+    let pixels = arr2(&[
+        [(255, 255, 255, 1.), (0, 0, 0, 0.25)],
+        [(0, 0, 0, 0.5), (255, 255, 255, 1.)],
+        [(255, 255, 255, 1.), (0, 0, 0, 0.75)],
+    ]);
+    let trace = Image::new(pixels).color_model(ColorModel::RGBA);
+
+    let mut plot = Plot::new();
+    plot.add_trace(trace);
+
+    plot.show()
+}
+
+fn main() {
+    // Uncomment any of these lines to display the example.
+
+    // basic_image();
+    // trace_from_image_crate_rgb();
+    // trace_from_image_crate_rgba();
+    // trace_from_ndarray_rgb();
+    // trace_from_ndarray_rgba();
+}
diff --git a/examples/kaleido/src/main.rs b/examples/kaleido/src/main.rs
@@ -5,13 +5,15 @@ fn main() {
     let trace = Scatter::new(vec![0, 1, 2], vec![2, 1, 0]);
     plot.add_trace(trace);
 
-    // Adjust these arguments to set the image format, width and height of the output image.
+    // Adjust these arguments to set the image format, width and height of the
+    // output image.
     let filename = "out";
     let image_format = ImageFormat::PNG;
     let width = 800;
     let height = 600;
     let scale = 1.0;
 
-    // The image will be saved to format!("{filename}.{image_format}") relative to the current working directory.
+    // The image will be saved to format!("{filename}.{image_format}") relative to
+    // the current working directory.
     plot.write_image(filename, image_format, width, height, scale);
 }
diff --git a/examples/maps/Cargo.toml b/examples/maps/Cargo.toml
@@ -0,0 +1,8 @@
+[package]
+name = "maps"
+version = "0.1.0"
+authors = ["Michael Freeborn <michaelfreeborn1@gmail.com>"]
+edition = "2021"
+
+[dependencies]
+plotly = { path = "../../plotly" }
diff --git a/examples/maps/README.md b/examples/maps/README.md
@@ -0,0 +1,6 @@
+# Maps
+
+## How to Run
+
+1. Configure which example(s) you want to run by commenting/uncommenting lines in the `main` function, located in `src/main.rs`.
+2. Run `cargo run`.
diff --git a/examples/maps/src/main.rs b/examples/maps/src/main.rs
@@ -0,0 +1,34 @@
+#![allow(dead_code)]
+
+use plotly::{
+    common::Marker,
+    layout::{Center, DragMode, Mapbox, MapboxStyle, Margin},
+    Layout, Plot, ScatterMapbox,
+};
+
+fn scatter_mapbox() {
+    let trace = ScatterMapbox::new(vec![45.5017], vec![-73.5673])
+        .marker(Marker::new().size(25).opacity(0.9));
+
+    let layout = Layout::new()
+        .drag_mode(DragMode::Zoom)
+        .margin(Margin::new().top(0).left(0).bottom(0).right(0))
+        .mapbox(
+            Mapbox::new()
+                .style(MapboxStyle::OpenStreetMap)
+                .center(Center::new(45.5017, -73.5673))
+                .zoom(5),
+        );
+
+    let mut plot = Plot::new();
+    plot.add_trace(trace);
+    plot.set_layout(layout);
+
+    plot.show();
+}
+
+fn main() {
+    // Uncomment any of these lines to display the example.
+
+    // scatter_mapbox();
+}
diff --git a/plotly/Cargo.toml b/plotly/Cargo.toml
@@ -16,13 +16,15 @@ exclude = ["target/*"]
 [features]
 kaleido = ["plotly_kaleido"]
 plotly_ndarray = ["ndarray"]
+plotly_image = ["image"]
 wasm = ["getrandom", "js-sys", "wasm-bindgen", "wasm-bindgen-futures"]
 
 [dependencies]
 askama = { version = "0.11.0", features = ["serde-json"] }
 dyn-clone = "1"
 erased-serde = "0.3"
 getrandom = { version = "0.2", features = ["js"], optional = true }
+image = { version = "0.24.2", optional = true }
 js-sys = { version = "0.3", optional = true }
 plotly_derive = { version = "0.8.1", path = "../plotly_derive" }
 plotly_kaleido = { version = "0.3.0", path = "../plotly_kaleido", optional = true }
@@ -38,6 +40,7 @@ wasm-bindgen-futures = { version = "0.4", optional = true }
 
 [dev-dependencies]
 csv = "1.1.6"
+image = "0.24.4"
 itertools = "0.10.3"
 itertools-num = "0.1.3"
 ndarray = "0.15.4"

diff --git a/plotly/src/bindings.rs b/plotly/src/bindings.rs
@@ -1,5 +1,6 @@
-//! Bindings to the underlying plotly.js Javascript API. To be used in a WASM context, where it is assumed that a
-//! remote copy of the Javascript Plotly library is available, (i.e. via a CDN).
+//! Bindings to the underlying plotly.js Javascript API. To be used in a WASM
+//! context, where it is assumed that a remote copy of the Javascript Plotly
+//! library is available, (i.e. via a CDN).
 
 use js_sys::Object;
 use wasm_bindgen::prelude::*;
@@ -18,14 +19,15 @@ extern "C" {
 /// A wrapper around the plotly.js [newPlot](https://plotly.com/javascript/plotlyjs-function-reference/#plotlynewplot)
 /// function.
 ///
-/// The function signature is slightly constrained in that `id` is a `&str` which represents
-/// the `id` of an existing HTML `div` element, rather than also allowing an instance of a `div`
-/// element, itself.
+/// The function signature is slightly constrained in that `id` is a `&str`
+/// which represents the `id` of an existing HTML `div` element, rather than
+/// also allowing an instance of a `div` element, itself.
 pub async fn new_plot(id: &str, plot: &Plot) {
     let plot_obj = &plot.to_js_object();
 
-    // This will only fail if the Rust Plotly library has produced plotly-incompatible JSON. An error here
-    // should have been handled by the library, rather than down here.
+    // This will only fail if the Rust Plotly library has produced
+    // plotly-incompatible JSON. An error here should have been handled by the
+    // library, rather than down here.
     new_plot_(id, &plot_obj)
         .await
         .expect("Error plotting chart");
@@ -34,13 +36,14 @@ pub async fn new_plot(id: &str, plot: &Plot) {
 /// A wrapper around the plotly.js [react](https://plotly.com/javascript/plotlyjs-function-reference/#react)
 /// function.
 ///
-/// The function signature is slightly constrained in that `id` is a `&str` which represents
-/// the `id` of an existing HTML `div` element, rather than also allowing an instance of a `div`
-/// element, itself.
+/// The function signature is slightly constrained in that `id` is a `&str`
+/// which represents the `id` of an existing HTML `div` element, rather than
+/// also allowing an instance of a `div` element, itself.
 pub async fn react(id: &str, plot: &Plot) {
     let plot_obj = &plot.to_js_object();
 
-    // This will only fail if the Rust Plotly library has produced plotly-incompatible JSON. An error here
-    // should have been handled by the library, rather than down here.
+    // This will only fail if the Rust Plotly library has produced
+    // plotly-incompatible JSON. An error here should have been handled by the
+    // library, rather than down here.
     react_(id, &plot_obj).await.expect("Error plotting chart");
 }