Comment exporter google chart en pdf?

Question

J'ai dessin google chart. Maintenant, je veux mettre le bouton pour enregistrer le graphique au format pdf. Je regarde d'ici Save google charts as pdf et d'autres questions disponibles dans la pile mais cela ne fonctionne pas.

Imprimer png image par google chart déjà utilisé mais il suffit d'ouvrir un nouvel onglet avec l'image png mais il n'ouvre pas la fenêtre de sauvegarde en tant que pdf pour l'utilisateur.

Est-ce que quelqu'un sait comment le faire?

Answer 1

vous pouvez utiliser jsPDF pour créer une méthode d'utilisation PDF

addImage pour ajouter une image de uri du graphique au format pdf

voir ci-dessous extrait de travail ...

google.charts.load('current', { 
 
    packages: ['controls', 'corechart', 'table'] 
 
}).then(function() { 
 
    var data = new google.visualization.DataTable(); 
 
    data.addColumn('number', 'X'); 
 
    data.addColumn('number', 'y0'); 
 
    data.addRows([ 
 
    [0, 0], [1, 10], [2, 23], [3, 17], [4, 18], [5, 9], 
 
    [6, 11], [7, 27], [8, 33], [9, 40], [10, 32], [11, 35], 
 
    [12, 30], [13, 40], [14, 42], [15, 47], [16, 44], [17, 48], 
 
    [18, 52], [19, 54], [20, 42], [21, 55], [22, 56], [23, 57], 
 
    [24, 60], [25, 50], [26, 52], [27, 51], [28, 49], [29, 53], 
 
    [30, 55], [31, 60], [32, 61], [33, 59], [34, 62], [35, 65], 
 
    [36, 62], [37, 58], [38, 55], [39, 61], [40, 64], [41, 65], 
 
    [42, 63], [43, 66], [44, 67], [45, 69], [46, 69], [47, 70], 
 
    [48, 72], [49, 68], [50, 66], [51, 65], [52, 67], [53, 70], 
 
    [54, 71], [55, 72], [56, 73], [57, 75], [58, 70], [59, 68], 
 
    [60, 64], [61, 60], [62, 65], [63, 67], [64, 68], [65, 69], 
 
    [66, 70], [67, 72], [68, 75], [69, 80] 
 
    ]); 
 

 
    var container = document.getElementById('chart_div'); 
 
    var chart = new google.visualization.LineChart(container); 
 
    var btnSave = document.getElementById('save-pdf'); 
 

 
    google.visualization.events.addListener(chart, 'ready', function() { 
 
    btnSave.disabled = false; 
 
    }); 
 

 
    btnSave.addEventListener('click', function() { 
 
    var doc = new jsPDF(); 
 
    doc.addImage(chart.getImageURI(), 0, 0); 
 
    doc.save('chart.pdf'); 
 
    }, false); 
 

 
    chart.draw(data, { 
 
    chartArea: { 
 
     bottom: 24, 
 
     left: 36, 
 
     right: 12, 
 
     top: 48, 
 
     width: '100%', 
 
     height: '100%' 
 
    }, 
 
    height: 600, 
 
    title: 'chart title', 
 
    width: 600 
 
    }); 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js"></script> 
 
<input id="save-pdf" type="button" value="Save as PDF" disabled /> 
 
<div id="chart_div"></div>