Dear Klaus,
I am trying to integrate Krpano into a website using Kirby CMS.
For me the option of using inline xml seems to be the best way,
in order to make the xml options available in the backend.
I am using the code provided on the Krpano website but I don’t get it to work.
I get the error on line 49:
krpano.actions.loadxml(xmlstring);
index kopie 2.html:49 Uncaught TypeError: Cannot read property 'actions' of null
at Object.onready (index kopie 2.html:49)
at sd.qc.init (eval at embedpanoJS (krpano.js:11), <anonymous>:1:214813)
at embedhtml5 (eval at embedpanoJS (krpano.js:11), <anonymous>:1:215357)
at embedpanoJS (krpano.js:13)
at dt (krpano.js:5)
at vt (krpano.js:5)
at Object.e.embed (krpano.js:5)
at embedpano (krpano.js:5)
at index kopie 2.html:42
Any idea what I do wrong?
Thank you in advance
<!DOCTYPE html>
<html>
<head>
<title>krpano</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, viewport-fit=cover" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style>
html {
height: 100%;
}
body {
height: 100%;
overflow: hidden;
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
color: #FFFFFF;
background-color: #000000;
}
</style>
</head>
<body>
<script src="krpano.js"></script>
<script id="krpanoxmlcode" type="text/xmldata">
<krpano>
<image>
<sphere url="panos/pano.jpg" />
</image>
<layer name="logo" url="panos/pano.jpg" align="rightbottom" x="10" y="10" enabled="false" />
</krpano>
</script>
<div id="pano" style="width:100%;height:100%;">
<noscript><table style="width:100%;height:100%;"><tr style="vertical-align:middle;text-align:center;"><td>ERROR:<br><br>Javascript not activated<br><br></td></tr></table></noscript>
<script>
embedpano({
xml: null,
target: "pano",
html5: "webgl+only",
onready: function(krpanoJSinterface) {
var krpano = krpanoJSinterface.get("global");
var xmlstring = document.getElementById("krpanoxmlcode").innerHTML;
krpano.actions.loadxml(xmlstring);
}
});
</script>
</div>
</body>
</html>