base 64 png string to base 64 jpg с помощью java или javascript

Question

Я работаю над проектом, разработанным в Android с помощью PhoneGap, нам нужно нарисовать элементы на экране и превратить эти данные в pdf.

Для рисования мы используем элемент холста html5.

Для написания pdf мы используем библиотеку «jsPdf».

Проблема заключается в том, что на Android метод canvas.toDataUrl ('image/jpeg') всегда возвращает строку типа «image/png», но библиотека jsPdf только считывает изображения в формате Base64-jpg.

Я думал, что из двух решений:

1) использовать какой-то «JavaScript кодер», который я нашел в Интернете, но я не мог найти активную ссылку, чтобы превратить холст в Base64-формате JPG формат.

2) создать плагин, который «переводит» base64-png-строку в base64-jpg-формат.

Итак, есть ли способ в javascript или java, чтобы сделать этот «перевод»? Или кто-нибудь знает другой способ понять, что я объяснил?

Answer 1

Может быть, это поможет вам,

Getting binary (base64) data from HTML5 Canvas (readAsBinaryString)

его указания, что

«Метод toDataURL потерпит неудачу, если браузер думает, что вы нарисовали на холсте любые данные, которые были загружены из разного происхождения, поэтому этот подход будет работать, только если ваши файлы изображений загружаются с того же сервера, что и страница HTML, сценарий которой выполняет эту операцию ».

также относятся этот

http://www.nihilogic.dk/labs/canvas2image/

Answer 2

попробовать это один:

http://web.archive.org/web/20120830003356/http://www.bytestrom.eu/blog/2009/1120a_jpeg_encoder_for_javascript

после загрузки JPEGEncoder затем вставить этот код:

var encoder = new JPEGEncoder(); 
var imageData = encoder.encode(canvas.getContext('2d').getImageData(0, 0, canvas.width, canvas.height), 100); 

или

попробовать это, если у вас есть проблемы с цветом Справочный:

http://www.mikechambers.com/blog/2011/01/31/setting-the-background-color-when-generating-images-from-canvas-todataurl/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+MikeChambers+%28Mike+Chambers%29

function canvasToImage(canvas, backgroundColor) 
{ 
    //cache height and width   
    var w = canvas.width; 
    var h = canvas.height; 
    var context = canvas.getContext('2d'); 
    var data;  

    if(backgroundColor) 
    { 
     //get the current ImageData for the canvas. 
     data = context.getImageData(0, 0, w, h); 

     //store the current globalCompositeOperation 
     var compositeOperation = context.globalCompositeOperation; 

     //set to draw behind current content 
     context.globalCompositeOperation = "destination-over"; 

     //set background color 
     context.fillStyle = backgroundColor; 

     //draw background/rect on entire canvas 
     context.fillRect(0,0,w,h); 
    } 

    //get the image data from the canvas 
    var imageData = canvas.toDataURL("image/png"); 

    if(backgroundColor) 
    { 
     //clear the canvas 
     context.clearRect (0,0,w,h); 

     //restore it with original/cached ImageData 
     context.putImageData(data, 0,0);   

     //reset the globalCompositeOperation to what it was 
     context.globalCompositeOperation = compositeOperation; 
    } 

    //return the Base64 encoded data url string 
    return imageData; 
} 

• параметр BackgroundColor: 'rgba(255,255,255,0.5)'