Globe Aliasing (different behavior between sandcastle and the local application)

CesiumJS
1

Hi everyone,
I created a basic Cesium project by integrating with a React application.
As you can see in the image I have an aliasing problem (right Image) on the edges of the globe.
The problem becomes more evident with 3d objects.
During the panning of the 2d map (high zoom) there is a kind of vibration inside the tiles

With the sandcastle default example this behavior does not occur (left Image)
The Cesium version used is the same

My code for creating the viewer is

const Gis: React.FC = () => {
  const [isMapLoaded, setMapLoaded] = useState<boolean>(false);
  const [map, setMap] = useState<Viewer>();

  useEffect(() => {
    if (!isMapLoaded) {
      const map = new cesium.Viewer("map", {
        terrainProvider: cesium.createWorldTerrain(),
      });
      
      setMap(map);
      setMapLoaded(true);
    }
  }, []);

  return (
    <div id="map">
    </div>
  );
};

Am I doing something wrong in initializing cesium?
Is there any attribute that allows you to enable anti-aliasing?

Thanks

Cesium
Cesium1543×653 237 KB

2

In the end i found the solution :

const Gis: React.FC = () => {
  const [isMapLoaded, setMapLoaded] = useState<boolean>(false);
  const [map, setMap] = useState<Viewer>();

  useEffect(() => {
    if (!isMapLoaded) {
      const map = new cesium.Viewer("map", {
        terrainProvider: cesium.createWorldTerrain(),
      });
      
      map.resolutionScale = window.devicePixelRatio
      setMap(map);
      setMapLoaded(true);
    }
  }, []);

  return (
    <div id="map">
    </div>
  );

resolutionScale :

Gets or sets a scaling factor for rendering resolution. Values less than 1.0 can improve performance on less powerful devices while values greater than 1.0 will render at a higher resolution and then scale down, resulting in improved visual fidelity. For example, if the widget is laid out at a size of 640x480, setting this value to 0.5 will cause the scene to be rendered at 320x240 and then scaled up while setting it to 2.0 will cause the scene to be rendered at 1280x960 and then scaled down.

Default Value: 1.0

For some reason the default resolution scale on my application was not 1

Setting to 1 the problem disappears

1 Like