Hello,
I'm trying to export charts to an Excel Workbook using the Javascript Excel Library but I'm unable to get the horizontal axis to work correctly.The same issue can be seen here: https://www.igniteui.com/javascript-excel-library/excel-worksheet-charts
It looks great in the browser, but if you click on the "Create File" button and open it in Excel, the chart is drawn outside of the visible plot area.You can't see Expense 1 and Expense 2 for January as well as Expense 4 and Expense 5 for December.
The chart is drawn correctly if I toggle the Axis position for the Horisontal Axis to "Between tick marks" and then back to "On tick marks".
Is there a fix for this issue?
Hello Stefan,
I have been looking into your question and as you yourself pointed out this is due to the default settings of the x-axis for category it is set to the chart categories to be on the tick itself, which results in splitting in half one half to the left of the tick and the other to the right which causes the described behavior at the end of the chart to cut some chart values. In this case, no matter how many values there will be for the chart, whether two or five or more, they will always think of the tick itself and divide into two.
What I suggest as an approach, before exporting the chart to Excel, is to explicitly set the values of the x-axis of the categories to be between the ticks and not on them. This can be achieved by using axisBetweenCategories method of ig.excel.Axis, which method is passed a boolean value in this case true. This will cause the default x-axis settings to change and the values will be between the ticks to fit in the excel chart window.
chart.axisCollection($.ig.excel.AxisType.category).axisBetweenCategories(true);
The described scenario could be observed here:
In addition, I have prepared small sample illustrating this behavior which could be found here. Please test it on your side and let me know how it behaves.
If you require any further assistance on the matter, please let me know.
Regards,
Georgi Anastasov
Entry Level Software Developer
Infragistics
Perfect!That single line of javascript was exactly what I was looking for, I just pasted it into our project and now the charts are displayed correctly.
Thanks for the help!
I am glad that you find my suggestion helpful.
Thank you for using Infragistics components.