3D column Chart

[rowan.bradley]

I know HighCharts can do some forms of 3D graph, but I have not yet found the type of graph that I am looking for. What I need is what I would call a 3D column graph, but instead of just having columns along one axis, I need a 2D array of square cross section columns, so that I can have a column at X dimension x and at Y dimension y, with height z. I would like to be able to rotate the whole graph so that I can look at it with the X axis going from left to right, and the Y axis from front to back. I would then like to be able to move through the graph from front to back, seeing the X-Z graph for each different Y value. I would then like to be able to rotate the graph by 90 degrees, so that I am looking at it with the Y axis from left to right, and the X axis from front to back. Now I would like to be able to move forward and backward along the X axis, for each X value seeing the corresponding Y-Z graph.

Is anything like this possible with the 3D module?

Thanks - Rowan

[rafalS]

Hi, Rowan!

Is this what you have been looking for? 3d column chart with X, Y and Z dimensions the ability to rotate 360 degrees: http://jsfiddle.net/d6Lf3z7q/

Best regards!

[rowan.bradley]

Is this what you have been looking for? 3d column chart with X, Y and Z dimensions the ability to rotate 360 degrees: http://jsfiddle.net/d6Lf3z7q/

Yes, fantastic, that is pretty well exactly what I was looking for. I will have a go at creating the 3D chart that I want with this.

Thanks for your help - Rowan

[anaxjk]

Hi all,

I have a question about this type of graphic.

I have a similar one and it works really great. I just have the problem when the depth gets too big that the visualization is not smooth and the graphic sometimes gets very small and then immediately big again. You can recreate it in the example if you set the value to 2500 for example. For me this is the case when the z-axis gets many entries.

Thanks a lot
Jochen

[dawid.d]

Hi Jochen,

Thanks for contacting us with your question!

It seems to be a bug. For this reason, I reported it to our official GitHub repository.
You can find it here: https://github.com/highcharts/highcharts/issues/18675

You can expect updates and possible workarounds there.

Do not hesitate to contact us in the future
Best regards!

[anaxjk]

Thank you for recording the bug!

I would have another question: Is it possible to disable all mouseover events while rotating. If you come over the graphic with the mouse pointer while rotating, then tooltips and hover effects are triggered. If there are only a few series, this is not a problem. However, if there are many, you will notice a significant drop in performance and it jerks when rotating.

Cheers, Jochen

[dawid.d]

Hi,

Thanks for the question and sorry for the delay in response.

Highcharts API provides the enableMouseTracking option, with which you can turn off the mouse tracking.
API: https://api.highcharts.com/highcharts/s ... seTracking

You can update this option at any time. However, it is possible that I found another bug while preparing the demo because the update of this option does not seem to work properly with 3d column charts.
Demo: http://jsfiddle.net/BlackLabel/jf1dck5m/

Let me know if you have any further questions!
Best regards

[anaxjk]

Hi ,

Thank you for the answer,

yes, it does not work for my 3d column chart. I had tried similar things as well. Would be great if the bug would be fixed in one of the next releases !

Best regards

[dawid.d]

You're welcome!

The bug has been reported here: https://github.com/highcharts/highcharts/issues/18985

Feel free to ask any further questions!
Kind Regards

[anaxjk]

I think it's fixed in the new version, right?

[dawid.d]

Hi,

Yes, that's right! You can see it in the changelog: https://www.highcharts.com/blog/changel ... ts-v11.1.0

Also, it should work in your case now, see the demo below.
Demo: https://jsfiddle.net/BlackLabel/nuspkb96/

Regards!

[tempdb]

Hello,
If single bar is there then it will not shown as 3D in older version we have this working. Pls find this fiddler: https://jsfiddle.net/sqhb1gjz/

[dawid.d]

Hello tempdb,

Welcome to the forum and thanks for asking the question!

Could you explain what exactly you mean? In the demo you sent everything seems to work fine, it's just that the perspective is set in such a way that it seems like the view is 2D. If you move the sliders to change the perspective, you should see a view that looks more like 3D.

Best regards!