From 9587d4b5c2b71892e30259bb2574b6d1b9741613 Mon Sep 17 00:00:00 2001
From: jonasled <git@jonasled.de>
Date: Fri, 5 Mar 2021 20:25:17 +0100
Subject: [PATCH] made graph responsive
---
scss/_ntp.scss | 5 -----
ts/jl-ntp-graph.ts | 6 +++++-
ts/ntpMenu.ts | 5 ++++-
3 files changed, 9 insertions(+), 7 deletions(-)
diff --git a/scss/_ntp.scss b/scss/_ntp.scss
index abe38b9..aafa278 100644
--- a/scss/_ntp.scss
+++ b/scss/_ntp.scss
@@ -2,11 +2,6 @@
margin-bottom: 10px;
}
-.js-plotly-plot .plotly .user-select-none {
- width: 100% !important;
- overflow: hidden;
-}
-
.ntpBanner{
margin-top: 10px;
display: block;
diff --git a/ts/jl-ntp-graph.ts b/ts/jl-ntp-graph.ts
index cee33a2..1a6873e 100644
--- a/ts/jl-ntp-graph.ts
+++ b/ts/jl-ntp-graph.ts
@@ -60,5 +60,9 @@ function drawPlot(elementName:string, x:Date[], y:number[], title:string){
let layout = {
title: title,
};
- Plotly.newPlot(elementName, [score], layout);
+ let config = {
+ responsive: true
+ };
+
+ Plotly.newPlot(elementName, [score], layout, config);
}
\ No newline at end of file
diff --git a/ts/ntpMenu.ts b/ts/ntpMenu.ts
index 81707bf..dda99a9 100644
--- a/ts/ntpMenu.ts
+++ b/ts/ntpMenu.ts
@@ -2,13 +2,16 @@ let ntpNav = document.querySelectorAll(".ntpBanner");
ntpNav.forEach((element) => {
(<HTMLElement>element).onclick = function (){
- let contentID = element.getAttribute("data-index") + "-Content";
+ let index = element.getAttribute("data-index");
+ let contentID = index + "-Content";
let contentElement = <HTMLElement> document.getElementById(contentID);
if(contentElement.classList.contains("visible")){
contentElement.classList.remove("visible");
} else {
contentElement.classList.add("visible");
+ Plotly.relayout(index + "-Delay", {autosize: true});
+ Plotly.relayout(index + "-Score", {autosize: true});
}
}
});
\ No newline at end of file
--
GitLab