Loading x3d files in JavaScript Component

Hello everyone!

I am trying to create an AbstractJavaScriptComponent that can display a scene of an x3d object from a file on my glassfish server. I am following this tutorial:

In my test application, I create the component and add it to the UI. I also have the file in subfolders of WebContent. The 3d rendering of the file is displayed as expected if I use the http url to the file hosted on xdom.org, but if I try to load it from a folder in my application it doesn’t work. I get no error message, and the scene displays, but says that it is loading and never loads. Here is the javascript code for the component:

window.com_example_x3d_testproject_X3DJavaScriptExampleComponent = function() {
var element = this.getElement();

element.innerHTML = ‘<x3d width='500px' height='400px'>’ +
‘’ +
// ‘<inline nameSpaceName=“Deer” mapDEFToID=“true” onclick=“redNose();”
//url=“http://doc.x3dom.org/tutorials/models/inline/Deer.x3d” > ’ + //works!
// ‘<inline nameSpaceName=“Deer” mapDEFToID=“true” onclick='redNose();'
// url=“WebContent/VAADIN/themes/x3d_testproject/x3d_example_file/x3d_example_file/Deer.x3d” //load=truerender=true > ’ + //doesn’t work
‘<inline nameSpaceName=“Deer” mapDEFToID=“true” onclick='redNose();'
url=“WebContent/WEB-INF/x3d_example_file/Deer.x3d” load=true render=true > ’ + //doesn’t work
‘’ +
console.log(‘X3DJavaScriptExampleComponent instantiated’);

I have also tried using an http url with my local glassfish server and that didn’t work either.

X3D uses an XMLHttpRequest to load the file. Is there something I need to set either in the project or in the glassfish server to access these files? I’ve done many other things with many types of files and have not run into any similar issues. Is there anything else I should look at?


Also, I have verified that the local x3d file works in a 3rd party application.

Dear Jason!

I am also trying to develop a web-app embedding the X3Dom visualizer. Unfortunately I am not able to have the X3d loading the scene. Only a small pixel appears within the HTML object container. I have added all the necessary .js libraries to the JAVA object created to wrap the AbstractJavaScriptComponent and JavaScriptComponentState for VAADIN but with no luck.
If I create a static HTML page with the same code, then it works. It seems there may be some conflict in js import within the vaadin application.
Any suggestion would be very appreciated.