Google chart is not printing in form

I defined HTML docfield in doctype and name it “chart” then create chart by google chart library and render it in custom script:

frappe.ui.form.on(“ali”, {
refresh: function(frm) {

$.getScript(“”, function(){

google.charts.load(‘current’, {‘packages’:[‘bar’]});
function drawChart() {
var data = google.visualization.arrayToDataTable([
[‘Year’, ‘Sales’, ‘Expenses’, ‘Profit’],
[‘2014’, 1000, 400, 200],
[‘2015’, 1170, 460, 250],
[‘2016’, 660, 1120, 300],
[‘2017’, 1030, 540, 350]

    var options = {
      chart: {
        title: 'Company Performance',
        subtitle: 'Sales, Expenses, and Profit: 2014-2017',

   var chart = new google.charts.Bar($('[title=chart]')[0]);
    chart.draw(data, options);


it will be like this:

but chart not in print view:

if I press control + P it will appear:

Could you advice me How I can print chart in frappe framework?


@Mohammed_Redha tough one. JS libraries, triggers are not fully loaded in print formats.

Maybe you can modify the print format for HTML fields to include the full inner-html

(But you might still miss the Google Charts CSS)

From where I can modify Print format?

I tried to render it with img URI without luck:

chart_div.innerHTML = ‘<img src="' + chart.getImageURI() + '">’;

Hi, Actually i am also facing the same issue… how can i modify the print format to get the charts? kindly explain the steps how to change

hi, Did you get the chart in print format?