Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

实现轮播效果时,如果使用blob方式加载图像,16次后webgl会崩溃 #15

Closed
xmsuperman opened this issue Jun 22, 2023 · 4 comments

Comments

@xmsuperman
Copy link

出现
WARNING: Too many active WebGL contexts. Oldest context will be lost.

然后出现
TypeError: Cannot read properties of null (reading 'createShader')

at createProgram (index.js:1122:1)
at new plot (index.js:1334:1)
at TIFFImageryProvider.eval (index.js:2156:1)
at Generator.next ()
at fulfilled (index.js:22:1)

`let i = 0;
window.setInterval(async () => {

      that.viewer.imageryLayers.remove(baseImagelayer);
      baseProvider.destroy();

      imageBlob = null;
      
      imageBlob = await axios.get('http://localhost/api/file/export/734615026031136768.TIF', {
        responseType: "blob"
      });

      baseProvider = new TIFFImageryProvider({            
        url: imageBlob.data,
        renderOptions: {
          nodata: -999,
          single: {
            colorScale: "jet",
            //colorScaleImage: image,
            domain: [0, 80],
          }
        }, 
        enablePickFeatures: true,
        //resampleMethod: 'bilinear',
      });
      baseImagelayer = new Cesium.ImageryLayer(baseProvider); 
      that.viewer.imageryLayers.add(baseImagelayer);

      i++;
      console.log(i);
    },2000);`
@xmsuperman
Copy link
Author

可以确认内置的plot组件存在内存泄露

@xmsuperman
Copy link
Author

通过修改原码,可以极大的延缓内存溢出的时间,但是经测试300+以后还是会内存溢出。

1327行 将OffscreenCanvas对象全局化,
this.offscreenCanvas = new OffscreenCanvas(512, 512);

1331行 创建create3DContext使用全局化的offscreenCanvas
if (create3DContext(this.offscreenCanvas, { premultipliedAlpha: false }) !== null) {

在destory方法中增加以下代码
if(this.ctx){
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
}

    this.gl = null;
    this.offscreenCanvas = null;
    this.ctx = null;
    
    this.canvas = null;
    this._source = null;

@xmsuperman
Copy link
Author

将TIFFImageryProvider的destory增加
this._workerFarm = null;
this.plot = null;
将WorkerFarm的destory方法增加
this.worker = null;

@xmsuperman
Copy link
Author

元凶找到,按照作者的指导,修改
1331行

if (create3DContext(new OffscreenCanvas(512, 512), { premultipliedAlpha: false }) !== null) {
const gl = create3DContext(this.canvas, { premultipliedAlpha: false });

const gl = create3DContext(this.canvas, { premultipliedAlpha: false });
if (gl!==null) {

彻底解决问题

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants