Is there a requirement and tutorial for clipping a Google 3D tile in Cecium ion?

Is there a requirement and tutorial for clipping a Google 3D tile in Cecium ion?

Hi,

We currently do not allow clipping third party data hosted on Cesium ion. This means that Cesium ion doesn’t currently provide functionality to be able to clip Google Photorealistic 3D Tiles.

Currently users can create clips of their own data or our global data products (like Cesium World Terrain, Sentinel2 etc)

Thanks,
Ankit

Hi @Ankit_Trehan
Thanks for the reply.

Now then,
What system settings would be needed to enable clipping as shown in the following link?

Is it a prerequisite to have your own hosting system with CDN and PaaS with Amazon or other services, and then clipping with CesiumJS?

And
Is there a tutorial on clipping in that case?

If it is the following link, I am reading it but it is hard to understand.

Hi,

I apologize for any confusion, I was referencing to clipping data on Cesium ion which lets you create an archive of a dataset. The functionality on the provided links is ClippingPolygons which hide data and overlay your asset on top of it, which is part of Cesium js.

To do the functionality you are referencing in the issue you shouldn’t need any pre-requisites. Cesium js already has the functionality for it. You can see it in the sandcastle example that you have linked to. The link you have provided is the detailed documentation for ClippingPolygons

Can you please let me know what your use case is and I might be able to guide you better on what functionality you can use

Thanks,
Ankit

Hi,

The use case I envision is,
To promote community development, we would like to hide some of the 3D tiles as a tool for residents and government offices to check, place 3D models of sites and buildings on them, and allow multiple users to view them simultaneously as web content.

And
I want to make that as easy as possible.

For example
I would like to know an easy and simple mechanism or method to hide a part of the 3D tiles in a separate window that opens when the Present button is pressed after editing in Cesium ion using Cesium js.

Now, I am working on an assignment in CesiumJS Learning to “Visualize a Proposed Building in a 3D City” and I think I am starting to understand it a little better.

Hi @Ankit_Trehan ,

When I save sandcastle’s Clipping Regions to html, upload it to netlify and access it in a browser, the earth turns black as in the attached image and does not move to the clipped position as it does when executed in sandcastle.

Please let me know how to resolve this!

Hi,

Just to confirm, was only the html file uploaded to netlify or was it uploaded along with the built Cesium Js version? You would need the html file to be uploaded in addition to the built Cesium js library when creating a built version. Cesium Js would be the library adding the rendering if you are trying to create a stand alone application

Thanks,
Ankit

Hi,

All I uploaded was the html. But in that html I have written the path to the Cesium Js but I need to upload it as a file?

When you say a path to Cesium js, can you show me what you are referring to? Like the screenshot below shows, the html file should go into Sandcastle directory within Cesium js

image

Hi @Ankit_Trehan ,

The files uploaded to netlity are shared in 3Dgis001.zip.

In this html, for example, the full path to the cesium js is described as follows.

< script src=“https ://cesium.com/downloads/cesiumjs/releases/1.121/Build/Cesium/Cesium.js”>< /script>

3Dgis001.zip (3.1 KB)

Also
If you click “Save As,” the file will be saved in your downloads folder under the file name “Clipping Regions.html.
How do I put this html in the Sandcastle directory?

My ultimate goal is,
I have satisfied the features in Sandcastle’s Clipping Regions (Show building, Enable clipping, Remove last polygon, Left click to add a vertex Right click to add the polygon to the clipping collection) and upload it to netlity to reproduce it.

Hi,

Do you have a URL you can share with the deployed version? That would be helpful to see the exact errors you are getting in the console (if any).

Trying view the sample you provided results in an error because Cesium.Ion.defaultAccessToken is invalid.

Regards,

Mark

Hi @mdc9001,

Once I figure out how to make the access token unique to that application, I will share the URL.

You can manage the access tokens for your account on the Access Token page. There is also learning content about access tokens if you need more information.

Hi @mdc9001,

I will share the URL of the deployed version.

https://testc001.netlify.app/

Thank you for sharing that URL.

When I ran your application there were a number of CORS errors in the console.

. The sandcastle server does not allow cross origin sharing. If you are using the CesiumJS from cesium.com instead of hosting it yourself, you should not set the window.CESIUM_BASE_URL. See the CDN example for this use case.

If you want to build and deploy CesiumJS as part of your application you can look at the Configuring CESIUM_BASE_URL section of Install with NPM quickstart. There are also examples for vite and webpack if you are looking to bundle and deploy additional code.

Hi @mdc9001,

Thanks!
I understand that cross-origin sharing is not allowed and therefore cannot be reproduced.

My technology does not yet allow me to fully understand the information in the link you gave me.

But first, I want to know,
Is it possible to deploy dynamic content, i.e., to Netlify, and achieve what I want to do without any server-side processing?

My ultimate goal is,
I have satisfied the features in Sandcastle’s Clipping Regions (Show building, Enable clipping, Remove last polygon, Left click to add a vertex Right click to add the polygon to the clipping collection) and upload it to netlity to reproduce it.

Is it possible to deploy dynamic content, i.e., to Netlify, and achieve what I want to do without any server-side processing?

Yes, you can create an application that will let a user edit a clipping polygon and have it deployed to Netlify.

The process is similar to deploying any other web app. You will just need to host some additional files (as described in the Install with NPM Quickstart) in addition to the javascript files.

1 Like

Hi @mdc9001,

I was finally able to reproduce it.

https://testc002.netlify.app/

Thank you!

Hi @mdc9001,

How do I set up multiple clippings to appear immediately after the content is loaded, like the clipping in sandcastle’s Clipping Regions.html?

// I have rewritten the Add a clipping region covering a total lot description in various ways, but it doesn’t work.

Hi @sung.sung,

The code to set the clipping regions is available in the Sandcastle itself. See lines 71 - 76 for where it sets the clipping regions.

If you are having trouble with the code you have written, the best way to get help is to try to simplify it down to a sandcastle that reproduces the problem. I would recommend posting the clipping issue in the CesiumJS forum to get more visibilty into your issue since it is mainly focused on working with CesiumJS and not loading assets from ion.

1 Like