How to create a sphere at the Sun's location?

1,020 views
Skip to first unread message

Daniel Oneil

unread,
Aug 31, 2014, 12:12:24 PM8/31/14
to cesiu...@googlegroups.com
I'm trying to create a big gold sphere to represent the Sun but it's not working. I see the Earth but no other objects. Here's my code:

  <script>
    var viewer = new Cesium.Viewer('cesiumContainer');
    viewer.extend(Cesium.viewerEntityMixin);
   
    viewer.scene.camera.frustum.far = 1e11;  //Overwrite the distance to the far wall of the viewing frustum.
   
    var scene = viewer.scene ;
    var primitives = scene.primitives;

     radius = 1000;        
    var sphereGeometry = new Cesium.SphereGeometry({
        vertexFormat : Cesium.PerInstanceColorAppearance.VERTEX_FORMAT,
        radius : radius
});
    var instances = [];            // Array to hold geometry instances
   
var date = new Date('August 31, 2014 12:00:00 EST');
var julianDate = Cesium.JulianDate.fromDate(date, Cesium.TimeStandard.UTC);

var pointInSpace = new Cesium.Cartesian3(1.0,1.0,1.0);                   // Get the Sun's position.
Cesium.Simon1994PlanetaryPositions.computeSunPositionInEarthInertialFrame(julianDate, pointInSpace) ;

var sphereModelMatrix;
    sphereModelMatrix = Cesium.Matrix3.IDENTITY * pointInSpace ;
   
    instances.push(new Cesium.GeometryInstance({
        geometry : sphereGeometry,
        modelMatrix : sphereModelMatrix,
        attributes : {
            color : Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.GOLD)
        }
    }));
   
primitives.add(new Cesium.Primitive({
    geometryInstances : instances,
    appearance : new Cesium.PerInstanceColorAppearance({
        translucent : false,
        closed : true
    })
}));
  </script>

Corrections and recommendations would be appreciated.

Patrick Cozzi

unread,
Sep 1, 2014, 8:10:52 PM9/1/14
to cesiu...@googlegroups.com
Hi Daniel,

I'm not able to debug your code right now, but first try placing a label at the position you think the sun is at.  This way it will be big enough that you know you'll see it.  I suspect the 1,000 meters used now will be hard to spot.

Also, the Moon implementation may have some code of interest.

Patrick

Ed Mackey

unread,
Sep 2, 2014, 1:51:24 PM9/2/14
to cesiu...@googlegroups.com
Don't forget to ask Cesium to render stuff that far out.

    viewer.scene.camera.frustum.far = 1e12;

--Ed.



--
You received this message because you are subscribed to the Google Groups "cesium-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cesium-dev+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Daniel Oneil

unread,
Nov 2, 2014, 6:23:34 PM11/2/14
to cesiu...@googlegroups.com
The next attempt to put a giant volume at the location of the Sun starts with the Sandcastle volumes example.
A Cesium Inspector was added and when I click on view frustum, it indicates two objects, i.e., Earth and Moon.
The far wall of the viewing frustum is set to 1e12. The viewer is set to track and select the entity but the camera shows the Earth.

Please let me know whether I'm using the Cesium.Simon1994PlanetaryPositions.computeSunPositionInEarthInertialFrame function correctly.

 <script>
var e;                                             // global variable for entity
function createPrimitives(scene) {
    var primitives = scene.primitives;

    var date = new Date('November 02, 2014 12:00:00 EST');

    var julianDate = Cesium.JulianDate.fromDate(date, Cesium.TimeStandard.UTC);

    var pointInSpace = new Cesium.Cartesian3(1.0,1.0,1.0);
    Cesium.Simon1994PlanetaryPositions.computeSunPositionInEarthInertialFrame(julianDate, pointInSpace) ;
   
   console.log(pointInSpace);
   e = primitives.add(new Cesium.EllipsoidPrimitive({
        center : pointInSpace,
        radii : new Cesium.Cartesian3(50000000.0, 50000000.0, 50000000.0),     // 50M meter radius
        material : Cesium.Material.fromType(Cesium.Material.RimLightingType)
    }));

}

var viewer = new Cesium.Viewer('cesiumContainer');   

    viewer.scene.camera.frustum.far = 1e12;            //Move the far wall of the viewing frustum.
    viewer.extend(Cesium.viewerCesiumInspectorMixin);  //Add Cesium Inspector
   
    var scene = viewer.scene ;
    scene.skyBox.show = false ;                        // Turn off the sky box
    scene.sun.show = false ;                           // Don't show the Sun
   
    viewer.trackedEntity = e;                         //Camera will now track the entity
    viewer.selectedEntity = e;                        //Selection will now appear over object

viewer.screenSpaceEventHandler.setInputAction(function(movement) {
    var pickedPrimitive = viewer.scene.pick(movement.endPosition);
 //   Sandcastle.highlight(pickedPrimitive);
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

createPrimitives(viewer.scene);

 </script>

Daniel Oneil

unread,
Nov 2, 2014, 6:59:36 PM11/2/14
to cesiu...@googlegroups.com
I changed the call to the compute Sun position to:

    var pointInSpace = new Cesium.Cartesian3(1.0,1.0,1.0);
    pointInSpace = Cesium.Simon1994PlanetaryPositions.computeSunPositionInEarthInertialFrame(julianDate, pointInSpace) ;
 
It did not help.

On the Web Console there is an error message:
TypeError: n.NegativePiToPi is not a function                     Cesium.js:388

Daniel Oneil

unread,
Nov 5, 2014, 3:41:59 PM11/5/14
to cesiu...@googlegroups.com
I upgraded to Cesium-1.3 and I'm still getting the n.NegativePiToPi is not a function error at Cesium.js line 388.

Ed Mackey

unread,
Nov 17, 2014, 10:27:38 AM11/17/14
to cesiu...@googlegroups.com
Hi Dan,

Give this a try with the latest copy of Cesium.

            --Ed.

    <script>

        var solarRadiusInMeters = 6.955e8;


        var viewer = new Cesium.Viewer('cesiumContainer');

        viewer.scene.camera.frustum.far = 1e12;            //Move the far wall of the viewing frustum.
        viewer.extend(Cesium.viewerCesiumInspectorMixin);  //Add Cesium Inspector

        var scene = viewer.scene;
        scene.skyBox.show = false;                        // Turn off the sky box
        scene.sun.show = false;                           // Don't show the default Sun

        // Turn on sun lighting of the globe.
        scene.globe.enableLighting = true;

        // Create a Yellow rim-lit material.
        var material = Cesium.Material.fromType(Cesium.Material.RimLightingType);
        material.uniforms.color = Cesium.Color.YELLOW;

        // Create Sun graphics primitive.
        var sunEllipsoid = viewer.scene.primitives.add(new Cesium.EllipsoidPrimitive({
            center: new Cesium.Cartesian3(),  // For now, place the Sun at the origin.
            radii: new Cesium.Cartesian3(solarRadiusInMeters, solarRadiusInMeters, solarRadiusInMeters),
            material: material
        }));

        // Allocate "new" variables outside of the render loop when possible, to reduce garbage collection.
        var sunPosition = new Cesium.Cartesian3();
        var icrfToFixedScratch = new Cesium.Matrix3();

        // Update the camera and the Sun with each animation frame.
        function icrf(scene, time) {
            if (scene.mode !== Cesium.SceneMode.SCENE3D) {
                return;
            }

            var icrfToFixed = Cesium.Transforms.computeIcrfToFixedMatrix(time, icrfToFixedScratch);
            if (Cesium.defined(icrfToFixed)) {
                // Update the camera with the new ICRF rotation
                scene.camera.transform = Cesium.Matrix4.fromRotationTranslation(icrfToFixed);

                // Compute Sun position in Inertial.
                Cesium.Simon1994PlanetaryPositions.computeSunPositionInEarthInertialFrame(time, sunPosition);

                // Transform Sun position from Inertial to Fixed.
                Cesium.Matrix3.multiplyByVector(icrfToFixed, sunPosition, sunPosition);

                // Update the Sun's modelMatrix to move it from the origin to its new position for this animation frame.
                sunEllipsoid.modelMatrix = Cesium.Matrix4.fromRotationTranslation(Cesium.Matrix3.IDENTITY, sunPosition);
            }
        }
        scene.preRender.addEventListener(icrf);

    </script>

Daniel Oneil

unread,
Nov 17, 2014, 4:54:50 PM11/17/14
to cesiu...@googlegroups.com
Ed -

Thanks for the reply. I copied the Javascript into a local copy of Sandcastle running on Cesium 1.3 and received the following error:

An error occurred while rendering. Rendering has stopped.

Ed Mackey

unread,
Nov 17, 2014, 5:10:38 PM11/17/14
to cesiu...@googlegroups.com
Odd, that would mean that "sunPosition" is undefined in the "icrf" function.  Of course I tested this (against master) and didn't see that problem here.  You could try wrapping that last statement inside an "if (Cesium.defined(sunPosition))" check, but I don't understand why such a check would be needed, since we already check the rotation matrix a few lines before.

I submitted a pull request, if anyone else wants to test it:

https://github.com/AnalyticalGraphicsInc/cesium/pull/2288

               --Ed.


Hyper Sonic

unread,
Feb 13, 2015, 7:03:13 AM2/13/15
to cesiu...@googlegroups.com
Over at
If you copy the code between //Sandcastle_Begin and //Sandcastle_End then paste it to

It works! The star-field doesn't show up though, just the Sun and Moon. I like the fact that it is astronomically correct, just like the Moon. You actually have to travel about 150 GigaMeters from the Earth to get to the Sun. By default you can only see 50 MegaMeters, but this code changes the far clip plane. Also the Sun is displayed with it's actual 1.4 GigaMeter diameter (contrast that with Earth's 0.012 GigaMeter diameter!) It could use a texture though, the Moon has one.

Hyper Sonic

unread,
Feb 13, 2015, 7:45:51 AM2/13/15
to cesiu...@googlegroups.com
change
sunEllipsoid.modelMatrix = Cesium.Matrix4.fromRotationTranslation(Cesium.Matrix3.IDENTITY, sunPosition, sunModelMatrixScratch);
to
sunEllipsoid.modelMatrix = Cesium.Matrix4.fromRotationTranslation(Cesium.Matrix3.IDENTITY, {x:1000000000,y:0,z:0}, sunModelMatrixScratch);

To really get a feel of how large the sun is! Instead of 150 GigaMeters away from the Earth the Sun is now a mere 1 GigaMeter away from Earth (center to center that is, since the Sun has about a 0.7 GigaMeter radius its about 300 MegaMeters away from the surface, which is why the Moon is sometimes inside the Sun as it has a 384 MegaMeter orbit.) Cesium can be a useful tool to study the Solar System!

bhawna daryani

unread,
Sep 14, 2017, 12:55:20 PM9/14/17
to cesium-dev
I tried running it on 1.37 sandcastle and I get
An error occurred while rendering. Rendering has stopped.
undefined
TypeError: Cannot set property transform of #<Camera> which has only a getter
TypeError: Cannot set property transform of #<Camera> which has only a getter
at icrf (<anonymous>:34:32)
at Event.raiseEvent (https://cesiumjs.org/Cesium/Source/Core/Event.js:142:30)
at render (https://cesiumjs.org/Cesium/Source/Scene/Scene.js:2623:26)
at Scene.render (https://cesiumjs.org/Cesium/Source/Scene/Scene.js:2702:13)
at CesiumWidget.render (https://cesiumjs.org/Cesium/Source/Widgets/CesiumWidget/CesiumWidget.js:686:25)
at render (https://cesiumjs.org/Cesium/Source/Widgets/CesiumWidget/CesiumWidget.js:71:32)

Gabby Getz

unread,
Sep 15, 2017, 3:21:52 PM9/15/17
to cesium-dev
Hi Bhawna,

Can you provide the code snippet you ran?

Thanks,
Gabby

bhawna daryani

unread,
Sep 15, 2017, 3:44:57 PM9/15/17
to cesium-dev
Hey Gabby,
I ran this on 1.37 sandcastle.
//Sandcastle_Begin
var solarRadiusInMeters = 6.955e8;
var viewer = new Cesium.Viewer('cesiumContainer');
viewer.scene.camera.frustum.far = 1e12; //Move the far wall of the viewing frustum.
var scene = viewer.scene;
scene.skyBox.show = false; // Turn off the sky box
scene.sun.show = false; // Don't show the default Sun
// Turn on sun lighting of the globe.
scene.globe.enableLighting = true;
// Create a Yellow rim-lit material.
var material = Cesium.Material.fromType(Cesium.Material.RimLightingType);
material.uniforms.color = Cesium.Color.YELLOW;
// Create Sun graphics primitive.
var sunEllipsoid = scene.primitives.add(new Cesium.EllipsoidPrimitive({
center: new Cesium.Cartesian3(), // For now, place the Sun at the origin.
radii: new Cesium.Cartesian3(solarRadiusInMeters, solarRadiusInMeters, solarRadiusInMeters),
material: material
}));
// Allocate "new" variables outside of the render loop when possible, to reduce garbage collection.
var sunPosition = new Cesium.Cartesian3();
var icrfToFixedScratch = new Cesium.Matrix3();
var sunModelMatrixScratch = new Cesium.Matrix4();
// Update the camera and the Sun with each animation frame.
function icrf(scene, time) {
if (scene.mode !== Cesium.SceneMode.SCENE3D) {
return;
}
var icrfToFixed = Cesium.Transforms.computeIcrfToFixedMatrix(time, icrfToFixedScratch);
if (Cesium.defined(icrfToFixed)) {
// Update the camera with the new ICRF rotation
scene.camera.transform = Cesium.Matrix4.fromRotationTranslation(icrfToFixed);
// Compute Sun position in Inertial.
Cesium.Simon1994PlanetaryPositions.computeSunPositionInEarthInertialFrame(time, sunPosition);
// Transform Sun position from Inertial to Fixed.
Cesium.Matrix3.multiplyByVector(icrfToFixed, sunPosition, sunPosition);
// Update the Sun's modelMatrix to move it from the origin to its new position for this animation frame.
sunEllipsoid.modelMatrix = Cesium.Matrix4.fromRotationTranslation(Cesium.Matrix3.IDENTITY, sunPosition, sunModelMatrixScratch);
}
}
scene.preRender.addEventListener(icrf);
//Sandcastle_End

Gabby Getz

unread,
Sep 18, 2017, 4:51:49 PM9/18/17
to cesium-dev
The offending line is 

scene.camera.transform = Cesium.Matrix4.fromRotationTranslation(icrfToFixed);

You can't set the camera's transform directly. Take a look at the camera documentation for the methods you can use, particularly lookAtTransform.

Thanks!
Gabby

--
You received this message because you are subscribed to the Google Groups "cesium-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cesium-dev+unsubscribe@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages