I want to draw a diffuse circle, but the circle is rotated at some position on the earth. What's the reason?

I want to draw a diffuse circle, but the circle is rotated at some position on the earth. What’s the reason?
image

When the longitude of the coordinates of the ellipse approaches 180, the semiminoraxis attribute of the ellipse will be flipped and jittered when it is dynamically changed?
This is my code

const viewer = new Cesium.Viewer("cesiumContainer");
const image = './circle.png';

const options = {
      maxradius: 500000,
      minradius: 500,
      speed: 100,
      position: Cesium.Cartesian3.fromDegrees(179.38038414341867,-48.39592928270119,564559.6260739185),
      height: 564559.6260739185,
      text: 'alarm'
    };

const step = (options.maxradius - options.minradius) / options.speed;
const getRadius = () => {
      options.minradius += step;
      if (options.minradius > options.maxradius) {
        options.minradius = 500;
      }
      return options.minradius;
    };

const getOpacity = () => {

      const alpha = 1 - options.minradius / options.maxradius;

      return Cesium.Color.WHITE.withAlpha(alpha);
    };

    const radius = new Cesium.CallbackProperty(getRadius, false);

    const color = new Cesium.CallbackProperty(getOpacity, false);

const circle = viewer.entities.add({
      position: options.position,
      name: 'Dycircle',
      label: {
        text: options.text,
        font: '15px Helvetica',
        fillColor: Cesium.Color.LIME
      },
      ellipse: {
        height: options.height,
        semiMinorAxis: radius,
        semiMajorAxis:500000,
        material: new Cesium.ImageMaterialProperty({
          image: image,
          repeat: new Cesium.Cartesian2(1.0, 1.0),
          transparent: true,
          color: color
        }),
        outlineColor: Cesium.Color.RED
      }
    });
viewer.flyTo(circle);

Hi @zhanglin,

looking at this Cesium Sandcastle with altered code, it looks like the problem is the image/material, not the ellipse itself. Maybe you can use some “normal” material and bypass the error.

Maybe some @staff could provide more info on this.

Best, Lennart

Hi @lennart.imberg
I tried to share cesium sandcastle, but the shared link is very long and it has exceeded the maximum.
This is the material map used in my sample code


Such longitude and latitude [117,39] will not have the above problem

Hi @zhanglin,

thank you for providing your image. This Sandcastle shows, that it is indeed a problem of image materials. The ellipse (shown by green outline) is correct, the standard material (Cesium.Color.RED) is correct, but the error occurs (just swap the commenting) once you use a image as material.

I think it’s related to coordinates (sudden change from +180 to -180), but I’m not sure and I can’t provide a solution to this, other than just using a “standard material”.

But maybe there is someone of the cesium community, who can help here.

Best, Lennart

Thank you very much for your reply :smiling_face: