S2
S2 copied to clipboard
🐛交叉表父元素设置了tranfrom:scale() ,字体模糊
🏷 Version
| Package | Version |
|---|---|
| @antv/s2 | 1.47.1 |
| @antv/s2-react | |
| @antv/s2-vue |
Sheet Type
- [x] PivotSheet
- [ ] TableSheet
- [ ] GridAnalysisSheet
- [ ] StrategySheet
- [ ] EditableSheet
🖋 Description
交叉表父元素设置tranfrom:scale(0.8) ,字体模糊,缩放越小越模糊,相当于div 里面的字体,交叉表的字体显得更模糊
⌨️ Code Snapshots
官网案例,随便一个父元素上加了缩放 .antv-s2-container{ transform: scale(0.9); transform-origin: left top; }
🔗 Reproduce Link
官网案例 https://s2.antv.antgroup.com/examples/case/comparison/#measure-comparison
🤔 Steps to Reproduce
交叉表父元素加了transform:scale()
😊 Expected Behavior
字体正常呈现,
😅 Current Behavior
字体模糊
💻 System information
| Environment | Info |
|---|---|
| System | window 10 |
| Browser | chrome: 114.0.5735.199 |
可尝试使用高 DPR 去渲染 Canvas
const s2Options = {
devicePixelRatio: 2
}
devicePixelRatio这个属性 我们尝试过,不管怎么设置值,还是存在模糊的状况
在我的mac上不糊,但是同事在1080p显示器就会糊,开了dpr之后不同浏览器糊的还不一样