You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

21

Sunday, October 16th 2016, 6:29pm

I'm trying to get started with this, but for the life of me I can't find a way to convert my 3D files to .js

Options seem to be:
.json and .jd and .obj

Are those possible to use, or am I missing something? Thanks.

This post has been edited 1 times, last edit by "ibrews" (Oct 16th 2016, 7:49pm)


22

Saturday, February 4th 2017, 3:09pm

I to have this question. I have an .obj file that I want to use which is a 3d dolls house of a house than I did a 360 tour. Is it possible?

23

Friday, July 28th 2017, 2:47pm

Done

This post has been edited 1 times, last edit by "ajay.k.jangid" (Jul 28th 2017, 3:21pm) with the following reason: Done


24

Friday, November 17th 2017, 1:34am

Were there any changes that could affect this negatively since 2015? It is mostly works for me, but sometimes (my best guess is when no 3js objects are rendered, but Idk) the screen goes black with following message:
"Error: WebGL warning: Drawing without vertex attrib 0 array enabled forces the browser to do expensive emulation work when running on desktop OpenGL platforms, for example on Mac. It is preferable to always draw with vertex attrib 0 array enabled, by using bindAttribLocation to bind some always-used attribute to location 0.
krpano.js%20line%2011%20%3E%20eval:1:143985"

Do you have any idea where to fix this?


EDIT: nvm, this was caused by operating on frustum-culled 3js object.

This post has been edited 1 times, last edit by "makc" (Nov 17th 2017, 10:19am)


25

Friday, October 5th 2018, 12:15pm

When i update three js to latest , krpano webgl generates black screen (no error in console.log),

Is there any plan to update krpano for latest three js ?

This post has been edited 1 times, last edit by "MrTie" (Oct 5th 2018, 2:27pm)


Alexey Tkachenko

Professional

Posts: 741

Location: Sevastopol, Crimea, Russian Federation

Occupation: Interpreting, Building virtual tours

  • Send private message

26

Tuesday, November 6th 2018, 7:16am

Hi)

Is there way to call "load_object_json" from outside the Krpano three js plugin? I tried calling it from Krpano XML JavaScript action and it fails. I want to add some three js models dynamically.
Regards,

Alexey

27

Sunday, November 11th 2018, 3:42pm

Hi)

Is there way to call "load_object_json" from outside the Krpano three js plugin? I tried calling it from Krpano XML JavaScript action and it fails. I want to add some three js models dynamically.
krpano.set("plugin[threejs].action_to_call", action_to_call);

28

Thursday, November 22nd 2018, 6:38pm

Hey all,

I'm using krpano just a few days now, but since I found helpful information in this forum a few times, I thought I should share my findings on this topic.

My goal was to insert several 3D models into a krpano panorama. I found the original version from the first post just work fine, but obviously you would want a more recent three.js version for two reasons:
  • Better support and documentation (pretty hard to find how things were done with three.js back with that specific version...)
  • Be able to load other models than just json with three.js GLTF or OBJ loaders (see posts from ibrews and virtualpete above)

So, I went ahead and replaced the three.min.js from the plugin (v71) with the latest (v98). Several problems occured:
  • A) Some of the syntax used in three.krpanoplugin.js is outdated so the JS models won't load and the browser console is flooded with warnings.
  • B) Screen will get black at some spots when turning the pano, or, even worse, depending on the object positioning, it will be black most of the time

Now, these were my steps towards a working three.krpanoplugin.js:
  1. Replace the deprecated "renderer.resetGLState();" with "renderer.state.reset();" in line 177. Console looks much clearer now.
  2. To ease the troubleshooting and as I didn't need the json models anyway, I first removed those by commenting out lines 406-408. That will just leave the wooden box in place for now. As the box is no model but a "native" three.js object, it made troubleshooting a bit easier.
  3. At this point, the only warning left in the console was "THREE.ImageUtils.loadTexture has been deprecated. Use THREE.TextureLoader() instead". That's an easy one. Just use the new three.js way of creating a box with texture. Replace line 411

    Source code

    1
    
    "box = new THREE.Mesh(new THREE.BoxGeometry(500,500,500), new THREE.MeshBasicMaterial({map:THREE.ImageUtils.loadTexture(resolve_url_path("../models/Textures/box.jpg"))}));")

    with

    Source code

    1
    2
    3
    4
    
    var texture = new THREE.TextureLoader().load( krpano.parsepath("%SWFPATH%/box.jpg") ); // Adjust path if needed!
    var material = new THREE.MeshBasicMaterial( { map: texture } );
    var geometry = new THREE.BoxBufferGeometry( 500, 500, 500 );
    box = new THREE.Mesh( geometry, material );

    Console should be clear now, Problem A solved.
  4. To solve problem B, I found adding

    Source code

    1
    
    obj.frustumCulled = false;
    to the object properties works. So I added it to the assign_object_properties function, i.e. in line 335. It might not be the cleanest/best way so I'm looking forward to your suggestions. Problem is, that when the view get's turned to where no three.js object is visible, it stops rendering altogether. "frustumCulled = false" just makes the rendering continue although the object is not in the view.

From here on, everything worked and I could work towards adding loaders for other model types. I copied GLTFLoader.js, MTLLoader.js and OBLoader.js from the three.js built into the folder, then loaded them by changing line 39 to:

Source code

1
load_scripts(["three.min.js","GLTFLoader.js","MTLLoader.js","OBJLoader.js"], start);


I can now happily add all kinds of obj/mtl and gltf/glb files.
Just be careful with adding random models downloaded somewhere: I highly recommend starting with the sample ones from the three.js examples folder, otherwise you might spend a lot of time troubleshooting (like me) when it's just a broken model file.

The only thing I couldn't yet manage is to use the assign_object_properties function that comes with the plugin for the new models. That would be cool so one could assign positions and actions more conveniently. Help appreciated.

My version incl. the loaders and some demo models is here, so you can test it if you want to: https://www.sendspace.com/file/t9crta
I wanted to upload it here but it's too large.


My additions in the krpanoplugin.js are commented with "JJ" and I left all original code in place.(Remember the restrictions when running this locally on your computer.)
Pretty long first post *unsure*
Happy to read your comments/corrections!

29

Thursday, November 22nd 2018, 8:51pm

WOW! .. dude so nice that you are sharing this!!

30

Saturday, November 24th 2018, 4:15pm

No problem. Let me know if it works for you *smile*
I'd love to see some other examples of this in action. Still working on my case.

I just recognized loading GLTF models doesn't work with IE, but there's an easy way around this: https://github.com/mrdoob/three.js/issues/12683

31

Tuesday, November 27th 2018, 1:08pm

No problem. Let me know if it works for you *smile*
I'd love to see some other examples of this in action. Still working on my case.

I just recognized loading GLTF models doesn't work with IE, but there's an easy way around this: https://github.com/mrdoob/three.js/issues/12683
good job -JJ- porting the example to a new version of THREE. However, just now when I tested your version, I noticed there is an issue when viewing the 3D models in WebVR - the models doesn't stick to their place and moves around. In the older version of three.js (original example) it seems to work normally as expected. Do you know what could be causing this issue?

32

Tuesday, November 27th 2018, 1:29pm

Hey,
nice to hear somebody else can make use of it *smile*

Regarding the "moving around": I'm pretty sure that's a question of positioning and scaling the models. In my example you can see the small Cesium Man floating around a lot more than the other models.
If you play around with it a bit, you'll find better settings. But: I found "wrong" positions, i.e. too far away from the cam etc., may also break the pano.
I also found out how to use the original "assign_object_properties" function. You can basically add the models to an Object3D group and then give that as the first parameter to the function. This way you can position the models the krpano way again, assign them krpano actions etc.
I'm also still working on this so there might be a more advanced example with all my findings some day.

Have fun!

-JJ-

Edit: I just remembered that I saw other, not just the Three.js, plugins have similiar issues with small "movement" of hotspots/objects, the circle hotspot one for example. So
it might not be a matter of positioning alone, but good settings help to reduce it.

33

Wednesday, November 28th 2018, 2:31pm

Thanks for the reply. I don't think it's a problem of positioning since even the box moves and there is no change of the camera nor this object position, right? It also crops/hides the model if you tilt the VR down (see the picture)


I'll try to look into what could be causing this issue.

Furthermore, I would love to start extending on this idea and implement more features into VR, since I am really missing the possibility to display pictures, texts, videos and iframes in webgl. I think an easy way to display pictures, texts and video would be to simply create "pseudo 3D" object and use the desired texture, right? I also came to this topic of embedding the HTML/DOM content using CSS3D, but currently have no idea how to solve the 'stereoscopic' rendering for VR: http://learningthreejs.com/blog/2013/04/…html-and-webgl/

34

Wednesday, November 28th 2018, 3:22pm

Aah... sorry. I missed the VR part and just checked the normal view. There are slight movements as well, but not comparible to the ones in VR.
In this case I can just confirm it also happens if I apply the krpano style positioning via assign_object_properties. If I find out more I'll keep you posted.

35

Wednesday, November 28th 2018, 7:38pm

By the trial and error I managed to track that the undesired shifting in VR first occur in Three v86. In v85 it behaves normally (except the dark screen). But I have no idea which commit is causing this. I will try to play with this later.

Alexey Tkachenko

Professional

Posts: 741

Location: Sevastopol, Crimea, Russian Federation

Occupation: Interpreting, Building virtual tours

  • Send private message

36

Wednesday, December 5th 2018, 3:26pm

Hi, guys!

Granton, thanks for the hint, it works! I managed to add models dynamically by clicking buttons (layers) from the XML.

JJ, thanks a lot for your study! You helped a lot!


However, it seems that Male02 model is not loaded fully (looks buggy). Do you have the same result? I check on Win10, Chrome. (see attached printscreen).
Alexey Tkachenko has attached the following image:
  • Untitled-1.jpg
Regards,

Alexey

37

Monday, December 10th 2018, 1:00pm

@Alexy are you loading the Male02 using the JSON or OBJ? It seems it doesn't load MTL in your case. Is there any error in the JavaScript console?

Would you mind sharing your snippet for dynamically loading 3D models? Sounds pretty cool!

38

Thursday, December 20th 2018, 10:03am

@jj

I have made my own 3D arrows with three.js and i have an issue in vr with last version : viewport vertical camera bug, any solution ?

( i found that migration guide : https://github.com/mrdoob/three.js/wiki/Migration-Guide)
MrTie has attached the following images:
  • r71.jpg
  • r99.jpg

This post has been edited 4 times, last edit by "MrTie" (Dec 21st 2018, 4:06pm)


39

Saturday, December 22nd 2018, 12:04pm

@Mr.Tie, Amazing, thanks for sharing the migration guide! I discovered the bad positioning of objects is probably caused by renderer.setViewport method, since that is the only change between v84 and v85 where it stopped working.

I tried to change renderer.setViewport(0, 0, sw,sh); to renderer.setViewport(0,-y, sw,sh); for both viewports when VR rendering and Voila! it it works now perfectly!

40

Saturday, December 22nd 2018, 12:55pm

@Mr.Tie
By the way that picture of Appart 2, is it a 3D object (box/tile) with assigned texture?
How did you get working the VR (click) on the 3D objects?

Thank you