Exporting with custom data label image in highcharts gantt

Question

In the below examples, I've tried to put the image of each point (img tags in custom data labels) in the exported file but, they would be disappeared after exporting. Link of examples: https://jsfiddle.net/meysamm22/eohdp897/3/

or: https://jsfiddle.net/BlackLabel/y02sjkvg/

I've also used some related options, but they didn't help me.

exporting: {
            allowHTML: true,
             width: 5200,
            sourceWidth: 3200,
            chartOptions: {
                plotOptions: {
                    series: {
                        dataLabels: {
                            enabled: true
                        }
                    }
                }
            }
        }

score 1 · Answer 1 · answered Jul 13 '20 at 14:49

1

Your dataLabels are rendered as an outstanding HTML element, because of the useHTML feature. To render them also in the exported charts you need to set the exporting.allowHTML option to true.

Demo: https://jsfiddle.net/BlackLabel/j1zp7het/

    exporting: {
        allowHTML: true
    }

API: https://api.highcharts.com/highcharts/exporting.allowHTML

answered Jul 13 '20 at 14:49

Sebastian Wędzel

11,417
1
6
16

Thanks for your answer, but it didn't work in my real example – Meysam Zarei Jul 14 '20 at 07:30
Are you able to reproduce your broken case? – Sebastian Wędzel Jul 14 '20 at 11:55
I think when I use the online URLs for img tags it works, but for my local URL it doesn't work even though I'm using the offline-exporting module. – Meysam Zarei Jul 14 '20 at 12:56
Ah, are you trying to export the img from your desktop memory not from the server? – Sebastian Wędzel Jul 14 '20 at 15:00
Of course no, I'm implementing it base-on laravel on my localhost, and images are located there. If it's possible, let me try to separate my chart to independent code and put it on the JsFiddle to solve this together. – Meysam Zarei Jul 14 '20 at 19:41
It seems offline exporting ignores the allowHTML option – Meysam Zarei Jul 15 '20 at 13:00
Are you able to reproduce your case on some online editor? – Sebastian Wędzel Jul 15 '20 at 15:30
In this example, I've added offline exporting module and it doesn't work correctly. https://jsfiddle.net/meysamm22/m1hbdv73/3/ – Meysam Zarei Jul 15 '20 at 18:52
@MeysamZarei, as you can see in the console offline exporting, doesn't support the allowHTML option: https://www.highcharts.com/errors/28/ – Sebastian Wędzel Jul 15 '20 at 20:30
I see, because of this I've asked another question to figure it out: https://stackoverflow.com/questions/62923019/render-svg-images-on-each-point-of-gantt-chart-in-highcharts – Meysam Zarei Jul 16 '20 at 04:06

Exporting with custom data label image in highcharts gantt

1 Answers1