From 214826246781e90d9cd6dc7a48689728b450e0b0 Mon Sep 17 00:00:00 2001 From: Thomas Oberbichler Date: Sat, 5 Sep 2020 22:27:47 +0200 Subject: [PATCH 1/4] Complete html5 document --- nfem/visualization/canvas_3d_html.py | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/nfem/visualization/canvas_3d_html.py b/nfem/visualization/canvas_3d_html.py index 88cb386..1a62899 100644 --- a/nfem/visualization/canvas_3d_html.py +++ b/nfem/visualization/canvas_3d_html.py @@ -1,4 +1,20 @@ TEMPLATE = """ + + + + + + Canvas + + + + +
@@ -586,4 +602,7 @@ clearInterval(animationTimer); }); + + + """ From 8f754a03106bcde2bf57d7a2dccb8140a4e6075e Mon Sep 17 00:00:00 2001 From: Thomas Oberbichler Date: Sat, 5 Sep 2020 22:28:30 +0200 Subject: [PATCH 2/4] Automatic resize --- nfem/visualization/canvas_3d_html.py | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/nfem/visualization/canvas_3d_html.py b/nfem/visualization/canvas_3d_html.py index 1a62899..4ac6f4e 100644 --- a/nfem/visualization/canvas_3d_html.py +++ b/nfem/visualization/canvas_3d_html.py @@ -35,7 +35,7 @@ let container = document.getElementById('container'); let timestepSlider = document.getElementById('timestep'); - let width = container.clientWidth * 0.8; + let width = window.innerWidth; let height = data.height; let nbScenes = data.frames.length; @@ -601,6 +601,20 @@ d3.select("#stop").on("click", function () { clearInterval(animationTimer); }); + + + window.addEventListener( 'resize', onWindowResize, false ); + + function onWindowResize(){ + camera.aspect = window.innerWidth / height; + camera.updateProjectionMatrix(); + + renderer.setSize(window.innerWidth, height); + + render(); + } + + onWindowResize(); From c49a37c4e76be6485606e75a5d4de8fe16392e0e Mon Sep 17 00:00:00 2001 From: Thomas Oberbichler Date: Sat, 5 Sep 2020 22:29:30 +0200 Subject: [PATCH 3/4] Use iframe --- nfem/model.py | 2 +- nfem/visualization/canvas_3d.py | 9 ++++++--- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/nfem/model.py b/nfem/model.py index fa24a38..36f1ce6 100644 --- a/nfem/model.py +++ b/nfem/model.py @@ -1047,7 +1047,7 @@ def show(self, height=600, timestep=0): for element in model.elements: element.draw(canvas) - return canvas.html() + canvas.show(height=height) class KeyCollection: diff --git a/nfem/visualization/canvas_3d.py b/nfem/visualization/canvas_3d.py index cfac65e..ecb89d7 100644 --- a/nfem/visualization/canvas_3d.py +++ b/nfem/visualization/canvas_3d.py @@ -1,7 +1,8 @@ import json import numpy as np import os -from IPython.display import HTML +import html +from IPython.display import display, IFrame, HTML from nfem.visualization.canvas_3d_html import TEMPLATE @@ -103,5 +104,7 @@ def support(self, direction, location, color='red', layer=0): "layer": layer, }) - def html(self): - return HTML(TEMPLATE.replace("{{data}}", json.dumps(self.data))) + def show(self, height): + content = TEMPLATE.replace("{{data}}", json.dumps(self.data)) + element = HTML(f'