Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Stefan Larsen
20
JavaScript Excel Library is exporting charts with weird horizontal axis position
posted

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?

Parents
No Data
Reply
  • 440
    Verified Answer
    Offline posted

    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

Children