How to add features to Cesium JS?

So I’m currently working on a project that visualizes cities and wanted to play around with the shadows/lighting. Im not familiar with coding and mainly focus on 3d modelling/visualization so I used Sandcastle as a basis. I cant seem to copy and paste most code there, at least those with Sandcastle in the code. Is there a way to transfer it so its useable on my project? This is the current code I want to add:
Sandcastle.addToggleButton(“Shadows”, viewer.shadows, function (
checked
) {
viewer.shadows = checked;
});
Sandcastle.addToggleButton(“Entity Shadows”, true, function (checked) {
var entityShadows = checked
? Cesium.ShadowMode.ENABLED
: Cesium.ShadowMode.DISABLED;
for (i = 0; i < entitiesLength; ++i) {
var entity = entities[i];
var visual = entity.model || entity.box || entity.ellipsoid;
visual.shadows = entityShadows;
}
});

Sandcastle uses backbone bindings, so if you’re using that, it’s not too hard to convert. However, attempting to do coding without knowing code is, umm, brave? :slight_smile:

What does your coding environment look like? What sort of frameworks or not do you use? If the answer is, you don’t know, then I’d recommend you look into downloading Sandcastle as a local runnable and simply keep using Sandcastle, it does make it easier if you don’t know too much about coding in general. Check the Cesium website for more on that.

If it’s plain vanilla JS, then there’s a ton of pain in your path forward, but if you slip JQuery in there, it might get tolerable (easier binding between controls and actions). And then there’s all types of frameworks and models all the way up to big frameworks like React and Angular, and anything in between. Tell us a bit about how you’d like to put your application together, and we might be able to provide a bit more useful help for you.

Cheers,

Alex

Hey thank you for the response! I was more responsible for generating 3D models but now I need to understand more about the coding behind this project. We currently do have most of the project set up its just adding the features at the moment. Our framework is ReactJS and our coding environment is JavaScript.

Well, I can’t teach you React and programming, but search up buttons and React binding and template definitions, and use the Cesium API as normal. React has check buttons you can bind to easily. The only thing to say is that Sandcastle uses global JS space for all variables, while React and Angular uses better isolation and components, so you need to think about architecture and how to pass your data (like entities) around.

Apart from that, good luck.

Cheers,

Alex

1 Like