DataV是阿里的可视化大屏插件,但是使用过程中发现,在小屏下的自适应效果差。这里提供一种解决方案,找到node_modules\@jiaminghi\dataview\lib\components\fullScreenContainer\src\main.vue,修改initConfig里面的方法
initConfig () {
const { dom } = this
const { width, height } = screen
this.allWidth = width
dom.style.width = `${width}px`
dom.style.height = `${height}px`
}
修改为
initConfig () {
const { dom } = this
const { width, height } = screen
var fixWidth = 1920;
var fixHeight = fixWidth * height / width;
this.allWidth = fixWidth
dom.style.width = `${fixWidth}px`
dom.style.height = `${fixHeight}px`
}