Question

我尝试使用Javascript通过以下网站将amcharts导出为PDF

[Codepen](https://codepen.io/team/amcharts/pen/35076c4d7b6eef7764dacc61f72adadc)

步骤，但PDF文字乱码（中文单词），我想用UTF-8，我该如何解决？为什么图表的分辨率如此之低？谢谢。 enter image description here

HTML

<h2 id="OPASS" class="display-5 col-md-offset-4 col-md-12">測試圖表</h2>

的javascript

    var downloadPDF = function() {
            console.log("Starting export...");
            var ids = ["chartdiv", "Passion_chart", "Anchor_chart", "Switch_chart", "Synergy_chart"];
            var charts = {}, charts_remaining = ids.length;
            for (var i = 0; i < ids.length; i++) {
                for (var x = 0; x < AmCharts.charts.length; x++) {
                    if (AmCharts.charts[x].div.id == ids[i])
                        charts[ids[i]] = AmCharts.charts[x];
                }
            }
            for (var x in charts) {
                if (charts.hasOwnProperty(x)) {
                    var chart = charts[x];
                    chart["export"].capture({}, function() {
                        this.toJPG({}, function(data) {
                            // Save chart data into chart object itself
                            this.setup.chart.exportedImage = data;
                            // Reduce the remaining counter
                            charts_remaining--;
                            // Check if we got all of the charts
                            if (charts_remaining == 0) {
                                // Yup, we got all of them
                                // Let's proceed to putting PDF together
                                generatePDF();
                            }
                        });
                    });
                }
            }
            function generatePDF() {
                // Log
                console.log("Generating PDF...");
                // Initiliaze a PDF layout
                var layout = {
                    "content": []
                };
                // Let's add a custom title
                layout.content.push({
                    "text": document.getElementById("OPASS").innerHTML,
                    "fontSize": 24
                });
                // Now let's grab actual content from our <p> intro tag
                layout.content.push({
                    "text": document.getElementById("intro").innerHTML
                });
                // Add bigger chart
                layout.content.push({
                    "image": charts["chartdiv"].exportedImage,
                    "fit": [523, 300]
                });
                chart["export"].toPDF(layout, function(data) {
                this.download(data, "application/pdf","amCharts.pdf");
            });
        }
    }

Answer 1

PDF Amk，图书馆AmCharts利用PDF导出，不支持中文开箱即用的默认Roboto字体（在问题跟踪器中存在大量问题，例如{{3 }}）。您必须使用具有中文字符的字体创建自定义*** PageAuditController with $routeParams => { "id": "2" } page-audit.js:11 Selected audit id at PageAuditController=> 2 audit.js:5 *****************Audit Controller audit.js:52 Selected Audit Id at AuditController=> undefined文件，并使用pdfmake开发人员提供的this one使用该文件而不是捆绑的字体文件。＆＃34;微软YaHei＆＃34;似乎建议按照我看过的github问题进行处理。

一旦您创建了自定义字体文件，您需要手动将pdfMake.js包含到您的页面中，以及自定义vfs_fonts.js文件，然后引用window.pdfMake.fonts，否则它知道使用它而不是默认的Roboto字体。

vfs_fonts.js

Amcharts中的乱码文本导出为PDF

1 个答案: