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

[BUG]: 在使用自定义canvas时,canvas会自己自动变得很大,无法修改 #159

Closed
FliPPeDround opened this issue May 18, 2023 · 4 comments · Fixed by #163
Closed
Labels
bug Something isn't working

Comments

@FliPPeDround
Copy link

Bug描述

在使用自定义canvas时,canvas会自己自动变得很大,无法修改

const canvas = document.getElementById('canvas')
await Engine3D.init({
   canvasConfig: { canvas }
})

Bug复现流程

const canvas = document.getElementById('canvas')

期待的结果

简介明要的阐述你期待发生什么结果

报错截图

如果可以,提供发生错误的截图

测试引擎版本:

本地运行出错的Orillusion引擎版本, e.g. 0.6.1

本机系统 (请填写完整):

  • OS: [win]
  • Browser [edge]
  • Version [113.0.1774.42 (正式版本) (64 位)]

代码示例

https://codepen.io/FliPPeDround/pen/mdzzBBJ

其他信息

添加关于bug的其他描述信息

@FliPPeDround FliPPeDround added the bug Something isn't working label May 18, 2023
@lslzl3000
Copy link
Collaborator

lslzl3000 commented May 18, 2023

Screenshot 2023-05-18 at 13 01 18

我这里测试正常,不加css的话 canvas 是默认大小,没有发现自己变大的情况
如果需要自定义大小,可以通过 css 改变 canvas 大小:

Screenshot 2023-05-18 at 13 02 59

@lslzl3000 lslzl3000 added wait Wait for further info bug Something isn't working and removed bug Something isn't working wait Wait for further info labels May 18, 2023
@FliPPeDround
Copy link
Author

FliPPeDround commented May 18, 2023

动画

我确实遇到了这个问题,在其他电脑上也复现了,我还需要提供什么信息可以帮助排除这个问题

image

@lslzl3000
Copy link
Collaborator

@FliPPeDround 已排查到问题所在,主要是没有手动规范canvas的css大小,在dpr不等于1的屏幕上会导致canvas会根据内容大小resize,从而循环触发resize越来越大。

目前来讲,请手动设置一个 css 来规范canvas style 的 width 和 height,不要使用默认值(即无style width height)
我们后面会优化resize的方案,避免这种情况

@lslzl3000 lslzl3000 linked a pull request May 18, 2023 that will close this issue
@lslzl3000
Copy link
Collaborator

已在 #163 中修复canvas无默认大小的情况,会跟随下个版本发布

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
Status: Done
Development

Successfully merging a pull request may close this issue.

2 participants