Grid lines with material issue

Hey,
Im having some issues with adding grid lines over the map, here is my code:

const layer = this.viewer.imageryLayers.addImageryProvider(new Cesium.GridImageryProvider({
        color: Cesium.Color.WHITE,
        backgroundColor:Cesium.Color.TRANSPARENT
      }));
      layer.show = Cesium.defaultValue(true, true);

I attached three pictures:

  1. When I’m zoomed in, everything seems alright.
  2. When I zoom out a bit, you can see the white background (map not taking the full screen).
  3. When I zoom more out the map becomes all white.

Can anyone help me with a solution ?

Thanks.