Highcharts:phantomjs导出图像丢失标签

时间:2014-05-13 14:01:54

标签: highcharts highstock

我的图表是一个堆积条形图,要求在实际条形图上显示数据标签。

浏览器版本的工作方式与数据标签相关,但导出的图像没有。

这是我的代码:

{
  colors: ['#0EAC55','#91C855','#F3BA0E','#F39595','#F30E0E'],
       chart: {
                type: 'bar',
                height: 195
            },
            credits: {
            enabled: false
            },
            title: {
                text: ''
            },
            xAxis: {
                categories: ['Category 1', 'Category 2', 'Category 3'],
            },
             tooltip: {
                valueSuffix: '%'
            },
            yAxis: {
                min: 0,
                title: {
                    text: ''
                },
                max: 100,
                opposite: true,
            },
            legend: {
                backgroundColor: '#FFFFFF'
            },

            plotOptions: {
                series: {
                    stacking: 'percent',
                    groupPadding: 0,
                    dataLabels: {
                    enabled: true,
                    color: '#000000'

                    }
                }
            },
                series: [{"name":"5","legendIndex":5,"data":[41.1,44.2,60.2]},{"name":"4","legendIndex":4,"data":[42.9,38.4,25.2]},{"name":"3","legendIndex":3,"data":[12.2,12,8.8]},{"name":"2","legendIndex":2,"data":[3.3,5,3]},{"name":"1","legendIndex":1,"data":[1,1,3.3]}]
    }

我正在使用phantomjs服务器来生成图像,因为这些需要在服务器端生成。 http://www.highcharts.com/component/content/article/2-articles/news/56-improved-image-export-with-phantomjs/

3 个答案:

答案 0 :(得分:1)

我遇到了同样的问题。我尝试了上面的所有选项。将所有animation选项设置为false,将所有defer选项设置为false,但这对我没有帮助解决问题。

最后我在github.com上发现了一个问题。这是 HighCharts 的错误。我使用4.0.1Highcharts

因此,如果上述建议不起作用,解决方案就是将您的highcharts文件更新为最新版本。

我的示例代码可以在jsfiddle找到。

答案 1 :(得分:0)

禁用所有动画,并确保您拥有最新的导出服务器,而不是旧的导出服务器。

另外,将defer选项设置为false。

答案 2 :(得分:0)

扩展Pawel Fus给出的答案,我发现确保动画设置为false确实有所作为,但不是整体水平(即chart.animation = false),它必须设置在{ {1}}。