Your first 3D globe from scratch
Quick answer
This tutorial builds a runnable CesiumJS globe from an empty HTML file using the CDN build and no build tooling. It explains why new Cesium.Viewer spins forever without a token and how baseLayer: false avoids Cesium ion imagery requests. It then strips default widgets, recolours globe.baseColor and background, hides skyBox, sun and atmosphere, and adds a point entity with camera.flyTo. Readers can ship a token-free viewer and know which Viewer options changed in 1.104.
Key points
- Set baseLayer: false in the Viewer constructor so no Cesium ion imagery request is made.
- Disable baseLayerPicker, geocoder, timeline and animation for presentational pages.
- Add entities with Cartesian3.fromDegrees and fly there using camera.flyTo with duration.
Example
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/cesium@1.121.0/Build/Cesium/Widgets/widgets.css">
<style>
html, body, #cesiumContainer { height: 100%; margin: 0; }
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script src="https://cdn.jsdelivr.net/npm/cesium@1.121.0/Build/Cesium/Cesium.js"></script>
<script>
var viewer = new Cesium.Viewer('cesiumContainer', {
baseLayer: false
});
</script>
</body>
</html>var viewer = new Cesium.Viewer('cesiumContainer', {
baseLayer: false,
baseLayerPicker: false,
geocoder: false,
homeButton: false,
sceneModePicker: false,
navigationHelpButton: false,
animation: false,
timeline: false,
fullscreenButton: false,
infoBox: false,
selectionIndicator: false
});
var scene = viewer.scene;
scene.globe.baseColor = Cesium.Color.fromCssColorString('#1c2733');
scene.backgroundColor = Cesium.Color.fromCssColorString('#0e1116');
scene.skyBox.show = false;
scene.sun.show = false;
scene.moon.show = false;
scene.skyAtmosphere.show = false;Notes
- baseLayer only controls imagery; passing terrain or terrainProvider can still trigger ion calls.
- Labels without disableDepthTestDistance: Number.POSITIVE_INFINITY hide behind the globe.
English edition written for Atlaslog. Code is taken from the original Chinese page and runs unchanged.
Atlaslog (2026). Your first 3D globe from scratch. https://www.jingweizhi.com/en/cesium/tutorials/minimal-scene.html (accessed 2026-11-03).