after importing glTF 3D models, (.glb files) how do I save them for when I open the app again

322
5
Jump to solution
06-23-2021 02:57 PM
MichaelLev
Occasional Contributor III

I'm developing custom widgets for WAB (Develper Edtion) 2.20, Launchpad Theme, on 3D Scenes (ArcGIS API for javascript 4.20).

ESRI example "Import glTF 3D Models" shows how to import 3D glTF models (.glb files) into my WAB web application 3D scene, using the SketchViewModel.

 

My question - how do I save those 3D models with all their updated properties (user selected location and changed size and rotation), for next time when I open my web app?

 

I thought of 3 ways, but I do not know how to implement any of them, and I need help -

1. Is there a way to add them to a proper existing feature layer that will be read when I open the app again?

2. Another way - I can save the original 3D model file into Amazon S3 cloud, But how can I "extract" the properties from the 3D model (to know the size and rotation), and when the user opens again the web app, how can I "set" the model properties to the values the user chose before? 

3. Another option - How can I "Select" the model after the user have set all its properties (size, rotation, location), "convert" it to a file, and save this file into Amazon S3 cloud? By this way, after the user has set all the properties by the model "handles", the updated 3D model will be saved as a file with all its updated properties.

 

Help will be greatly appreciaetd.

0 Kudos
1 Solution

Accepted Solutions
MichaelLev
Occasional Contributor III

At last I succeeded.

I apologize I have not emphasized it enough the our web app (developed by WAB AppBuilder Developer Edition 2.20) is used by our customers, so there is no option for them to save anything in the server.

So I solved the need to save "*.glb" files (3D model files, generated by other tools, into a file in the PC) it in this way (I will explain the principles) -

As each glb, when read, is connected with a graphic layer (see the ESRI example Import glTF 3D Models so I grouped all these graphic layers in a group layer. Then, when the user want to save all his glb files (and maybe he/she also have edited them as he/she wishes), I convert the group into JSON, and I implemented 2 ways to save the JSON -  

1. First I saved it to browser localStorage (then it will be available only for single person)

2. Then I "upgraded" and saved it to Amazon cloud, so it will be availabele to anyone in the customer team, when opening this web app.

And when the user enters the web app, I search the relevant folder in Amazon cloud, load the json file (if exists) then convert from JSON and create the relevant graphic layers in that group.

View solution in original post

0 Kudos
5 Replies
KeirenMarshall
Esri Contributor

Hi @MichaelLev , 

There is two ways to save 3D seen in a Web App.

1. You can publish a service from ArcGIS Pro into your portal (Enterprise portal or ArcGIS Online) and then add this int to your Web App or create a 3D scene web app form that ( Web app Builder is a simple we bap you can use) Publish hosted scene layers—Portal for ArcGIS | Documentation for ArcGIS Enterprise

2. If you do not have ArcGSI Pro and or if the scene layer is in the condition your happy with ( from looking at the link you shared it looks good) you can add the layer straight into your Portal contents as a scene layer, (you cant add it straight into the Scene view in the portal) Once you have the scene stored in your Content you can add it into the scene. Add layers to scenes—Portal for ArcGIS | Documentation for ArcGIS Enterprise

From there you can save the scene and turn that into a Web App. 

Create apps from scenes—Portal for ArcGIS | Documentation for ArcGIS Enterprise

Hope that helps 

Esri Australia Consultant and Business Analyst
0 Kudos
MichaelLev
Occasional Contributor III

Dear @KeirenMarshall , 

Your suggestions involve the desktop app, so they are irrelevamt. I need to do all from the web app. The web app is connected to an existing scene. I can not save a new scene.

I updated my question, suggesting some ways. only I do not know how to implement a solution. Please read again. Thank you.

0 Kudos
MichaelLev
Occasional Contributor III

Dear @RobertScheitlin__GISP ,

I am afraid that my question, though it is short, yet it needs an expert... Can you help?

0 Kudos
RalucaNicola1
Esri Contributor

Hi Michael, sorry for the late reply. You can use a point feature layer with size/rotation attributes and ObjectSymbol3DLayer symbology. From what I understand from you, editing is the functionality you are looking for to persist the size/rotation/position values. Check out our editing sample, this does what you need as far as I understand: https://developers.arcgis.com/javascript/latest/sample-code/widgets-editor-3d/ You'd need to store the gltf somewhere on the server to be able to use them as symbols. 

 

Let us know if you have more questions.

0 Kudos
MichaelLev
Occasional Contributor III

At last I succeeded.

I apologize I have not emphasized it enough the our web app (developed by WAB AppBuilder Developer Edition 2.20) is used by our customers, so there is no option for them to save anything in the server.

So I solved the need to save "*.glb" files (3D model files, generated by other tools, into a file in the PC) it in this way (I will explain the principles) -

As each glb, when read, is connected with a graphic layer (see the ESRI example Import glTF 3D Models so I grouped all these graphic layers in a group layer. Then, when the user want to save all his glb files (and maybe he/she also have edited them as he/she wishes), I convert the group into JSON, and I implemented 2 ways to save the JSON -  

1. First I saved it to browser localStorage (then it will be available only for single person)

2. Then I "upgraded" and saved it to Amazon cloud, so it will be availabele to anyone in the customer team, when opening this web app.

And when the user enters the web app, I search the relevant folder in Amazon cloud, load the json file (if exists) then convert from JSON and create the relevant graphic layers in that group.

View solution in original post

0 Kudos