DeepaNandhini
Posts: 3
Joined: Mon Aug 08, 2022 1:09 pm

Appending HTML Table below Xaxis

Hi Everyone,
We are having a requirement to show a details in table below the x axis. The table has maximum of 8 rows and it is designed as a HTMl table with few logics. The data for the table and graph are different , and the x axis ticks and the th for the table are the same. It would be great if we got support on appending the existing html table below the graph. The image of our requirent is attached below
highcharts.PNG
highcharts.PNG (20.39 KiB) Viewed 500 times
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Appending HTML Table below Xaxis

Hello there,

Welcome to our forum!

I'm sorry but your question is not related to Highcharts functionality, and since it's strictly a Highcharts support forum, we don't help with other problems not related to our product's functionality.

To get the xAxis tick values you can access the global Highcharts object everywhere in your code.
Simply type:

Code: Select all

Highcharts.charts[0].xAxis[0].ticks 
or

Code: Select all

Highcharts.charts[0].xAxis[0].tickPositions
To add an HTML table, I would suggest adding a separate div below the 'container' where you create your chart. You can then wrap both divs with a one div wrapper.

In case of any other questions related to Highcharts functionality feel free to contact us anytime,
Best regards!
Kamil Musiałowski
Highcharts Developer
DeepaNandhini
Posts: 3
Joined: Mon Aug 08, 2022 1:09 pm

Re: Appending HTML Table below Xaxis

Hi ,
We have added the charts and Html table below in a container. But the scrollbar occurs seperately for the highchart graph and the table and we wanted to have only a single scroll for both. So we would like to know if we can append the table in the X axis of the highchart.Attached the image for reference.
highcharts1.PNG
highcharts1.PNG (22.76 KiB) Viewed 483 times
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Appending HTML Table below Xaxis

As I said in the previous post, this question is not related to Highcharts functionality. To get more help about container content overflow, I would suggest looking into more general forums i.e Stackoverflow. This is an HTML and CSS problem, not a Highcharts one.

Try the aforementioned solution by wrapping two divs into one, and then work on a scrollbar issue.

Regards!
Kamil Musiałowski
Highcharts Developer
DeepaNandhini
Posts: 3
Joined: Mon Aug 08, 2022 1:09 pm

Re: Appending HTML Table below Xaxis

Hi kamal,
Our issue is not on container content overflow. We would like to display table along with xaxis of the highcharts.Kindly let us know if highcharts supports this functionality
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Appending HTML Table below Xaxis

Could you reproduce your code (in JSFiddle) where you were trying to append the table to xAxis? I'll have a look into that and try to figure some suggestions.
Kamil Musiałowski
Highcharts Developer

Return to “Highcharts Stock”