Melbourne example tileset not loading with Webpack example

CesiumJS
2

Hi @remoteoptix,

Thank you for your forum post and welcome to the community! I wonder if the issue that you are facing is related to not having the correct access tokens. Are you sure that you have access to the Melbourne dataset in your Cesium ion account? What errors are you receiving in your developer console?

To the best of my knowledge, your index.js file should look something like this:

import { defined, CesiumTerrainProvider, Cesium3DTileset, IonResource, Ion, Viewer, Cesium3DTileStyle } from "cesium";
import "cesium/Widgets/widgets.css";
import "../src/css/main.css"

Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJlYWE1OWUxNy1mMWZiLTQzYjYtYTQ0OS1kMWFjYmFkNjc5YzciLCJpZCI6NTc3MzMsImlhdCI6MTYyNzg0NTE4Mn0.XcKpgANiY19MC4bdFUXMVEBToBmqS8kuYpUlxJHYZxk";

var viewer = new Viewer("cesiumContainer", {
  terrainProvider: new CesiumTerrainProvider({
    url: IonResource.fromAssetId(1),
  }),
});
viewer.scene.globe.depthTestAgainstTerrain = true;

var tileset = viewer.scene.primitives.add(
  new Cesium3DTileset({
    url: IonResource.fromAssetId(354307),
  })
);

tileset.readyPromise
  .then(function () {
    viewer.zoomTo(tileset);

    // Apply the default style if it exists
    var extras = tileset.asset.extras;
    if (
      defined(extras) &&
      defined(extras.ion) &&
      defined(extras.ion.defaultStyle)
    ) {
      tileset.style = new Cesium3DTileStyle(extras.ion.defaultStyle);
    }
  })
  .otherwise(function (error) {
    console.log(error);
  });

Also, be sure to build your files before running npm run start. Users often run the following three commands in succession:

  1. npm install
  2. npm run build
  3. npm run start

I also took the time to create a branch in the cesium-webpack-example repository for your use case. The branch Melbourne-dataset should have all of the functionality that you need.

Best,
Sam