Javascript HTML画布在其他pc上的chrome上大小调整不当

因此，为了启动这两台电脑，我都使用了chrome，我的代码在我的电脑上正常工作，分辨率为1920 x 1080，如图所示，所有的条都在底部

现在，如果我使用开发者模式（f12），我可以手动输入笔记本电脑的屏幕分辨率，它也可以正常缩放

但是，如果我使用笔记本电脑1366x768，它只会在屏幕的左右两侧绘制条形图，如图所示

这是我的密码

window.onload=function（）{
var input=document.getElementById（“文件”）；
var audio=document.getElementById（“音频”）；
var selectLabel=document.querySelector（“label[for=select]”）；
var audioLabel=document.querySelector（“label[for=audio]”）；
var select=document.querySelector（“select”）；
var context=void 0，
src=void 0，
res=[]，
url=“”；
函数processDirectoryUpload（事件）{
var webkitResult=[]；
var mozResult=[]；
var文件；
console.log（事件）；
select.innerHTML=“”；
//你喜欢mozilla吗
函数目录（条目、路径）{
log（“dir”、条目、路径）；
return[].reduce.call（条目，函数（承诺，条目）{
return promise.then（函数（）{
返回Promise.resolve（entry.getfilesandtirectories（）| | entry）
.then（功能（目录）{
返回目录
})
})
}，Promise.resolve（））
.然后（功能（项目）{
var dir=items.filter（函数（文件夹）{
返回目录的文件夹实例
});
var files=items.filter（函数（文件）{
返回文件实例
});
if（files.length）{
//log（“文件：”，文件，路径）；
mozResult=mozResult.concat.apply（mozResult，文件）；
}
if（直达长度）{
//log（dir，dir[0]instanceof Directory）；
返回MozReadDirectory（dir，dir[0].path | | path）；
}否则{
如果（！目录长度）{
返回Promise.resolve（mozResult）.then（函数（complete）{
返回完成
})
}
}
})
};
功能手柄入口（入口）{
让file=“webkitGetAsEntry”进入entry？entry.webkitGetAsEntry（）：entry
返回承诺。解决（文件）；
}
函数句柄文件（条目）{
返回新承诺（函数（解析）{
if（entry.isFile）{
entry.file（函数（文件）{
listFile（文件，entry.fullPath）。然后（解析）
})
}else if（entry.isDirectory）{
var reader=entry.createReader（）；
reader.readEntries（webkitReadDirectories.bind（null、entry、handleFile、resolve））
}否则{
var条目=[entry]；
返回条目.reduce（函数（承诺，文件）{
return promise.then（函数（）{
返回列表目录（文件）
})
}，Promise.resolve（））
.然后（函数（）{
返回Promise.all（entries.map）（函数（文件）{
返回列表文件（文件）
})).然后（解决）
})
}
})
函数WebKitReadDirectory（条目、回调、解析、条目）{
控制台日志（条目）；
返回listDirectory（条目）。然后返回函数（currentDirectory）{
log（`iterating${currentDirectory.name}目录'，条目）；
返回条目.reduce（函数（承诺，目录）{
return promise.then（函数（）{
返回回调（目录）
});
}，Promise.resolve（））
}).然后（决定）；
}
}
函数列表目录（条目）{
控制台日志（条目）；
返回承诺。解决（条目）；
}
函数列表文件（文件，路径）{
path=path | | file.webkitRelativePath | |“/”+file.name；
log（`reading${file.name}，size:${file.size}，path:${path}`）；
webkitreult.push（文件）；
返回承诺。解决（webkitResult）
};
函数processFiles（文件）{
Promise.all（[].map.call）文件、函数（文件、索引）{
返回handleEntries（文件、索引）。然后返回（handleFile）
}))
.然后（函数（）{
console.log（“完成”，webkitResult）；
res=结果；
res.reduce（功能（承诺、跟踪）{
return promise.then（函数（）{
返回播放音乐（曲目）
})
}，显示文件（res））
})
.catch（函数（err）{
警报（错误消息）；
})
}
if（event.target中的“GetFilesandDirectory”）{
return（event.type==“drop”？event.dataTransfer:event.target）.getFilesAndDirectories（）
.then（功能（目录）{
if（dir[0]instanceof Directory）{
console.log（dir）
返回MozReadDirectory（目录，目录[0]。路径| |路径）
.然后（功能（完成）{
日志（“完成：”，webkitResult）；
event.target.value=null；
});
}否则{
if（dir[0]instanceof File&&dir[0].size>0）{
返回承诺。解决（dir）
.然后（函数（）{
console.log（“完成：”，mozResult）；
res=结果；
res.reduce（功能（承诺、跟踪）{
return promise.then（函数（）{
返回播放音乐（曲目）
})
}，显示文件（res））
})
}否则{
if（dir[0]。size==0）{
抛出新错误（“无法处理””+dir[0]。名称+“”
    var sizeX = 0;
    var sizeY = 0;
    if (typeof (window.innerWidth) == 'number') { //Non-IE
        sizeX = window.innerWidth;
        sizeY = window.innerHeight;
    } else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) { //IE 6+ in 'standards compliant mode'
        sizeX = document.documentElement.clientWidth;
        sizeY = document.documentElement.clientHeight;
    } else if (document.body && (document.body.clientWidth || document.body.clientHeight)) { //IE 4 compatible
        sizeX = document.body.clientWidth;
        sizeY = document.body.clientHeight;
    }