Предисловие: Я недавно сделал мобильный элемент с картинками с синтетическим плакатом Canvas. .
1. Проблема с полной экраном мобильного холстаОписание задачи: Поскольку ширина и высота Canvas могут устанавливать только значения PX и не поддерживают единицы REM, трудно достичь эффекта холста, покрытого полными экранами, когда разрешение экрана мобильного устройства сложно. Решение: Получите значение Wharewidth Ecrews of Screen Mobile Phone через JS и дайте его на Canvas, чтобы достичь эффекта адаптации полноэкранного экрана;
Var clientwidth = document.documentelement.clientwidth; px ');2. Картина синтеза холста кажется размытым явлением
Описание задачи: Существует неопределенная проблема с изображениями, сгенерированными Canvas, особенно если на картинке есть QR -коды, которые необходимо распознать, пользователи не могут его распознать;
Решение: 1) вы можете процитировать плагин Hidpi-Canvas.js для решения этой проблемы;
2) Вы также можете установить значения ширины и высоты в стиле холста, чтобы установить желаемый размер, а затем увеличить значение ширины и высоты холста соответственно.
3. Когда синтетические картинки синтетические, некоторые модельные картинки хаотичныОписание задачи: когда некоторые телефоны Android экспортируют картину Base64 Canvas, они могут отображать только половину изображения эффекта.
Решение: Получите соотношение пикселей оборудования, оцените модель. Оригинальный размер.
// Hidpi-Canvas увеличивает ширину и высоту холста.4. Проблема ротации мобильного телефона iPhone Загрузить изображение
Описание задачи: Во время теста было обнаружено, что мобильный телефон iPhone загружал фотографии вращения, а изображение, загруженное из Интернета, не произойдет, а Android нормальный.
Решение: эта проблема может быть решена с помощью exif.js Plug -in -in.
var file = $ (this) [0] .files [0]; ) ;;5. Canvas рисует картинки Cross -domain и не может экспортировать картинки Base64
Описание задачи: Когда есть изображения запросов Cross -domain в холсте, изображение вывода 64 не работает.
Решение: эта ошибка должна быть решена с помощью обратного и обратного.
Var pageqrcodeimg = qrcodecanvas.todaurl ('image/jpg'); 6. Белый экран появится при рисовании изображений холстаОписание проблемы: Ситуация с белым экраном иногда появляется, когда холст рисует изображение.
Решение: добавьте функцию Onload в IMG, а затем выполните операцию чертежа после прочтения изображения.
qrcodeimg.onload = function () {// рисовать изображение} 7, браузер WeChat, долго нажмите на картинку, не может быть сохраненОписание задачи: изображение, сгенерированное Canvas
Решение: сжатие качества изображения при экспорте изображения Base64.
var mycanvas = document.getElementbyId (main);
PostScript: текущие проблемы, которые возникают в основном.
Выше всего содержимое этой статьи.