Сохранение диаграмм Морриса для изображения с использованием HTML2CANVAS

Question

У меня есть div, в котором у меня есть диаграммы morris и Flot. Я сохраняю div в Image, используя html2canvas, который сохраняет только графики флота, а пространство диаграмм morris остается пустым на изображении. Javascript код -

$('#DIV1').html2canvas({ 
      onrendered: function (canvas) { 
       $('#img_val').val(canvas.toDataURL("image/png"));      
      } 
     });  

Пожалуйста, предложите, как я могу сохранить диаграммы Моррисом в тот же образ .. Заранее спасибо

Answer 1

ФЛОТ графики рисуются с помощью холста, следовательно, могут быть преобразованы в изображения с помощью html2canvas. Моррис графики рисуются с использованием SVG и не canvas.One из способов, с помощью которого вы можете экспортировать Моррис диаграмму, является первым конвертировать SVG холст, используя один из ниже,

https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas

http://fabricjs.com/

А потом экспортируйте преобразованный холст в изображение с помощью html2canvas.