摘要：上傳圖片順時針旋轉度問題使用獲取圖片當前拍攝角度修正后展示裁切位置不正確或需要減去的差值問題描述當目標元素的上級元素中有使用時，用如上的方法都會導致計算錯誤，這一在常用框架，類庫中都存在。應該是和在實現上的差異造成了。

bug1.ios 上傳圖片 順時針旋轉90度問題

solution1.使用exif.js獲取圖片當前拍攝角度 修正后展示

http://www.mamicode.com/info-...
http://blog.csdn.net/linlzk/a...

bug2.裁切位置不正確

solution2.offsetLeft或offsetTop需要減去translate的差值

http://tgideas.qq.com/webplat...
問題描述：
當目標元素的上級元素中有使用transform:translate(x,y)時，用如上的方法都會導致offset計算錯誤，這一bug在常用canvas框架EaseJS、QuarkJS，DOM類庫Zepto中都存在。我項目中使用的是QuarkJS，碰到具體問題是舞臺事件坐標不正確，由于是框架中的bug，足足花了半天時間才追查到。

bug3.ios 裁切圖片為空白

參考下面吧

https://www.zhihu.com/questio...
測試后發(fā)現，可能原因是iOS拍攝的圖片尺寸過大后會出現此bug，但與圖像大小無關（導出原圖，jpeg壓縮后，只有幾百KB，還是會有bug；但是質量不變，尺寸調小后可以），將canvas等比繪圖，不調尺寸比例后，iOS上加載圖片是白色，安卓沒問題。iPhone5、5C、5S均有此bug
解決方案（已驗證）：使用ios-imagefile-megapixel ，將大圖拆分為一塊塊的小圖讀取到小canvas再拼起來(還可以設置圖片旋轉)
https://segmentfault.com/q/10...
pad上你應該是拿Safari打開的吧，我電腦上Safari打開也看不到圖片。應該是Safari和Chrome在實現drawImage上的差異造成了。
當使用7個參數的時候，第2，3，4，5參數聯合起來表示對圖像的剪裁區(qū)域。我測試下來的結果是，如果這個區(qū)域超出了圖像原來的大小區(qū)域，則safari下不繪制，而chrome下會將超出的區(qū)域繪制成透明。
你這張圖的原始大小（img,natureWidth, img,naturalHeight）是200*200，而期望繪制的是320-0, 300-0，超出其范圍。設為200，200應該就可以了。
http://stackoverflow.com/ques...

canvas畫布在主流瀏覽器中的尺寸限制
http://www.cnblogs.com/shucho...
在IOS10下，自帶瀏覽器和微信下，超過40964096像素則顯示不了紅色方塊；HUAWEI NXT-TL00手機自帶瀏覽器和UC瀏覽器下，不能超過81928192像素；在PC,CHROME瀏覽器，360瀏覽器，不能超過1638416384像素；搜狗瀏覽器，要比1638416384稍微小一些；firefox,最大數在11164*11164左右；IE11、EDGE瀏覽器，沒找到極限，只不過越大電腦越慢內存消耗嚴重；

bug4.ios圖片的大于2MB時 上傳圖片被壓癟

solution4.重置圖片的比例

https://github.com/CommanderX...
http://blog.csdn.net/linxijun...