Image here (PNG format)
Exported image in SVG format looks ok, but labels in PNG, JPEG or PDF format images are cropped.
marginRight, marginLeft, width, sourceWidth changes make no sense.
This is my chart Chart
You're using a bit old version of Highcharts, so first, please update it at least to v4.1.8. Then, please try to set options below within your chart configuration object:
Enable html support for exporting:
exporting: {
allowHTML: true
}
and switch on the useHTML on the xAxis.labels:
xAxis: {
labels: {
useHTML: true
}
}
API Reference:
https://api.highcharts.com/highcharts/xAxis.labels.useHTML
https://api.highcharts.com/highcharts/exporting.allowHTML
Related
I am using the highchart library for displaying the charts.
It displays the chart as an SVG image. The legend part is also a part of the SVG.
In the screenshot, please check the <g class="highcharts-legend" element. It is a part of the SVG.
Is there any possibility that legends should not be a part of the SVG? It should be outside the SVG as an HTML list.
Maybe there is an option in the highchart configurations but I am missing it?
Update:
Using the useHtml option, the text of the legend is now outside the SVG, but the color dots are still inside the SVG.
There is useHTML option for legend, but it will place only text elements outside SVG.
legend: {
useHTML: true,
...
}
You need to create a custom legend if you want to move it fully outside of SVG.
Live demo: http://jsfiddle.net/BlackLabel/rox6dc7a/
API Reference: https://api.highcharts.com/highcharts/legend.useHTML
When I try to export a haghchart Gantt to JPA or PNG based-on blow options, I cannot export the wide one, so it's not appropriate for printing.
exporting:
{
enabled: true,
scale: 3,
with: 2048
}
How is it possible to export a wide picture of Gantt chart?
I am using highchart and exporting that to PDF from BIRT tool so when exported the Bars inside graph is overlapping, actually in HTML the gap between bars is nearly an inch. can someone help me out in resolving this issue
Got the answer. Just need to add in plot options
series: {
pointPadding: 0.1, //single bar
groupPadding: 0, //for group of bars
}
I have a script that produces a Highcharts column graph. This working perfectly and display the percentage at the top of each data column.
If I then export it to a PDF using the Highcharts export function the percentage is displayed twice on each column.
Does anyone have any idea why this happends.
As I say the on screen display is fine.
Many thanks in advance for any pointers.
you need to set textShadow as false, see below :
plotOptions: {
series: {
dataLabels: {
style: { textShadow: false },
}
}
}
here is demo with your previous question's data
EDIT: Related topic on github: https://github.com/highslide-software/highcharts.com/issues/3649
I write 'reversed' for yAxis: reversed: true
yAxis inverted
but the lower part of the chart is not reversed: ScreenShot
please, tell me how reverse the lower part of the chart?
You can specify settings for the navigator.yAxis explicitly,
navigator: {
yAxis: {
reversed: true
}
}
Reverse navigator y axis too | Highchart & Highstock # jsFiddle
I strongly recommend going through the api reference of highstock and its demo site, they have some great documentation and live and running example codes, you should be able to solve most of the simple use cases from these