Guide to download Gantt Chart

Frappe Framework Customization
,
1

Tutorial to Download Gantt chart view in pdf
image

In task_list.js

frappe.listview_settings['Task'] = {
    refresh: function (listview) {
        listview.page.add_inner_button(__("PDF"), () => {
            const ganttChartSVG = document.querySelector('.gantt');
            if (ganttChartSVG) {
                svgExport.downloadPdf(
                    ganttChartSVG,
                    "Gantt Export"
                );
            }
        }, __("Download Gantt"))
    }
}

In hooks.py

app_include_js = [
    "https://cdnjs.cloudflare.com/ajax/libs/canvg/3.0.9/umd.js",
    "https://sharonchoong.github.io/svg-exportJS/svg-export.min.js",
    "https://cdn.jsdelivr.net/npm/pdfkit@0.13.0/js/pdfkit.standalone.js",
    "https://cdn.jsdelivr.net/npm/blob-stream-browserify@0.1.3/index.js",
    "https://cdn.jsdelivr.net/npm/svg-to-pdfkit@0.1.8/source.js"
]

doctype_list_js = {"Task" : "public/js/task_list.js"}

For image format downloads or detailed information, visit: GitHub - sharonchoong/svg-exportJS: A Javascript library to export svg charts from the DOM and download them as an SVG file, PDF, or raster image (JPEG, PNG) format. Can be done all in client-side.

3 Likes