aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整layout速度慢问题

Browse Source
This commit is contained in:
X1627315083
2024-05-23 13:25:19 +08:00
parent a5cfaeafe5
commit 785bb8b70e
6 changed files with 148 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
src/tool/domTurnImg.js
View File

@@ -1,45 +1,48 @@
import html2canvas from "html2canvas";
const getJpeg = dom =>{
return new Promise(resolve =>{
html2canvas(dom,{useCORS: true,}).then(canvas =>{
let base64 = canvas.toDataURL('image/jpeg',.9);
let quality = 0.9 // 压缩系数0-1之间
let newImage = new Image()
newImage.src = base64
newImage.setAttribute('crossOrigin', 'Anonymous') // url为外域时需要
let imgWidth,
imgHeight
let w = undefined
newImage.onload = function () {
w = this.width * 1
imgWidth = this.width
imgHeight = this.height
let canvas = document.createElement('canvas')
let ctx = canvas.getContext('2d')
if (Math.max(imgWidth, imgHeight) > w) {
if (imgWidth > imgHeight) {
canvas.width = w
canvas.height = w * (imgHeight / imgWidth)
} else {
canvas.height = w
canvas.width = w * (imgWidth / imgHeight)
}
} else {
canvas.width = imgWidth
canvas.height = imgHeight
quality = 0.6
}
ctx.clearRect(0, 0, canvas.width, canvas.height)
ctx.drawImage(this, 0, 0, canvas.width, canvas.height) // // 这里面的 this 指向 newImage
let smallBase64 = canvas.toDataURL('image/jpeg', quality) // 压缩语句
let fileData = dataURLtoFile(smallBase64);
let fileOfBlob = new File([fileData], new Date() + ".jpg"); // 命名图片名
// console.log(smallBase64);
// resolve(base64ToFile(fileOfBlob))
resolve(fileOfBlob)
}
return new Promise(resolve =>{
setTimeout(() => {
html2canvas(dom,{useCORS: true,}).then(canvas =>{
let base64 = canvas.toDataURL('image/jpeg',.9);
// let quality = 0.9 // 压缩系数0-1之间
let newImage = new Image()
newImage.src = base64
newImage.setAttribute('crossOrigin', 'Anonymous') // url为外域时需要
// let imgWidth,
// imgHeight
// let w = undefined
newImage.onload = function () {
// w = this.width * 1
// imgWidth = this.width
// imgHeight = this.height
// let canvas = document.createElement('canvas')
// let ctx = canvas.getContext('2d')
// if (Math.max(imgWidth, imgHeight) > w) {
// if (imgWidth > imgHeight) {
// canvas.width = w
// canvas.height = w * (imgHeight / imgWidth)
// } else {
// canvas.height = w
// canvas.width = w * (imgWidth / imgHeight)
// }
// } else {
// canvas.width = imgWidth
// canvas.height = imgHeight
// quality = 0.6
// }
// ctx.clearRect(0, 0, canvas.width, canvas.height)
// ctx.drawImage(this, 0, 0, canvas.width, canvas.height) // // 这里面的 this 指向 newImage
// let smallBase64 = canvas.toDataURL('image/jpeg', quality) // 压缩语句
let fileData = dataURLtoFile(base64);
let fileOfBlob = new File([fileData], new Date() + ".jpg"); // 命名图片名
// console.log(smallBase64);
// resolve(base64ToFile(fileOfBlob))
resolve(fileOfBlob)
}
})
}, 100);
})
})
}
//base64转成blob
function dataURLtoFile(dataURI, type) {