-
Notifications
You must be signed in to change notification settings - Fork 503
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
Browser swtich tab renderer.CanvasRenderer animation is blank #592
Comments
webgl 有context lost事件,不知道canvas2d有没有? |
@wsw0108 我刚才看了一下官方的插件的例子也是有这个问题的 调整一下 pitch 试试就可以发现问题了 |
感谢提出issue,你太给力了,哈哈。 这个问题和你的逻辑没关系,是chrome的bug:chrome上webgl canvas离屏绘制时,切换tab后会自动变空白导致的。 TileLayer在pitch为0时,是用canvas来绘制的,pitch > 0时,会自动切换为webgl模式,所以pitch > 0时会出现该问题。 这个问题有两个解决方案:
你的意见如何? PS: 具体可以参考示例中的动画图层示例: |
我不用needToRedraw 是因为我的动画中还要动态生成时间戳,不好用原生的动画函数来处理,不过我会考虑怎样结合的,给 chrome团对提issue那就算了,英语太烂了,我都不好意思说我的英语水平 我会经常来提问的奥;我正在测试maptalks的成熟度哎 |
收到,我晚点整理一份最小重现代码,去chrome提交一下issue,然后反馈在这里。 最后欢迎常来,一起把maptalks做的更好 ^__^ |
该问题已解决 |
@fuzhenn 棒棒哒 ,收到了 |
maptalks's version and what browser you use?
Issue description
我基于 maptalks.Layer 扩展一个 Layer ,其Renderer 是renderer.CanvasRenderer,
在上面我利用 canvas 2d 画布进行 图形绘制 绘制完成执行 this.completeRender(),是没有问题的,
例如:
当我在Layer 上进行动画(我没有用renderer.CanvasRenderer提供的动画接口),自己在Layer中自定义了一个动画周期函数,然后 获取到getRenderer(),利用renderer.CanvasRenderer 的canvas对象 然后调用
周期性的在context 进行的绘制和擦除,其大概代码为:
var context=this._canvas.getContext("2d");
context.save();
context.globalCompositeOperation = 'destination-out';
context.fillStyle = 'rgba(0, 0, 0, .1)';
context.fillRect(0, 0, context.canvas.width, context.canvas.height);
context.restore();
// renderer.clearCanvas();
renderer.completeRender();
每次周期循环内进行 renderer.completeRender() 提交;也是没有问题,但是当我切换浏览器标签,在切换到当前页面,页面中底图一片空白;
例如
(来回切换浏览器标签试试就会发现问题)
不知切换 浏览器标签时触发了是么事件,还是怎么的,
我怀疑是是自己在 画布上填充了颜色导致底图被覆盖,但是不切换浏览器标签就没有这个问题;切换回来对地图执行任何操作底图就会出来了;还是我自定义的Layer图层对底图的TileLayer 有冲突呢?
我的动画图层和静态图层两个图层叠加在一起的,比如道路动画,一个绘制静态的道路,一个是点的图层,点的图层是动态的利用周期性函数进行绘制的,沿路绘制的
根据我的测试发现,如果 map 的pitch=0没有这个问题,当pitch>0,会出现该问题,而且是TIleLayer加载完成后才出现该问题,如果tileLaye正在加载的过程中不会出现该问题
more examples:
如果有必要我会将所有代码托管出来
Please provide a reproduction URL (on any jsfiddle like site)
The text was updated successfully, but these errors were encountered: