Back to the Shapespark home page

Configurator Commands


#7

Please continue the conversation here. I’m watching this thread because our next step will be hosting the walkthrough online.


#8

Just upload the scene in a normal way with the Upload button. If the scene has index.html file in its C:\Users\<USER>\Documents\Shapespark\<SCENE NAME>\ directory this file is uploaded instead of the default index.html (we’ve whitelisted your username).

As Ted suggested, if possible, let’s discuss here.


#9

Hi Jan,

Thanks again. I will continue to discuss here but if you feel the discussion is getting too specific for a forum just let me know.

I now understand your instructions for uploading the custom index and I just tried it but received the message ‘Scene upload failed: trial users cannot upload scenes with a custom index.html file. Buy Shapespark license or remove the index.html from the scene directory’. Is it possible the whitelisting of our username has not taken effect?

Our effort is to achieve control of the viewer with from our web-based configurator similar to the example you shared here: http://ex.i-plans.pl/shapespark/ (as opposed to controlling by clicking the materials or buttons overlayed on the viewer itself)

Would you be willing to share more details about how you built that demo and your system would allow us use similar fuctionality for our application?

Thanks again,

Eric


#10

Hi Eric,

You are right, the whitelisting did not work, please try again.

To control the viewer from the configurator you need to first include the viewer on the configurator page via an iframe with a code like this: https://www.shapespark.com/docs#uploading-embedding

Then you can send commands to the viewer index.html using the JavaScript postMessage API. The configurator can do something like:

iframe.contentWindow.postMessage('yourmessagecontent', 
                                  https://sundial.shapespark.com');

And in the viewer index.html can receive these messages:

window.addEventListener("message", receiveMessage, false);

function receiveMessage(event) {
  if (event.origin !== "https://configuratordomain") {
     return;
  }
  // Handle the message
}

This a standard mechanism for communicating between a page and an iframe, it is not a part of Shapespark API. The idea is that if a user for example selects a floor material from your configurator interface, the configurator will send a message to the viewer to change the floor material.

To be able to do anything useful in response to such messages we will need to at least add a function that would allow you to find a material by name. Can you talk with the developer what kind of operations you would like to perform, so we know if some other functions need to be also added?


#11

Hello Jan,

It has been a while. I have been monitoring the continued developments at Shapespark - great job!

We are continuing to seek a visualization solution for our product that will allow us to show/hide geometry to allow the geometry in the viewer to follow our online configurator.

This is an example of what we would like to do: http://montagestudio.com/demos/eco-homes/

Have there been any plans since we last chatted on this forum to add this type of functionality? I am not a webgl expert but it looks like the EcoHomes example bakes the scene without the optional geometry then inserts the optional geometry into the scene complete with shadows for the optional geometry.

I look forward to your thoughts. Thanks very much. Eric


#12

You can already do some of this with the Material Picker extension. You can change materials but you currently cannot show * hide objects (which I think would be a big plus :slightly_smiling_face:)

Take a look at this: Interaction with model part 2


#13

Hello @Eric_Bjornson. As @ntxdave pointed, we added support for changing materials, but in a short term we don’t have plans to add support for adding/removing objects.

In general such interactive changes are possible in WebGL, although require support of some form of dynamic lighting in the engine (for example EcoHomes looks like it is using ambient occlusion based lighting).


#14

What if you made it so all objects were visible during baking and then allowe us to set up controls (similar to the material picker) that allowe us to control the visibility?

IMO, from what I have seen as a bigger problem is the way objects are stored. If there are multiple instances of an object, the way Shapespark stores them, you can’t address them independently. Again, LMO, that issue needs to be addressed as well.


#15

You can already hide and show objects (Hide in views setting in the Objects tab). But this is intended mainly for hiding ceiling in floor plan views, or for example to show 3D text room names visible only in the floor plan views.

If you hide objects that cast significant shadows, the results won’t look good, like in this post: Configurator Commands


#16

Yes, I am aware of the ability to show/hide objects at the view level but this is not flexible enough (IMO). Let me put it this way:

  • Shapespark is, and markets itself as, a presentation tool. So let me give you a typical situation: I have a product the has multiple add-on options. I want the viewer to be able to see any combination of the options. Doing that at the view level is not really a viable solution.

#17

Hi Jan,

Despite really hoping to find a solution that includes geometry change functionality, I would still like to consider using your software to showcase our homes. I feel you have one of the best performance vs quality products available. We would like the ability to control views and materials from external triggers - I know we had briefly discussed your API under development - might this be something that might be made available soon?

Thanks again.

Eric


#18

@Eric, I agree that the performance and quality is one of the best out there. I also think that the ability to do HTML and Material Picker are excellent.

Your suggestion to control the triggers externally is interesting but I do not think they would give the ability to overcome some of the problems that @jan and @wojtek have pointed out before. Seems that the ability to control lighting for these situations (materials, show/hide objects, and things like that) would still be a problem.


#19

While working on the editor extensions we have moved the JavaScript API a bit forward, although it is not yet used by any external users.

You can use the API to implement the same functionality that the material change extension enables: replace all occurrences of one material within a scene with another material (this second material must also be present in the scene during loading). Is such functionality sufficient for you?


#20

Hi Jan,

Thanks for this. At minimum, we would need over material change, and camera position & target (which could be as simple as navigating to predetermined views) set within Shapespark (scene buttons in our app vs buttons at the top right corner of the viewer). It would also be great to have access to the show/hide object function so that we can do some experimentation.

I look forward to your reply.

Eric


#21

We don’t yet expose a function to navigate to predefined views, but you could do it by simulating clicks in the Shapespark view menu items with the JavaScript .click() method.

In the index.html the view elements are children of the <div> with id view-list.


#22

You can hide objects but you need to sacrifice shadows.
In this example https://all360.shapespark.com/prueba_sillones2/ I set up two ways to hide objects: one with shadows (the triangle chair) and one without shadows (the square chair). It works but only if you are willing to sacrifice the shadow to show two types of furniture arrangements


#23

Hi @jorgearq,
On the Large office space presentations @Kuba gave a usable light solution on the relief wall “…pre-baked in the 3d application…”
Would that solve the problem with (pre-baked) shadows on 2 copies of the floor?


#24

Hi @Vladan, pre-baking the shadows to the floor wouldn’t be very flexible - if you would have more pieces of furniture you would have to render several versions of the floor and than some how connect this to the changing chairs. What should work would be pre-baked shadows added to the chair as a simple plane underneath with transparent png


#25

Hi @Kuba, we should also be careful about the flickering of the additional layer above the floor. I am also aware of the effects of shadows of other objects near objects that are changing. Generally, both of your ideas can be helpful for now.
For the third solution, I’m not sure if it can be programmed into Shapespark: mark the box area where the shadows will be changed, render this area in extra baking map and connect it with the “object picker”?


#26

@Vladan I would just put the planes with shadows raised a little bit above the ground and the should work without flickering (a least at reasonably close distance)