Heim >Web-Frontend >H5-Tutorial >Codebeispiel zum Komprimieren von Bildern mithilfe von Canvas
Der Inhalt dieses Artikels befasst sich mit dem Codebeispiel zum Komprimieren von Bildern auf Leinwand. Ich hoffe, dass er für Freunde hilfreich ist.
// 对图片进行压缩 function compress(imgPath) { var image = new Image(); //新建一个img标签(还没嵌入DOM节点) image.src = imgPath; image.onload = function() { var canvas = document.createElement('canvas'); var context = canvas.getContext('2d'); var imageWidth = image.width / 3; //压缩后图片的大小 var imageHeight = image.height / 3; var data = ''; canvas.width = imageWidth; canvas.height = imageHeight; context.drawImage(image, 0, 0, imageWidth, imageHeight); data = canvas.toDataURL('image/jpeg') //压缩完成 $(".srcDiscernImg").attr("src", data); console.log("渲染。。。。"); } }
Dieser Artikel ist hier zu Ende. Weitere spannende Inhalte finden Sie in der Spalte HTML5-Video-Tutorial auf der chinesischen PHP-Website! ! !
Das obige ist der detaillierte Inhalt vonCodebeispiel zum Komprimieren von Bildern mithilfe von Canvas. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!