Question

我正在创建一个高级客户端。我需要做的是获得该图表的png并将其存储在服务器端。

目前，我制作了高图，获得了SVG并将其转换为PNG（如下所示）：

function saveThumbnail(graph_name, chart) {
    canvg(document.getElementById(graph_name + '_thumb'), chart.getSVG());
    var chart_Canvas = document.getElementById(graph_name + '_thumb');
    var chart_Img = chart_Canvas.toDataURL("image/png");

    $('#graph_name').val(graph_name);
    $('#graph_png').val(chart_Img);
    $('#imageForm').submit();
}

这是我的 #imageForm ：

<form action="/overview" id="imageForm" method="post">
    <input id="graph_name" name="graph_name" type="hidden" value=""/>
    <input id="graph_png" name="graph_png" type="hidden" value=""/>
</form>

所以我已将PNG的值设置为input，这是建议的here，我已将该值发回服务器。

服务器端：

在下面的函数中，我试图创建/写入一个文件，其中包含PNG发回的图形的名称，并尝试将该PNG写入该文件。

function createFiles(graphName, graphPNG, callback) {
    fs.writeFile(graphDir + graphName + ".png", graphPNG, function(err) {
        if (err) {
            console.log(err);
        } else {
            console.log('File was saved!');
        }
    });
    callback(body);
}

无论如何要实现这个目标吗？

注意：不能拥有highcharts服务器端。这是先前做出的决定，我们无法回去。

Answer 1

您没有在fs.writeFile中指定数据类型：

fs.writeFile(graphDir+graphName + ".png", graphPNG, 'binary', function(err){

binary或base64切换你的数据;）

从客户端[node]发送的值创建.png图像

1 个答案: