Is it possible to create an offline version of cesium sandcastle?

Hello!

I am still pretty new to cesium, so please bear with me if this question seems foolish.

Is it possible to create an offline instance/version of cesium sandcastle on a local https server or otherwise? If so, where might be the relevant guides to do so located?

I would like to be able to run code offline as I do online in cesium sandcastle, but do not know it if it’s possible.

Yes!

When you …

  • Clone the repository
    git clone https://github.com/CesiumGS/cesium.git
    cd cesium
  • Install the dependencies
    npm install
  • Build CesiumJS
    npm run build
  • Start it
    npm run start

then it will already start a local server, and print

Cesium development server running locally. Connect to http://localhost:8080/

When you open http://localhost:8080/ in the browser, you’ll see a (local) website with a list of things that you can do, like starting the main Cesium Viewer, the test suite, but also the Sandcastle: It will be available at http://localhost:8080/Apps/Sandcastle/

Note that by default, CesiumJS still requires an internet connection, e.g. for downloading terrain data and such. But there also is a sandcastle that is just called ‘Offline’. This does not require a connection.

(Its online version is Cesium Sandcastle … and yeah… that does need a connection … but your local version won’t :slight_smile: )

That worked perfectly! Thank you so much!

What about, instead, a template HTML file where to just paste sandcastle javascript code and get it immediately working, i.e. with all dependencies autoamtically retrieved online?

When you have a sandcastle open, then there’s that “Open in New Window” button that will open that sandcastle in a new window. In this case, the sandcastle source code will be part of the URL, like

https://sandcastle.cesium.com/standalone.html#c=tVZtb9s2E....J7T/wA

with that last part (c=...) being a representation of the sandcastle code.

You can still create a standalone HTML file that contains “the Sandcastle code” in a script tag:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <script src="https://cesium.com/downloads/cesiumjs/releases/1.120/Build/Cesium/Cesium.js"></script>
  <link href="https://cesium.com/downloads/cesiumjs/releases/1.120/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
  <title>Example</title>
</head>

<body style="background-color:#AAAAAA; color:white">
<div id="cesiumContainer" style="width: 1000px;"></center>

<script type="module">
// Your "Sandcastle" code going here...
</script>

</body>
</html>

(This is what your other thread is about…)