实现的HighChart标题文本HTML样式未应用于导出文件

Question

我在HighChart标题中添加了<br/>和  HTML标签。我可以在图表视图中看到样式的变化，但是当我们导出为PNG，JPEG图像时...文本样式无法应用于导出的图像。请参考下面的示例图片

请参考JSFiddle-http://jsfiddle.net/uXg9t/172/

图表视图：

导出的视图：

关于“图表视图”中给出的任何标题导出建议。

Answer 1

@Halvor Strand的答案出了名，但是此外，还需要更改标题结构，因为在导出过程中SVG无法正确生成。之所以会这样，是因为</br>，但是要解决此问题，例如，您可以将每个标题行放在设置了<span>的不同style="display: block;"元素中。看一下代码：

    title: {
        useHTML: true,
        text: '<span style="display: block;">Header Text in Line1</span><span style="display: block;">Line 2 Text</span><span style="display: block;">Line 3 Text</span>',
        style: {
            "text-align": "center"
        }
    }

实时示例： http://jsfiddle.net/m052y9ud/

Answer 2

您可以将<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> <div id="countryDiv"></div> <div id="svgDiv"></div>设置为allowHTML，这是导出的实验功能。 API说：

  

true自4.1.8起

     

实验设置，允许图表直接在导出的图像中（通过allowHTML: Boolean选项添加的HTML）。这样，您就可以在导出的图表中保留表格或双向文本之类的复杂HTML结构。

     

免责声明：HTML在生成的SVG中的useHTML标签中呈现。官方的导出服务器基于支持此功能的PhantomJS，但其他SVG客户端（如Batik）不支持它。这也适用于您要在桌面客户端中打开的已下载SVG。

     

默认为foreignObject。

在您的情况下，它看起来可能像这样（JSFiddle）：

false