Fix chart zooming

ikvk · Feb 9, 2022 · 95d9c27 · 95d9c27
1 parent 184ddfa
commit 95d9c27
Showing 1 changed file with 20 additions and 0 deletions.
diff --git a/django_dramatiq_charts/templates/django_dramatiq_charts/timeline_chart.html b/django_dramatiq_charts/templates/django_dramatiq_charts/timeline_chart.html
@@ -186,6 +186,8 @@
                 title: {
                     text: `Actor <br>`,
                 },
+                itemclick: false,
+                itemdoubleclick: false,
             },
             hoverlabel: {
                 bgcolor: '#eaeaea',
@@ -212,6 +214,24 @@
             }).on('plotly_unhover', function () {
                 cursor_obj.style.cursor = '';
             });
+
+            // changing the height of the chart when zooming
+            let tasks_number = y_time.length;
+            chart.on('plotly_relayout', function (eventdata) {
+                if (eventdata['yaxis.range[0]']) {
+                    // selected number of tasks
+                    let tasks_number_selected = (eventdata['yaxis.range[1]'] - eventdata['yaxis.range[0]'] - 1.5) / 3;
+
+                    if (tasks_number_selected !== tasks_number) {
+                        tasks_number = tasks_number_selected;
+                        // minimum chart height according to document height
+                        let height_min = document.documentElement.clientHeight * 0.88;
+                        Plotly.react(chart, data, Object.assign(
+                            {}, layout, {height: heightCalculator(tasks_number, 25, 300, height_min)}
+                        ));
+                    }
+                }
+            });
         }
     </script>
 {% endblock %}