Added Z value return for 3d plots

.gitignore

@@ -69,4 +69,7 @@ package-lock.json
 
 
 # Virtual Env
-env/*
+env/*
+
+# example folder
+examples/

README.md

@@ -34,21 +34,56 @@ selected_points = plotly_events(fig, click_event=False, hover_event=True)
 What the component returns:
 ```
 Returns
--------
-list of dict
-    List of dictionaries containing point details (in case multiple overlapping points have been clicked).
-
-    Details can be found here:
-        https://plotly.com/javascript/plotlyjs-events/#event-data
-
-    Format of dict:
+    -------
+    list of dict
+        List of dictionaries containing point details (in case multiple overlapping
+        points have been clicked).
+
+        Details can be found here:
+            https://plotly.com/javascript/plotlyjs-events/#event-data
+
+        Format of dict:
+            {
+                x: float (x value of point),
+                y: float (y value of point),
+                z: float (z value of point), # optional enabled using with_z
+                curveNumber: (index of curve),
+                pointNumber: (index of selected point),
+                pointIndex: (index of selected point)
+            }
+
+        If measurement is enabled:
+            {
+                x: float (x value of point),
+                y: float (y value of point),
+                z: float (z value of point), # optional enabled using with_z
+                curveNumber: (index of curve),
+                pointNumber: (index of selected point),
+                pointIndex: (index of selected point)
+            },
+            {
+                measurePointsX: (list of measurement points x value),
+                measurePointsY: (list of measurement points y value),
+                measurePointsZ: (list of measurement poitns z value),
+                dx: (delta x of measurement points, 0 when only one point is clicked),
+                dy: (delta y of measurement points, 0 when only one point is clicked),
+                dz: (delta z of measurement points, 0 when only one point is clicked)
+                dxyz: (delta xyz of measurement points, 0 when only one points is clicked)
+                dxy: (delta xy of measurement points, 0 when only one point is clicked),
+                dxz: (delta xz of measurement points, 0 when only one point is clicked),
+                dyz: (delta yz of measurement points, 0 when only one point is clicked)
+            }
+        If get_relayout is enabled, additional returns will happen when the chart is moved around
         {
-            x: int (x value of point),
-            y: int (y value of point),
-            curveNumber: (index of curve),
-            pointNumber: (index of selected point),
-            pointIndex: (index of selected point)
+            cameraLayout: {
+                x: float (x camera position)
+                y: float (y camera position)
+                z: float (z camera position)
+            }
         }
+        different dictionaries will be returned so you need to handle them
+
+
 
 ```
 

src/streamlit_plotly_events.egg-info/PKG-INFO

@@ -0,0 +1,14 @@
+Metadata-Version: 2.1
+Name: streamlit-plotly-events
+Version: 0.0.6
+Summary: Plotly chart component for Streamlit that also allows for events to bubble back up to Streamlit.
+Home-page: https://github.com/null-jones/streamlit-plotly-events
+Author: Ellie Jones
+Author-email: ellie@altaml.com
+Requires-Python: >=3.6
+Description-Content-Type: text/plain
+License-File: LICENSE
+Requires-Dist: streamlit>=0.63
+Requires-Dist: plotly>=4.14.3
+
+Plotly chart component for Streamlit that also allows for events to bubble back up to Streamlit.

src/streamlit_plotly_events.egg-info/SOURCES.txt

@@ -0,0 +1,21 @@
+LICENSE
+MANIFEST.in
+README.md
+setup.py
+src/streamlit_plotly_events/__init__.py
+src/streamlit_plotly_events.egg-info/PKG-INFO
+src/streamlit_plotly_events.egg-info/SOURCES.txt
+src/streamlit_plotly_events.egg-info/dependency_links.txt
+src/streamlit_plotly_events.egg-info/requires.txt
+src/streamlit_plotly_events.egg-info/top_level.txt
+src/streamlit_plotly_events/frontend/build/asset-manifest.json
+src/streamlit_plotly_events/frontend/build/index.html
+src/streamlit_plotly_events/frontend/build/precache-manifest.73c82ebc749cad31f76721ccef17783d.js
+src/streamlit_plotly_events/frontend/build/service-worker.js
+src/streamlit_plotly_events/frontend/build/static/js/2.9330ddf9.chunk.js
+src/streamlit_plotly_events/frontend/build/static/js/2.9330ddf9.chunk.js.LICENSE.txt
+src/streamlit_plotly_events/frontend/build/static/js/2.9330ddf9.chunk.js.map
+src/streamlit_plotly_events/frontend/build/static/js/main.0d52cef4.chunk.js
+src/streamlit_plotly_events/frontend/build/static/js/main.0d52cef4.chunk.js.map
+src/streamlit_plotly_events/frontend/build/static/js/runtime-main.44d30fc2.js
+src/streamlit_plotly_events/frontend/build/static/js/runtime-main.44d30fc2.js.map

src/streamlit_plotly_events.egg-info/dependency_links.txt

@@ -0,0 +1 @@
+

src/streamlit_plotly_events.egg-info/requires.txt

@@ -0,0 +1,2 @@
+streamlit>=0.63
+plotly>=4.14.3

src/streamlit_plotly_events.egg-info/top_level.txt

@@ -0,0 +1 @@
+streamlit_plotly_events

src/streamlit_plotly_events/__init__.py

@@ -6,7 +6,7 @@
 # the component, and True when we're ready to package and distribute it.
 # (This is, of course, optional - there are innumerable ways to manage your
 # release process.)
-_RELEASE = False
+_RELEASE = True
 
 # Declare a Streamlit component. `declare_component` returns a function
 # that is used to create instances of the component. We're naming this
@@ -47,11 +47,17 @@
 def plotly_events(
     plot_fig,
     click_event=True,
+    with_z=False,
     select_event=False,
     hover_event=False,
     override_height=450,
     override_width="100%",
     key=None,
+    plot_clicked_point: bool = False,
+    clicked_point_size: float = 0.0,
+    measure_mode: bool = False,
+    measure_line_width: float = 4.0,
+    get_relayout: bool = False,
 ):
     """Create a new instance of "plotly_events".
 
@@ -73,6 +79,16 @@ def plotly_events(
         An optional key that uniquely identifies this component. If this is
         None, and the component's arguments are changed, the component will
         be re-mounted in the Streamlit frontend and lose its current state.
+    plot_clicked_point: bool
+        An optional key if you want the clicked point on the chart to have a red point drawn
+        to indicate where you clicked (Stable for Scatter 3d plots not yet tested on other types)
+    clicked_point_size: float
+        What size to plot the clicked point, will work make a difference when plot_clicked_point is True
+    measure_mode: bool
+        Plot measurements after clicking 2 points on the chart, will modify the return value of the component
+        Measurement and plotting is done is in component space so no need to rerun
+    measure_line_width: float
+        What line width to plot when measurement is done,
 
     Returns
     -------
@@ -85,13 +101,45 @@ def plotly_events(
 
         Format of dict:
             {
-                x: int (x value of point),
-                y: int (y value of point),
+                x: float (x value of point),
+                y: float (y value of point),
+                z: float (z value of point), # optional enabled using with_z
                 curveNumber: (index of curve),
                 pointNumber: (index of selected point),
                 pointIndex: (index of selected point)
             }
 
+        If measurement is enabled:
+            {
+                x: float (x value of point),
+                y: float (y value of point),
+                z: float (z value of point), # optional enabled using with_z
+                curveNumber: (index of curve),
+                pointNumber: (index of selected point),
+                pointIndex: (index of selected point)
+            },
+            {
+                measurePointsX: (list of measurement points x value),
+                measurePointsY: (list of measurement points y value),
+                measurePointsZ: (list of measurement poitns z value),
+                dx: (delta x of measurement points, 0 when only one point is clicked),
+                dy: (delta y of measurement points, 0 when only one point is clicked),
+                dz: (delta z of measurement points, 0 when only one point is clicked)
+                dxyz: (delta xyz of measurement points, 0 when only one points is clicked)
+                dxy: (delta xy of measurement points, 0 when only one point is clicked),
+                dxz: (delta xz of measurement points, 0 when only one point is clicked),
+                dyz: (delta yz of measurement points, 0 when only one point is clicked)
+            }
+        If get_relayout is enabled, additional returns will happen when the chart is moved around
+        {
+            cameraLayout: {
+                x: float (x camera position)
+                y: float (y camera position)
+                z: float (z camera position)
+            }
+        }
+        different dictionaries will be returned so you need to handle them
+
     """
     # kwargs will be exposed to frontend in "args"
     component_value = _component_func(
@@ -100,9 +148,15 @@ def plotly_events(
         override_width=override_width,
         key=key,
         click_event=click_event,
+        with_z=with_z,
         select_event=select_event,
         hover_event=hover_event,
-        default="[]",  # Default return empty JSON list
+        default="[]",
+        plot_clicked_point=plot_clicked_point,
+        clicked_point_size=clicked_point_size,
+        measure_mode=measure_mode,
+        measure_line_width=measure_line_width,
+        get_relayout=get_relayout
     )
 
     # Parse component_value since it's JSON and return to Streamlit
@@ -126,7 +180,7 @@ def plotly_events(
 
     # Here we add columns to check auto-resize/etc
     st.subheader("Plotly Bar Chart (With columns)")
-    _, c2, _ = st.beta_columns((1, 6, 1))
+    _, c2, _ = st.columns((1, 6, 1))
     with c2:
         fig2 = px.bar(x=[0, 1, 2, 3], y=[0, 1, 2, 3])
         plot_name_holder2 = st.empty()

src/streamlit_plotly_events/frontend/build/asset-manifest.json

@@ -0,0 +1,19 @@
+{
+  "files": {
+    "main.js": "./static/js/main.b4df662e.chunk.js",
+    "main.js.map": "./static/js/main.b4df662e.chunk.js.map",
+    "runtime-main.js": "./static/js/runtime-main.44d30fc2.js",
+    "runtime-main.js.map": "./static/js/runtime-main.44d30fc2.js.map",
+    "static/js/2.9330ddf9.chunk.js": "./static/js/2.9330ddf9.chunk.js",
+    "static/js/2.9330ddf9.chunk.js.map": "./static/js/2.9330ddf9.chunk.js.map",
+    "index.html": "./index.html",
+    "precache-manifest.9c7844760ffbfd02bfd7cf00c7dc1f22.js": "./precache-manifest.9c7844760ffbfd02bfd7cf00c7dc1f22.js",
+    "service-worker.js": "./service-worker.js",
+    "static/js/2.9330ddf9.chunk.js.LICENSE.txt": "./static/js/2.9330ddf9.chunk.js.LICENSE.txt"
+  },
+  "entrypoints": [
+    "static/js/runtime-main.44d30fc2.js",
+    "static/js/2.9330ddf9.chunk.js",
+    "static/js/main.b4df662e.chunk.js"
+  ]
+}

src/streamlit_plotly_events/frontend/build/index.html

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><title>Streamlit Component</title><meta charset="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Streamlit Component"/></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function t(t){for(var n,l,a=t[0],p=t[1],i=t[2],c=0,s=[];c<a.length;c++)l=a[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in p)Object.prototype.hasOwnProperty.call(p,n)&&(e[n]=p[n]);for(f&&f(t);s.length;)s.shift()();return u.push.apply(u,i||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,a=1;a<r.length;a++){var p=r[a];0!==o[p]&&(n=!1)}n&&(u.splice(t--,1),e=l(l.s=r[0]))}return e}var n={},o={1:0},u=[];function l(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.m=e,l.c=n,l.d=function(e,t,r){l.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,t){if(1&t&&(e=l(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(l.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)l.d(r,n,function(t){return e[t]}.bind(null,n));return r},l.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(t,"a",t),t},l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.p="./";var a=this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[],p=a.push.bind(a);a.push=t,a=a.slice();for(var i=0;i<a.length;i++)t(a[i]);var f=p;r()}([])</script><script src="./static/js/2.9330ddf9.chunk.js"></script><script src="./static/js/main.b4df662e.chunk.js"></script></body></html>

src/streamlit_plotly_events/frontend/build/precache-manifest.9c7844760ffbfd02bfd7cf00c7dc1f22.js

@@ -0,0 +1,22 @@
+self.__precacheManifest = (self.__precacheManifest || []).concat([
+  {
+    "revision": "e1e87c1e8266a15892e8ee1f57cd1934",
+    "url": "./index.html"
+  },
+  {
+    "revision": "0657f05f98f6fe46de1c",
+    "url": "./static/js/2.9330ddf9.chunk.js"
+  },
+  {
+    "revision": "177510fbe674e77c7ff004960ab47a68",
+    "url": "./static/js/2.9330ddf9.chunk.js.LICENSE.txt"
+  },
+  {
+    "revision": "7f4eec1dbcb1d3e044c4",
+    "url": "./static/js/main.b4df662e.chunk.js"
+  },
+  {
+    "revision": "7e9d84e346ce158d1e50",
+    "url": "./static/js/runtime-main.44d30fc2.js"
+  }
+]);

src/streamlit_plotly_events/frontend/build/service-worker.js

@@ -0,0 +1,39 @@
+/**
+ * Welcome to your Workbox-powered service worker!
+ *
+ * You'll need to register this file in your web app and you should
+ * disable HTTP caching for this file too.
+ * See https://goo.gl/nhQhGp
+ *
+ * The rest of the code is auto-generated. Please don't update this file
+ * directly; instead, make changes to your Workbox build configuration
+ * and re-run your build process.
+ * See https://goo.gl/2aRDsh
+ */
+
+importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js");
+
+importScripts(
+  "./precache-manifest.9c7844760ffbfd02bfd7cf00c7dc1f22.js"
+);
+
+self.addEventListener('message', (event) => {
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
+});
+
+workbox.core.clientsClaim();
+
+/**
+ * The workboxSW.precacheAndRoute() method efficiently caches and responds to
+ * requests for URLs in the manifest.
+ * See https://goo.gl/S9QRab
+ */
+self.__precacheManifest = [].concat(self.__precacheManifest || []);
+workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
+
+workbox.routing.registerNavigationRoute(workbox.precaching.getCacheKeyForURL("./index.html"), {
+
+  blacklist: [/^\/_/,/\/[^/?]+\.[^/]+$/],
+});