How to create 3D markup and make canvas markup aggregation

I want to create a 3D markup,the effect as in the link below

https://open.daxiangyun.com/example#bim


And make the markup aggregate, like the effect in the link.

https://open.daxiangyun.com/example#bim

And I want create the skybox background like below link

Is there any method that can be used in hoops?Looking forward to your answer

Hi,

with regard to your question regarding skybox support. While skyboxes are not officially supported in HOOPS Communicator, it is possible in perspective projection mode to emulate a skybox by using a textured sphere far away from the origin. See below for a sandbox example:

https://3dsandbox.techsoft3d.com/?snippet=aH3DJpOtBLq6EWLGHMsDfR

panorama

I’m not sure I understand your question with regard to 3D markup. Can you provide more information.

Thanks

Just to follow-up, if you try to implement 3d markup you might want to have a look at the class below:

I mean, the markup we create usually exist in the form of div. I want to convert div into canvas, and the markup can be aggregated.Aggregation means that markup can be merged or expanded by scaling the model.The effect is the same as in the link below

I think you will have to write this functionality largely on your own. In general to convert a div to a canvas element you can use the library below, which is also used in HOOPS Communicator (and the spritemanager class I mentioned in my previous reply) for that purpose:

https://html2canvas.hertzen.com/

1 Like

Thank you for your method. So is there any way to make markup aggregation in hoops?

From what I can tell when looking at the link you provided, the markup is grouped together and styled differently based on the distance of the camera and some other proprietary heuristics. We don’t offer that functionality and you would have to implement this yourself on top of your existing markup logic, which I think should be fairy straightforward.

It is an interesting feature, so its possible this could into the spritemanager class at some point but there are no current plans.

1 Like

Thank you very much. :laughing:

When I used loadSubtreeFromScsFile function,the console prompts incompatible types.I used the same code as in the sandbox, and replaced the scsFilename of loadSubtreeFromScsFile with the string ’ https://livecodeeditorsandbox.s3.us-west-2.amazonaws.com/livecode/a3bb45e3-5b94-4ccd-89b2-19a830c43222/scene.scs '.What is the possible reason?
Thanks

Hi,

if you are loading scs files you need to make sure that you don’t start the webviewer in streaming mode. For example the code below would startup an empty viewer, that allows you to load scs files:

viewer = new Communicator.WebViewer({
containerId: container,
empty: true
});

1 Like

I would like to know how can we update/move the markers with camera update. I have created the markers with the help of addMarkupElement method in MarkupManager

There are a variety of ways to implement markups in Communicator. My recommendation is to view the main quickstart page and described in our docs:

You can simply do a search for the keyword “markup” on the main index page to view that example:

Hi thanks for the same, can we add an image inside a rectangle markup?

Please see the Sprite Manager example for adding images: