0

necesito mostrar una grafica que hice con chartjs en pdf para que se piueda imprimir, alguien puede darme una idea de como hacerlo con javascript? estoy intentándolo con jspdf.js

 <canvas id="myChart"></canvas>
<h6>Descargar pdf</h6>

<script>
        var ctx = document.getElementById('myChart').getContext('2d');
        var chart = new Chart(ctx, {
            // The type of chart we want to create
            type: 'line',

            // The data for our dataset
            data: {
                labels: [1, 2, 3, 4, 5, 6,7],
                datasets: [{
                    label: 'My First dataset',
                    backgroundColor: 'rgb(255, 99, 132)',
                    borderColor: 'rgb(255, 99, 132)',
                    data: [0, 10, 5, 2, 20, 30, 45]
                }]
            },

            // Configuration options go here
            options: {}
        });

</script>
3
  • tal vez esto te pueda servir stackoverflow.com/questions/43140467/… Commented el 2 ago. 2020 a las 23:47
  • saludos aquí te dejo un enlace bastante detallado de la forma en que lo logré utilizando chartJS, javascript y Mpdf. ojalá te sirva introducir la descripción del enlace aquí
    – RodCas
    Commented el 15 oct. 2020 a las 6:52
  • No veo que chartjs te retorne un svg, si lo hiciera pues podrias exportar el svg a un PDF pero en la documentacion veo que puedes usar .toBase64Image() que te da un blob en png la cual tambien podrias pasar a jspdf Commented el 15 oct. 2020 a las 9:04

1 respuesta 1

2

No creo que se pueda hacer eso directamente con la librería de Chartjs, la opción más sencilla que puedes hacer es crear una página en blanco que solo contenga dicha gráfica y luego usar la función de imprimir página a PDF que traen todos los navegadores por defecto. Otra opción que encontré por intenet fue usar CSS para limitar que partes de la página quieres imprimir a solo tu gráfica.

Encontré también un script en CodePen, de una pregunta, que imprime una página con graficas de Chartjs.

Mira aquí un ejemplo de otra pregunta que se realizó usando jsPDF y Google Chart.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.