Naive question concerning management of dependencies includes

Hi everybody,

I’m planning to use Cesium as the main 3D visualization plugin for geospatial catalog.
I’m used with NASA WorldWind, java, etc… so Javascript & WebGL is pretty new for me.

I read all the examples provided with the sandcastle and I like this approach.
Nevertheless, I need to understand how to add module dependencies on real project.

I cloned the CesiumViewer app to keep it as-is, and try to add WMS layers to my custom viewer project.
Basically, I try to add a WMS layer and it works pretty well in the SandCastle (even in the CesiumViewer example)
Let’s take a very simple example I found in the sandcastle so that you can easily reproduce the problem (removing all the layers, and adding a single static image)

var layers = widget.centralBody.getImageryLayers();
var singleTileLayer = layers.addImageryProvider(new Cesium.SingleTileImageryProvider({
url : require.toUrl(‘Assets/Textures/NE2_LR_LC_SR_W_DR_2048.jpg’)

When I try to add the layer in the real app… I have this message returned:
“TypeError: Cesium.SingleTileImageryProvider is not a constructor”

How can I add (and where) all the dependencies required by SingleTileImageryProvider?
Thanks for your help.


I assume you’re making your modifications to a copy of Apps/CesiumViewer/CesiumViewer.js?

The call to define at the top of that file is a standard AMD function ( which specifies the list of dependencies. These are somewhat analogous to import statements in Java, though as you can see, the syntax is different.

To use the SingleTileImageryProvider module, you need to add the module ID as a string to the first array, in this case ‘Source/SingleTileImageryProvider’, and then add an argument to the definition function below, in this case SingleTileImageryProvider.











], function(








SingleTileImageryProvider) {

You can follow the same pattern to require in other modules, and you can make your own modules to keep your application code organized. For more information about AMD, the RequireJS page has some good details and rationale:


Thanks Scott,

You’re right I modified a the CesiumViewer.js file.
Regarding includes declaration, that’s what I thought but there’s still a bug somewhere.
Here’s the error message I get in the Javascript console when I try to instantiate SingleTileImageryProvider:
“Uncaught TypeError: undefined is not a function”

Is there something wrong with this syntax? (it works on Sandcastle)


var singleTileLayer = layers.addImageryProvider(new Cesium.SingleTileImageryProvider({

url : require.toUrl(‘Assets/Textures/NE2_LR_LC_SR_W_DR_2048.jpg’)


I put a breakpoint to check what’s going on and tried to type commands directly on the command line, without success.
Seems the package is no loaded :frowning:

In Firefox/Firebug, the error message is more explicit than in Chrome:

TypeError: Cesium.SingleTileImageryProvider is not a constructor

url : require.toUrl('Assets/Textures/NE2_LR_LC_SR_W_DR_2048.jpg')

Use SingleTileImageryProvider instead of Cesium.SingleTileImageryProvider.

The Sandcastle examples require in a special “Cesium” module, which is a module which depends on every single module in Cesium. This is convenient for interactively editing in the browser, but it results in every single file being loaded, whether its actually needed or not.

Many thanks.

You helped me a lot… as it’s not easy to get started with Cesium.

Sandcastle is great to discover te SDK features but differences with real apps are not well explained. At least I didn’t find the answer until I asked the question :slight_smile:

Cesium is definitively a great piece of software.