Material for Ellipsoid made from CZML source not displaying

CesiumJS
1

I am trying to display the path of the moon by using a CZML file that’s not actually a CZML file and is actually embedded in the html (I’m new to this, I don’t know what it is actually called) anywho the ellipsoid should have the material as seen in the link but it is just a white sphere moving along the path.
Here is the CZML snippet without the path points because there are like a 13,000 of them

var lunarOrbit_trajectory =
[ {
“id”:“document”,
“name”:“LunarOrbit”,
“version”:“1.0”,
“clock”:{
“interval”:“2024-06-11T15:25:47Z/2024-06-20T15:40:43Z”,
“currentTime”:“2024-06-11T15:25:47Z”,
“multiplier”:2100,
“range”:“LOOP_STOP”,
“step”:“SYSTEM_CLOCK_MULTIPLIER”
}},
{
“id”: “theMoon”,
“availability”:[“2024-06-11T15:25:47Z/2024-06-20T15:40:43Z”],
“ellipsoid” : {
“radii” : { “cartesian” : [ 1737000, 1737000, 1737000 ] },
“material” : {
“image” : { “uri” : “https://svs.gsfc.nasa.gov/vis/a000000/a004700/a004720/lroc_color_poles_1k.jpg” }
}
},
“label” : {
“fillColor” : {
“rgba” : [255, 255, 0, 255]
},
“font” : “bold 10pt Segoe UI Semibold”,
“horizontalOrigin” : “LEFT”,
“outlineColor” : {
“rgba” : [0, 0, 0, 255]
},
“pixelOffset” : {
“cartesian2” : [10.0, 0.0]
},
“scale” : 1.0,
“show” : true,
“style” : “FILL”,
“text” : “Moon”,
“verticalOrigin” : “CENTER”
},
“path” : {
“color” : { “rgba” : [150, 150, 150, 255] },
“width” : 1.5,
},
“position”: {
“referenceFrame”: “INERTIAL”,
“cartesian”:[ISO 8601 time format, x, y, z repeat a couple thousand times for each data point]}}];

And here is how I am loading the datasource into the viewer

var czmlDataSource2 = new Cesium.CzmlDataSource();
czmlDataSource2.load(lunarOrbit_trajectory);
viewer.dataSources.add(czmlDataSource2);

Any help on how to turn this Ellipsoid into the moon would be greatly appreciated. Thanks!

2

Hi @mikeyboy897, this sounds like an interesting idea!

I’m not sure why this particular image is not working. I am able to use an image as the material on an ellipsoid: see this Sandcastle example. But when I try to use your linked image, it is all white.

Could you take a look at czml ellipsoid Can't load image · Issue #7676 · CesiumGS/cesium · GitHub and see if it matches your issue? If it is the same problem, you could reopen the issue.

This older thread sounds like a similar problem.

3

Hi @mikeyboy897, on second look, I think you may be running into a CORS problem. If I launch Cesium from a local server, and save the image locally in Apps/Sandcastle/images/, then I get the following result with this local Sandcastle example

image
image1061×818 96 KB

Obviously I didn’t set the ellipsoid scale and position correctly (the moon is not that close!), but the image is loading OK.