Azure中的HighCharts节点导出服务器-yAxis标题问题

如何解决Azure中的HighCharts节点导出服务器-yAxis标题问题

我的yAxis标题有问题-尝试在Azure中使用Node.JS highcharts导出服务器时会显示一些点（或逗号）。如果我使用本地服务器或highcharts默认导出服务器-一切正常。将项目发布到Azure后，yAxis标题就会停止显示。

这是测试代码：

{
    "type": "png","options": {
        "title": {
        "text": "Combination chart"       
        },"xAxis": {
            "categories": ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]
        },"yAxis": {
            "title": {
                "text":"ASDKJL#)( SDLFIJSDFL SDLFKJSLDKFJ SDLFKJSLDKFJlkjsldflLSDKJF","margin": 60,//this is me
                "rotation":270,//testing different options
                "style":{        //without any luck

                }
            }
        },"series": [{
            "data": [29900,71500,106400,129200,144000,176000,135600,148500,216400,194100,95600,54400]
        }]
    }
}

这是本地/高级图表服务器结果：

这是Azure服务器结果：

（请忽略标题的不同字体-我以稍微不同的示例来理解它）

xAxis标题工作正常：

这是我来自server.js的代码：

'use strict';
var http = require('http');
var port = process.env.PORT || 1337;
var url = require('url');
var qs = require('querystring');

var bodyParser = require('body-parser');


http.createServer(function (req,res) {
    if (req.url == '/' || req.method == 'GET') { 
        // set response header
        res.writeHead(200,{ 'Content-Type': 'text/html' });
        // set response content    
        res.write('<html><body><p>Ok</p></body></html>');
        res.end();
    } else {
        if (req.url == "/png") {
            var body = '';
            req.on('data',function (data) {
                body += data;
            });
            req.on('end',function () {                
                try {
                    var body_object = JSON.parse(body);
                    var t = exporter.export(body_object,function (err,highchart_result) {
                        //The export result is now in res.
                        //If the output is not PDF or SVG,it will be base64 encoded (res.data).
                        //If the output is a PDF or SVG,it will contain a filename (res.filename).

                        var img = '<img src="data:image/png;base64,' + highchart_result.data + '" >';

                        res.writeHead(200,{ 'Content-Type': 'text/html' });
                        res.write(img);
                        res.end();

                        //Kill the pool when we're done with it,and exit the application
                        //exporter.killPool();
                        //process.exit(1);
                    });
                }
                catch (e) {
                    res.writeHead(400,{ 'Content-Type': 'text/html' });
                    res.write("error");
                    res.end();
                }
            });
        }
    }

    //    //Kill the pool when we're done with it,and exit the application
    //    exporter.killPool();
    //    process.exit(1);
    //});
}).listen(port);


//Include the exporter module
const exporter = require('highcharts-export-server');

//Set up a pool of PhantomJS workers
exporter.initPool();

我尝试在图表标题和轴标题上使用"fontFamily":"Arial"，并且可以看到标题字体发生了变化，因此我假设那里存在字体。此外，如果我使用 "fontFamily":"sdf"，则可以看到图表标题开始使用某种默认字体，但仍然不会消失。

为什么不显示yAxis标题？

更新1：

发现问题与文本旋转有关。 xAxis的标题显示正确。如果我添加一个轮播-它会消失。如果将旋转设置为0度，则yAxis的标题会正确显示。

添加轮播时类别名称消失（由于缺少空间）：从Azure导出服务器的外观如何：

应如何显示：

需要旋转文本时会发生什么？

我已经设置了一个测试服务器，可以使用：https://jsfiddle.net/Guest538/qgk93n7o/

Azure中的HighCharts节点导出服务器-yAxis标题问题

如何解决Azure中的HighCharts节点导出服务器-yAxis标题问题

相关推荐