how to run 3d-tile-samples?

CesiumJS
1

hi

I want to learning how to use 3D Tiles and a simple Node.js server for serving tilesets. this link: https://github.com/AnalyticalGraphicsInc/3d-tiles-samples help me.

but when I run ‘npm start’, I see in http://localhost:8003/ that it show ‘Cannot GET’.

do you know that how I solve this problem?

please help me

thanks a lot

2

Hello,

You will need to download the 3D tiles branch of Cesum https://github.com/AnalyticalGraphicsInc/cesium/tree/3d-tiles

See our build guide for instructions for cloning and building the code base : https://github.com/AnalyticalGraphicsInc/cesium/tree/3d-tiles/Documentation/Contributors/BuildGuide

Best,

Hannah

3

Yeah just to add on to Hannah’s message, the 3d-tiles-samples repo is only hosting the data. You need to run a Cesium app that points to the http://localhost:8003 url (like in the sample code provided in the 3d-tiles-samples github page).

4

Thank you Hannah. I do it but dont work yet

5

Thank you Sean

I do it but I dont know that where should I put below code:

var viewer = new Cesium.Viewer('cesiumContainer', {
    scene3DOnly : true
});

var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
    url : 'http://localhost:8003/tilesets/TilesetWithDiscreteLOD/'
}));

tileset.readyPromise.then(function(tileset) {
    viewer.camera.viewBoundingSphere(tileset.boundingSphere, new Cesium.HeadingPitchRange(0, -0.5, 0));
    viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
});

do you know that where I should put it?

6

Probably the easiest place to try out the code is Sandcastle. After building and running Cesium locally you can go to http://localhost:8080/Apps/Sandcastle/index.html?src=Hello%20World.html&label=Showcases and paste the code there.

7

You will need to download the 3D tiles branch of Cesum https://github.com/AnalyticalGraphicsInc/cesium/tree/3d-tiles
See our build guide for instructions for cloning and building the code base : https://github.com/AnalyticalGraphicsInc/cesium/tree/3d-tiles/Documentation/Contributors/BuildGuide

Is this branch merged into master yet?

8

3d-tiles is not merged into master yet, but we hope to do it next month - check out the PR here: https://github.com/AnalyticalGraphicsInc/cesium/pull/5308

9

Hi there! I’ve been trying to use the process outlined here (https://github.com/CesiumGS/3d-tiles-samples/blob/main/INSTRUCTIONS.md) to access the examples and load my own 3DTiles locally to test my app: http://localhost:8003/tileset.json

Despite testing several different values for the --cors flag including --cors=http://localhost:8080/, --cors , --cors='*' , and --cors=authorization, my Cesium app on port 8080 keeps returning a CORS error.

Access to XMLHttpRequest at ‘https://api.cesium.com/v1/assets/http:/localhost:8003/tileset.json/endpoint?access_token= …’ from origin ‘http://localhost:8080’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

Am I using the repository incorrectly or should this be working?

10

You mentioned that you wanted to test “your app” - what kind of application is this? It seems like it is using wrong URLs for the requests. At least, from looking at the URL in the error message:

https://api.cesium.com/v1/assets/http:/localhost:8003/tileset.json
^                                ^
|                                | 
Not sure where this comes from   The URL for your local tileset starts here

When you run the server, and then go to Cesium Sandcastle , enter

const tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
    url : 'http://localhost:8003/example/tileset.json'
}));

in the editor field, and press ‘Run’, does it work for you?

1 Like
11

Hi Marco, Thanks very much for this and apologies. It is a standalone Javascript app. The issue was staring me in the face the whole time. I’d been adapting existing code and had mistakenly placed the local url within a call to Cesium Ion. Calling the tileset directly as in the example resolved the issue. For anyone who comes here with problems I also suggest setting your browser to disable the browser cache during development. This might help stop you going down the wrong rabbit hole.

image