https://jsfiddle.net/ab7etkco/4/
<!doctype html><html><head><script src="https://www.geogebra.org/apps/deployggb.js"></script><style> #wrapperDiv { width: 100%; height: 100%; }</style></head><body><script> var params = { appName: "graphing", width: 800, height: 600, showToolBar: true, showAlgebraInput: true, showMenuBar: true, } var applet = new GGBApplet(params, true) window.addEventListener("load", function () { applet.inject("ggb-element") updateGGBAppletSize() }) window.addEventListener("resize", updateGGBAppletSize) function updateGGBAppletSize() { const wrapperDiv = document.getElementById("wrapperDiv") const width = wrapperDiv.offsetWidth const height = wrapperDiv.offsetHeight ggbApplet.setSize(width, height) console.log(width, height) }</script><div id="wrapperDiv"><div id="ggb-element"></div></div></body></html>I have tried setting width and height to 100% and then using setSize to set the size based on the corresponding offset dimension from the wrapperDiv. The width scales correctly whilst the height does not. I have also tried using getBoundingClientRect; but the same problem arises.
GeoGebra API https://geogebra.github.io/docs/reference/en/GeoGebra_Apps_API/