Comments (13)
问题确认。Chrome浏览器支持的webgl context数量最多为16个,当webgl context数量超过时浏览器会产生警告并导致渲染失败WARNING: Too many active WebGL contexts. Oldest context will be lost
。在你说的情况当中,cesium viewer占用一个webgl context,由于MVTImageryProvider使用mapbox gl js进行渲染,每个MVTImageryProvider会创建一个webgl context,所以第16次重复创建MVTImageryProvider会导致webgl context数量超标。
我考虑在MVTImageryProvider类中添加destroy方法来彻底销毁与当前实例相关的所有资源,包括webgl context.
临时解决这个报错的方法可在MVTImageryProvider添加如下方法,在新建MVTImageryProvider之前销毁上一个不使用的MVTImageryProvider。
destroy() {
// TODO:该方法尚未释放其他资源
this.mapboxRenderer._gl.getExtension('WEBGL_lose_context').loseContext();
}
from mvtimageryprovider.
from mvtimageryprovider.
已在58d6405 修复
from mvtimageryprovider.
首先感谢kikitte大神的仓库!
我在使用大神的代码时也发现了这个问题,解决的方法是在模块中创建一个全局变量作为BasicRenderer渲染模板,避免出现16个canvas上下文的浏览器限制,具体实现代码可以参考一下这里
此外,频繁创建MVTImageryProvider类会产生内存占用过大的问题,跟踪内存发现是BasicRenderer中的瓦片缓存没有被释放,所以我在releaseTile的同时释放了未在使用的瓦片缓存,可以看看这处的代码。
这相对于在移除Imagery对象时手动调用一次destory()方法,似乎要稍微简便一些,也期待大神的进一步完善。
from mvtimageryprovider.
首先感谢kikitte大神的仓库! 我在使用大神的代码时也发现了这个问题,解决的方法是在模块中创建一个全局变量作为BasicRenderer渲染模板,避免出现16个canvas上下文的浏览器限制,具体实现代码可以参考一下这里 此外,频繁创建MVTImageryProvider类会产生内存占用过大的问题,跟踪内存发现是BasicRenderer中的瓦片缓存没有被释放,所以我在releaseTile的同时释放了未在使用的瓦片缓存,可以看看这处的代码。 这相对于在移除Imagery对象时手动调用一次destory()方法,似乎要稍微简便一些,也期待大神的进一步完善。
这种实现方式我考虑的是多个BasicRenderer共用一个canvas可能会造成不可预期的错误,因为我对webgl和mapbox-basic-renderer不熟悉,所以采取保守的方式更为妥当。
这处代码只是放了id为origin的BasicSourceCache对象持有的缓存,具体可看 https://github.com/landtechnologies/Mapbox-vector-tiles-basic-js-renderer/blob/99ba6f3d94eea5dbfed098579f8b8c289854a5a3/src/basic/style.js#L20
如有错误,不吝赐教
from mvtimageryprovider.
首先感谢kikitte大神的仓库! 我在使用大神的代码时也发现了这个问题,解决的方法是在模块中创建一个全局变量作为BasicRenderer渲染模板,避免出现16个canvas上下文的浏览器限制,具体实现代码可以参考一下这里 此外,频繁创建MVTImageryProvider类会产生内存占用过大的问题,跟踪内存发现是BasicRenderer中的瓦片缓存没有被释放,所以我在releaseTile的同时释放了未在使用的瓦片缓存,可以看看这处的代码。 这相对于在移除Imagery对象时手动调用一次destory()方法,似乎要稍微简便一些,也期待大神的进一步完善。
这种实现方式我考虑的是多个BasicRenderer共用一个canvas可能会造成不可预期的错误,因为我对webgl和mapbox-basic-renderer不熟悉,所以采取保守的方式更为妥当。 这处代码只是放了id为origin的BasicSourceCache对象持有的缓存,具体可看 https://github.com/landtechnologies/Mapbox-vector-tiles-basic-js-renderer/blob/99ba6f3d94eea5dbfed098579f8b8c289854a5a3/src/basic/style.js#L20
如有错误,不吝赐教
感谢大神回复!
我对webgl和canvas也不熟悉,但在我最近的工作中使用这个模块进行pbf渲染,它工作得很好,在上百次频繁的渲染中并没有出现问题,所以我认为多个BasicRenderer共用一个canvas这种做法是可行的。
至于释放缓存的代码,确实有问题,我当时测试时创建的图层id叫origin……感谢大佬指出问题!
from mvtimageryprovider.
@qiuuuy @hongfaqiu 您好,请问pbf矢量数据渲染出来后,你是怎么修改这些要素的,比如线条宽度。是不是修改这些样式要再次调用new MVTImageryProvider,传入修改后的style,来重新渲染?
from mvtimageryprovider.
@qiuuuy @hongfaqiu 您好,请问pbf矢量数据渲染出来后,你是怎么修改这些要素的,比如线条宽度。是不是修改这些样式要再次调用new MVTImageryProvider,传入修改后的style,来重新渲染?
是这样的,但是因为瓦片数据已经请求过了,浏览器会有缓存,所以这个重新渲染的过程还是很快的
from mvtimageryprovider.
from mvtimageryprovider.
@hongfaqiu @qiuuuy 还有两个问题再请教下您
1、pickFeatures这个方法你有用过吗,我在这个上面有描述
2、style.json中配置了两个图层,json如下:
我现在想实现的是,通过鼠标点击来获取被点击的图层,这该怎么确定,我点了那个图层呢?
上面这个json最终渲染的结果如下图:
灰色为"2022县矢量_0802152028"这个图层,红色的为“水体面积_10003”图层,我是想通过点击红色区域拿到这个这个区域的信息
from mvtimageryprovider.
@hongfaqiu @qiuuuy 还有两个问题再请教下您 1、pickFeatures这个方法你有用过吗,我在这个上面有描述 2、style.json中配置了两个图层,json如下:
我现在想实现的是,通过鼠标点击来获取被点击的图层,这该怎么确定,我点了那个图层呢? 上面这个json最终渲染的结果如下图:
灰色为"2022县矢量_0802152028"这个图层,红色的为“水体面积_10003”图层,我是想通过点击红色区域拿到这个这个区域的信息
看看构造MVTImageryProvider时有没有传入enablePickFeatures: true?
from mvtimageryprovider.
@hongfaqiu @qiuuuy 还有两个问题再请教下您 1、pickFeatures这个方法你有用过吗,我在这个上面有描述 2、style.json中配置了两个图层,json如下:
我现在想实现的是,通过鼠标点击来获取被点击的图层,这该怎么确定,我点了那个图层呢? 上面这个json最终渲染的结果如下图:
灰色为"2022县矢量_0802152028"这个图层,红色的为“水体面积_10003”图层,我是想通过点击红色区域拿到这个这个区域的信息
看看构造MVTImageryProvider时有没有传入enablePickFeatures: true?
有传入,并且鼠标点击图层时,也有聚焦的效果。
from mvtimageryprovider.
@wh1246935943 我在你开的issue里面回复了
from mvtimageryprovider.
Related Issues (20)
- mvtimageryprovider怎么添加请求头 HOT 2
- can it provide fill-extrusion style? HOT 1
- 不能正确加载geoserver发布的矢量瓦片 HOT 3
- 标注时不能渲染中文字符 HOT 3
- 新版样式支持问题 HOT 1
- vite 加 vite-plugin-cesium里面引入使用会报错 HOT 6
- 加载mapbox style报错 HOT 6
- 请问如何支持4490和4326 HOT 1
- Cannot read properties of undefined reading '_requestTransformFn HOT 12
- 放大图层层级,部分矢量数据加载不出来 HOT 1
- BasicRenderer刷新问题 HOT 1
- mapbox更改maplibre HOT 1
- MVTImageryProvider.fromUrl或者new MVTImageryProvider加载远程的json后报错 HOT 1
- 作者您好,我们项目中使用了您的库,但是我有几个疑问,向您请教,期待回复。 HOT 1
- 我尝试通过pickFeatures方法获取矢量元素信息,但是该方法返回的Promise状态总是rejected,我找不到问题的所在,求助。 HOT 4
- 请问 地图放大 报这个bug什么问题呢??? HOT 2
- 矢量瓦片中的图层显示顺序有点问题 HOT 5
- 无法加载显示中文标注,英文的标注显示正常 HOT 1
- 加载 点的pbf 时 type能否支持 symbol 以及 layers: "icon-image" 需要自定义图片时 我改怎么定义 因为没办法用map.addimage HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from mvtimageryprovider.