摘要:比較適合剛拍的內存較大的照片,但存在一個問題,部分傳到后臺的圖片會出現的旋轉此問題只存在于直接拍攝的照片中,任何添加濾鏡和處理過的圖片都不存在將文件轉為綁定文件的事件,獲取到文件對象調用方法默認按比例壓縮默認圖片質量為生成創建屬性節點值越小
比較適合剛拍的內存較大的照片,但存在一個問題,部分傳到后臺的圖片會出現90deg的旋轉
此問題只存在于IOS直接拍攝的照片中,任何添加濾鏡和處理過的圖片都不存在
將文件轉為base64,綁定文件的change事件,獲取到文件對象
var fileObjArr = e.target.files; var windowURL = window.URL || window.webkitURL; var dataURL = windowURL.createObjectURL(fileObjArr[0]);
//調用方法
dealImage(beforebase64,function(afterbase64) {
})
function dealImage(path, callback) { var img = new Image(); img.src = path; img.onload = function() { //默認按比例壓縮 var w = this.width, h = this.height; var quality = 0.4; // 默認圖片質量為0.7 //生成canvas var canvas = document.createElement("canvas"); var ctx = canvas.getContext("2d"); // 創建屬性節點 canvas.setAttribute("width", w); canvas.setAttribute("height", h); ctx.drawImage(this, 0, 0, w, h); // ctx.rotate(90 * Math.PI / 180); // quality值越小,所繪制出的圖像越模糊 var base64 = canvas.toDataURL("image/jpeg", quality); // 回調函數返回base64的值 callback(base64); }; };
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/90731.html
摘要:最近在學做動畫,于是就寫個轉盤練下手。設置中獎區間為度設置固定角度會讓動畫有點難看停止循環中獎操作記錄轉過的角度繪制圖形最后現在這個轉盤比較大的問題就是,如果中獎區間比較小,那減速后轉動的時間就長一些,最低速度轉很久才停下。 最近在學canvas做動畫,于是就寫個轉盤練下手。上個簡陋的成果圖(中間那個是轉的指針,外面的圈是圖片,懶得寫了哈哈哈)showImg(https://segme...
摘要:最近在學做動畫,于是就寫個轉盤練下手。設置中獎區間為度設置固定角度會讓動畫有點難看停止循環中獎操作記錄轉過的角度繪制圖形最后現在這個轉盤比較大的問題就是,如果中獎區間比較小,那減速后轉動的時間就長一些,最低速度轉很久才停下。 最近在學canvas做動畫,于是就寫個轉盤練下手。上個簡陋的成果圖(中間那個是轉的指針,外面的圈是圖片,懶得寫了哈哈哈)showImg(https://segme...
摘要:最近在學做動畫,于是就寫個轉盤練下手。設置中獎區間為度設置固定角度會讓動畫有點難看停止循環中獎操作記錄轉過的角度繪制圖形最后現在這個轉盤比較大的問題就是,如果中獎區間比較小,那減速后轉動的時間就長一些,最低速度轉很久才停下。 最近在學canvas做動畫,于是就寫個轉盤練下手。上個簡陋的成果圖(中間那個是轉的指針,外面的圈是圖片,懶得寫了哈哈哈)showImg(https://segme...
摘要:原文匠心打造簽名組件導讀月又是項目吃緊的時候,一大波需求襲來,猝不及防??梢韵却吝@里體驗把后面將要提到的簽名組件。剩下的也是綁定事件中關鍵的一步。設置完成了上述功能,一個簽名插件就已經成型了。 本文首發于CSDN網站,下面的版本又經過進一步的修訂。原文:匠心打造canvas簽名組件 導讀 6月又是項目吃緊的時候,一大波需求襲來,猝不及防。 度過了漫長而煎熬的6月,是時候總結一波。最近移...
閱讀 1780·2021-11-25 09:43
閱讀 15411·2021-09-22 15:11
閱讀 2630·2019-08-30 13:19
閱讀 2015·2019-08-30 12:54
閱讀 1820·2019-08-29 13:06
閱讀 927·2019-08-26 14:07
閱讀 1619·2019-08-26 10:47
閱讀 3036·2019-08-26 10:41