Highcharts: phantomjs export image missing labels

2019-07-22 10:53发布

My chart is a stacked bar chart with requirements to have data labels on the actual bars.

The in browser version is working perfectly featuring the data labels accordingly, however the exported image does not have them.

Here is my code:

{
  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]}]
    }

I am using the phantomjs server to produce images as these need to be generated on the server side. http://www.highcharts.com/component/content/article/2-articles/news/56-improved-image-export-with-phantomjs/

3条回答
叼着烟拽天下
2楼-- · 2019-07-22 11:40

Expanding on the answer given by Pawel Fus, I found that making sure animation was set to false did make a difference, but not the at the overall level (i.e. chart.animation = false), it had to be set on chart.plotOptions.series.animation = false.

查看更多
孤傲高冷的网名
3楼-- · 2019-07-22 11:48

Disable all animations, and make sure you have up-to-date exporting server, not some old one.

Also, set defer options to false.

查看更多
何必那么认真
4楼-- · 2019-07-22 11:54

I had the same problem. I tried all options above. Set all animation options to false, all defer options to false, but it didn't help me to solve the problem.

Finally I found an issue on github.com. And it was a bug of HighCharts. I was using 4.0.1 version of Highcharts.

So, the solution is just to update your highcharts file to the lastest version if the suggestions above didn't work.

My sample code can be found on jsfiddle.

查看更多
登录 后发表回答