Location Marker - Options?

CesiumJS
1

I am currently marking a users location with:

var userLocationMarker = new Cesium.CircleGeometry({
        center: ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(longitude, latitude)),
        radius: 25000.0,
        vertexFormat: Cesium.PerInstanceColorAppearance.VERTEX_FORMAT
    });
    var redCircleInstance = new Cesium.GeometryInstance({
        geometry: userLocationMarker,
        attributes: {
            color: Cesium.ColorGeometryInstanceAttribute.fromColor(new Cesium.Color(Math.random() * 2, Math.random() * 2, Math.random() * 2, 1))
        }
    });

As of now, if I zoom in, the userLocationMarker maintains it's size. What I want it to do is shrink as I zoom in.

Is there a more appropriate way to tackle this?

2

I assume you want the circle to stay the same size in screen space? You should be using a Billboard for this, not geometry, which are defined in world space.

3

Hi,

You could recreate the geometry/primitive with a smaller radius during the zoom. To keep it fast, construct CircleGeometry with a granularity of perhaps 3-6 degrees (the property takes radians).

Also consider using a billboard (example), which will maintain constant pixel size so it gets smaller in world space as we zoom in.

Patrick