### Availability Configuration Example Source: http://mars3d.cn/api/TencentLayer.html Examples demonstrating how to configure the availability of a layer using different formats. ```javascript // Multiple intervals with start, stop, and inclusion flags layer.availability = [ { start: "2017-08-25 08:00:00", stop: "2017-08-25 08:01:20", isStartIncluded: true, isStopIncluded: false }, { start: "2017-08-25 09:00:00", duration: 10 } // Supports duration in seconds if stop is not configured ] // Multiple intervals with relative time (seconds from map.clock.startTime) layer.availability = [ { start: 0, stop: 10, isStartIncluded: true, isStopIncluded: false }, { start: 30, duration: 10 } // Supports duration in seconds if stop is not configured ] // Single interval layer.availability = { start: "2017-08-25 08:00:00", stop: "2017-08-25 08:01:20", isStartIncluded: true, isStopIncluded: false } // Using Cesium.TimeIntervalCollection (multiple intervals) layer.availability = new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:00")), stop: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:20")), isStartIncluded: true, isStopIncluded: false }) ]) // Using Cesium.TimeInterval (single interval) layer.availability = new Cesium.TimeInterval({ start: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:00")), stop: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:20")), isStartIncluded: true, isStopIncluded: false }) ``` -------------------------------- ### Ready Promise Example Source: http://mars3d.cn/api/TencentLayer.html Example of how to use the readyPromise to execute code after the layer has loaded. ```javascript tiles3dLayer.readyPromise.then(function(layer) { console.log("load完成", layer) }) ``` -------------------------------- ### TimeDynamicPointCloud Style Example Source: http://mars3d.cn/api/cesium/TimeDynamicPointCloud.html Example of how to apply a 3D Tiles Styling language to a TimeDynamicPointCloud. ```APIDOC ## TimeDynamicPointCloud Style ### Description Applies a style to the TimeDynamicPointCloud using the 3D Tiles Styling language. This allows for dynamic coloring and visibility based on properties like 'Classification'. ### Usage Example ```javascript pointCloud.style = new Cesium.Cesium3DTileStyle({ color : { conditions : [ ['${Classification} === 0', 'color("purple", 0.5)'], ['${Classification} === 1', 'color("red")'], ['true', '${COLOR}'] ] }, show : '${Classification} !== 2' }); ``` ### Reference - 3D Tiles Styling language ``` -------------------------------- ### start() Source: http://mars3d.cn/api/RotateOut.html Starts the camera rotation. This method is used to initiate the rotation process. ```APIDOC ## start() ### Description Starts the camera rotation. ### Method start ### Returns void ``` -------------------------------- ### ReadyPromise Usage Example Source: http://mars3d.cn/api/GaodeLayer.html Example demonstrating how to use the readyPromise to execute code after the layer has finished loading. ```APIDOC ##### Usage Example: ```javascript tiles3dLayer.readyPromise.then(function(layer) { console.log("load completed", layer) }) ``` ``` -------------------------------- ### ModelLayer Initialization Example Source: http://mars3d.cn/api/ModelLayer.html Example of how to initialize and add a ModelLayer to the map. This demonstrates setting the layer name, style (including model URL, scale, and heading), and position. ```APIDOC ## ModelLayer Initialization Example ### Description This example shows how to create a `ModelLayer` instance for a single model and add it to the map. It includes setting the layer's name, style properties like `url`, `scale`, and `heading`, and its geographical `position`. ### Usage ```javascript // For a single model, directly pass the position as shown below let gltfLayer = new mars3d.layer.ModelLayer({ name: '上海浦东', style: { url: 'http://data.mars3d.cn/gltf/mars/shanghai/scene.gltf', scale: 520, heading: 215 }, // style is the same as the plotted model type position: [121.507762, 31.233975, 200], }); map.addLayer(gltfLayer); ``` ``` -------------------------------- ### Task Item Options Examples Source: http://mars3d.cn/api/Task.html Demonstrates different ways to define task item options, including start/stop times, duration, and delays. These examples illustrate how to configure time-based or queued tasks. ```javascript { type: "mapRotate", name: "地球自旋转", start: 3, stop: 9 } ``` ```javascript { type: "mapRotate", name: "地球自旋转", start: 3, duration: 6 } ``` ```javascript { type: "zoomIn", name: "放大地图", duration: 1, delay: 0 } ``` ```javascript { type: "mapRotate", name: "地球自旋转", duration: 6, delay: 2 } ``` -------------------------------- ### Availability Usage Example Source: http://mars3d.cn/api/GaodeLayer.html Examples demonstrating how to set the availability property for a layer, supporting both array and single object formats, and using absolute or relative time values. ```APIDOC ##### Usage Example: ```javascript // Normal value passing, multiple [Recommended] layer.availability = [ { start: "2017-08-25 08:00:00", stop: "2017-08-25 08:01:20", isStartIncluded: true, isStopIncluded: false }, { start: "2017-08-25 09:00:00", duration: 10 } // Supports not configuring stop, directly configuring duration in seconds ] // Also supports relative time in seconds (relative to map.clock.startTime) layer.availability = [ { start: 0, stop: 10, isStartIncluded: true, isStopIncluded: false }, { start:30, duration: 10 } // Supports not configuring stop, directly configuring duration in seconds ] // Normal value passing, single layer.availability = { start: "2017-08-25 08:00:00", stop: "2017-08-25 08:01:20", isStartIncluded: true, isStopIncluded: false } // Cesium native syntax, multiple layer.availability = new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:00")), stop: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:20")), isStartIncluded: true, isStopIncluded: false }), ]) // Cesium native syntax, single layer.availability = new Cesium.TimeInterval({ start: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:00")), stop: Cesium.JulianDate.fromDate(new Date("2017-08-25 08:00:20")), isStartIncluded: true, isStopIncluded: false }) ``` ``` -------------------------------- ### Example: Edge Detection with Multiple Silhouettes Source: http://mars3d.cn/api/cesium/PostProcessStageLibrary.html Demonstrates how to create multiple edge detection stages with different colors and apply them to specific features using `createSilhouetteStage`. This example highlights edges around `feature0` in yellow and `feature1` in lime. ```javascript // multiple silhouette effects const yellowEdge = Cesium.PostProcessStageLibrary.createEdgeDetectionStage(); yellowEdge.uniforms.color = Cesium.Color.YELLOW; yellowEdge.selected = [feature0]; const greenEdge = Cesium.PostProcessStageLibrary.createEdgeDetectionStage(); greenEdge.uniforms.color = Cesium.Color.LIME; greenEdge.selected = [feature1]; // draw edges around feature0 and feature1 postProcessStages.add(Cesium.PostProcessStageLibrary.createSilhouetteStage([yellowEdge, greenEdge])); ``` -------------------------------- ### startBounce(options) Source: http://mars3d.cn/api/LabelEntity.html Starts the bounce animation. ```APIDOC ## startBounce(options) ### Description Starts the bounce animation. ### Method void ### Endpoint Not applicable (method call) ### Parameters #### Path Parameters - **options** (object) - Optional - Parameters, including: - **maxHeight** (number) - Optional - The maximum bounce height in pixels. Defaults to 50. - **step** (number) - Optional - The bounce increment, controlling speed in pixels. Defaults to 1. - **autoStop** (boolean) - Optional - Whether to automatically stop. If true, it will gradually weaken to a stop. ### Response None ``` -------------------------------- ### loadingEvent Source: http://mars3d.cn/api/cesium/CustomDataSource.html Gets an event that will be raised when the data source either starts or stops loading. ```APIDOC ## loadingEvent : Event ### Description Gets an event that will be raised when the data source either starts or stops loading. ``` -------------------------------- ### Create and Configure BaseLayerPicker Source: http://mars3d.cn/api/cesium/BaseLayerPicker.html This example demonstrates how to create a list of available imagery providers and then initialize the BaseLayerPicker widget with these providers. Ensure the necessary CSS is included and the container element exists in the HTML. ```javascript // In HTML head, include a link to the BaseLayerPicker.css stylesheet, // and in the body, include:
//Create the list of available providers we would like the user to select from. //This example uses 3, OpenStreetMap, The Black Marble, and a single, non-streaming world image. const imageryViewModels = []; imageryViewModels.push(new Cesium.ProviderViewModel({ name: "Open\u00adStreet\u00adMap", iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/openStreetMap.png"), tooltip: "OpenStreetMap (OSM) is a collaborative project to create a free editable \nmap of the world.\nhttp://www.openstreetmap.org", creationFunction: function() { return new Cesium.OpenStreetMapImageryProvider({ url: "https://tile.openstreetmap.org/" }); } })); imageryViewModels.push(new Cesium.ProviderViewModel({ name: "Earth at Night", iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/blackMarble.png"), tooltip: "The lights of cities and villages trace the outlines of civilization \nin this global view of the Earth at night as seen by NASA/NOAA's Suomi NPP satellite.", creationFunction: function() { return Cesium.IonImageryProvider.fromAssetId(3812); } })); imageryViewModels.push(new Cesium.ProviderViewModel({ name: "Natural Earth\u00a0II", iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/naturalEarthII.png"), tooltip: "Natural Earth II, darkened for contrast.\nhttp://www.naturalearthdata.com/", creationFunction: function() { return Cesium.TileMapServiceImageryProvider.fromUrl( Cesium.buildModuleUrl("Assets/Textures/NaturalEarthII") ); } })); //Create a CesiumWidget without imagery, if you haven't already done so. const cesiumWidget = new Cesium.CesiumWidget("cesiumContainer", { baseLayer: false }); //Finally, create the baseLayerPicker widget using our view models. const layers = cesiumWidget.imageryLayers; const baseLayerPicker = new Cesium.BaseLayerPicker("baseLayerPickerContainer", { globe: cesiumWidget.scene.globe, imageryProviderViewModels: imageryViewModels }); ``` -------------------------------- ### timeRangeStr Source: http://mars3d.cn/api/BasePolyPrimitive.html Gets the start and end times of the current time-series coordinates as time strings. ```APIDOC ## timeRangeStr ### Description Gets the start and end times of the current time-series coordinates as time strings. ### Type object ### Access Read-only ``` -------------------------------- ### PitEntity Constructor Example Source: http://mars3d.cn/api/PitEntity.html Demonstrates how to create a new PitEntity with various configuration options. ```javascript new mars3d.graphic.PitEntity({ name: "井", positions: [ { lng: 116.3, lat: 39.7 }, { lng: 116.4, lat: 39.7 }, { lng: 116.4, lat: 39.8 }, { lng: 116.3, lat: 39.8 }, { lng: 116.3, lat: 39.7 } ], style: { diffHeight: 1000 //井下深度(单位:米) }, attr: { id: "2023", remark: "井对象" } }) ``` -------------------------------- ### timeRange Source: http://mars3d.cn/api/BasePolyPrimitive.html Gets the start and end times of the current time-series coordinates in Cesium.JulianDate format. ```APIDOC ## timeRange ### Description Gets the start and end times of the current time-series coordinates in Cesium.JulianDate format. ### Type object ### Access Read-only ``` -------------------------------- ### Get and Set ModelFeature Property Source: http://mars3d.cn/api/cesium/ModelFeature.html Demonstrates how to get a specific property value and how to set a property value on a ModelFeature. The second example shows a common pattern for tracking a 'clicked' state. ```javascript const height = feature.getProperty('Height'); // e.g., the height of a building ``` ```javascript const name = 'clicked'; if (feature.getProperty(name)) { console.log('already clicked'); } else { feature.setProperty(name, true); console.log('first click'); } ``` -------------------------------- ### ModelAnimation Events Source: http://mars3d.cn/api/cesium/ModelAnimation.html Details the events that can be listened to for ModelAnimation, including start, stop, and update events, with examples of how to use them. ```APIDOC ## ModelAnimation Events ### start : Event The event fired when this animation is started. This can be used, for example, to play a sound or start a particle system, when the animation starts. This event is fired at the end of the frame after the scene is rendered. Default: `new Event()` ##### Usage Example: ```javascript animation.start.addEventListener(function(model, animation) { console.log(`Animation started: ${animation.name}`); }); ``` ### stop : Event The event fired when this animation is stopped. This can be used, for example, to play a sound or start a particle system, when the animation stops. This event is fired at the end of the frame after the scene is rendered. Default: `new Event()` ##### Usage Example: ```javascript animation.stop.addEventListener(function(model, animation) { console.log(`Animation stopped: ${animation.name}`); }); ``` ### update : Event The event fired when on each frame when this animation is updated. The current time of the animation, relative to the glTF animation time span, is passed to the event, which allows, for example, starting new animations at a specific time relative to a playing animation. This event is fired at the end of the frame after the scene is rendered. Default: `new Event()` ##### Usage Example: ```javascript animation.update.addEventListener(function(model, animation, time) { console.log(`Animation updated: ${animation.name}. glTF animation time: ${time}`); }); ``` ``` -------------------------------- ### Iterate and Modify Clouds in Collection Source: http://mars3d.cn/api/cesium/CloudCollection.html Iterate through all clouds in the collection using `CloudCollection#length` and `CloudCollection#get`. This example toggles the `show` property of each cloud. ```javascript // Toggle the show property of every cloud in the collection const len = clouds.length; for (let i = 0; i < len; ++i) { const c = clouds.get(i); c.show = !c.show; } ``` -------------------------------- ### Bind addTile Event Listener Source: http://mars3d.cn/api/BaseTileLayer.html Example of how to bind a listener to the 'addTile' event for raster tile layers. This event fires when a tile starts loading. ```javascript layer.on(mars3d.EventType.addTile, function (event) { console.log('addTile', event) }) ``` -------------------------------- ### Initialize CustomHeightmapTerrainProvider Source: http://mars3d.cn/api/cesium/CustomHeightmapTerrainProvider.html Example of initializing the Cesium Viewer with a CustomHeightmapTerrainProvider. This setup uses a callback function to generate height data for each tile, defaulting to all zeros in this case. ```javascript const viewer = new Cesium.Viewer("cesiumContainer", { terrainProvider: new Cesium.CustomHeightmapTerrainProvider({ width: 32, height: 32, callback: function (x, y, level) { return new Float32Array(32 * 32); // all zeros }, }), }); ``` -------------------------------- ### Subtitle Item Structure Examples Source: http://mars3d.cn/api/Subtitles.html Demonstrates different ways to define a subtitle item, including specifying start and stop times, duration, and delay for sequential display. ```javascript // Way 1: (start + stop) { text: "I am the first sentence", start: 3, stop: 9 }, // Way 2: (start + duration) { text: "I am the first sentence", start: 3, duration: 6 }, // Corresponds to start:3-stop:9 // Way 3: (duration + delay), queue-style for easy overall adjustment { text: "I am the first sentence", duration: 1, delay: 0 }, // Corresponds to start:0-stop:1 { text: "I am the second sentence", duration: 6, delay: 2 } // Corresponds to start:3-stop:9 ``` -------------------------------- ### startEditing Source: http://mars3d.cn/api/VideoPrimitive.html Enables editing mode for the video primitive. ```APIDOC ## startEditing() → void ### Description Enables the editing mode for the video primitive, allowing modifications. ### Returns - void ``` -------------------------------- ### Get Layer Availability JSON Source: http://mars3d.cn/api/BaseGraphicLayer.html Retrieves a simplified array of time-based availability objects. These objects represent time ranges and are relative to the map's clock start time. ```javascript const availabilityData = layer.getAvailabilityJson() ``` -------------------------------- ### start Source: http://mars3d.cn/api/FixedRoute.html Initiates the flight animation along the defined route. ```APIDOC ## start() ### Description Starts the flight animation along the defined route. ### Method `start()` ### Parameters None ### Response #### Success Response (void) No return value. #### Response Example None ``` -------------------------------- ### Start Drawing Vector Data with Event Listener Source: http://mars3d.cn/api/Lod2GraphicLayer.html Initiates the drawing of vector data on the current layer. The drawn data is loaded into the layer. This example demonstrates listening for the 'drawCreated' event on the graphicLayer to handle the completion of the drawing process. ```javascript graphicLayer.on(mars3d.EventType.drawCreated, function (e) { console.log("绘制矢量对象完成", e); }); graphicLayer.startDraw({ type: "point", style: { pixelSize: 12, color: "#3388ff" } }) ``` -------------------------------- ### get Source: http://mars3d.cn/api/cesium/TimeIntervalCollection.html Gets the interval at the specified index. ```APIDOC ## get(index) ### Description Gets the interval at the specified index. ### Parameters #### Path Parameters None #### Query Parameters None #### Request Body - **index** (number) - The index of the interval to retrieve. ### Request Example ```json { "index": 0 } ``` ### Response #### Success Response (200) - **TimeInterval** (TimeInterval) - The interval at the specified index. #### Response Example ```json { "start": "2023-01-01T00:00:00Z", "stop": "2023-01-02T00:00:00Z", "isStartIncluded": true, "isStopIncluded": false, "data": {} } ``` #### Error Response (404) - **undefined** - If no interval exists at that index. ``` -------------------------------- ### Create and Add a Simple Post-Process Stage Source: http://mars3d.cn/api/cesium/PostProcessStage.html This example demonstrates how to create a basic post-process stage to modify the scene's color. It defines a fragment shader with uniforms for scaling and offsetting the color values. The stage is then added to the scene's post-process stages. ```javascript const fs =` uniform sampler2D colorTexture; in vec2 v_textureCoordinates; uniform float scale; uniform vec3 offset; void main() { vec4 color = texture(colorTexture, v_textureCoordinates); out_FragColor = vec4(color.rgb * scale + offset, 1.0); }`; scene.postProcessStages.add(new Cesium.PostProcessStage({ fragmentShader : fs, uniforms : { scale : 1.1, offset : function() { return new Cesium.Cartesian3(0.1, 0.2, 0.3); } } })); ``` -------------------------------- ### startEditing Source: http://mars3d.cn/api/CloudPrimitive.html Enables editing mode for the CloudPrimitive object. ```APIDOC ## startEditing() ### Description Enables editing mode for the CloudPrimitive object. ### Method `startEditing()` ### Returns - `void` ``` -------------------------------- ### start(point) Source: http://mars3d.cn/api/RotatePoint.html Starts the rotation of a point. The rotation can be centered around a specified point. ```APIDOC ## start(point) ### Description Starts the rotation of a point. The rotation can be centered around a specified point. ### Method start ### Parameters #### Path Parameters - **point** (LngLatPoint | Cesium.Cartesian3 | Array.