Setting intervals between ticks on Charts v2 axis

I'm trying to replicate a stacked-bar chart that I did with Ploty using the new Charts v2. I was successful with most of it, but cannot make the X-axis work.

In the original one (red and green screenshot) I was able to show months with an interval of one, with a format of Month Year. I did it by adding "tickformat": "%b %Y", "dtick": "M1" to the layout section.

When trying to replicate the same thing with the Charts component, I could only set the tick format to show Month Year, but it is still showing each month repeated times, which is what happened in the original one before I added the dtick M1 setting, and I cannot find a way to add it to the Chart settings. Is there a way to do that? Below is an example of what is happening in the new one.

Thanks!

Visualize data with chart components

2 Likes

Hello @Sol_Cuadrado!

I apologize for the issue with the new chart :sweat_smile:

It sounds like you are interested in having the granular level of control for adding in dtick M1 to the new table in the same way that this was possible to do so with the "Layout" input in the old chart.

So that you can ensure the bars have on their x-axis below them the month they represent, instead of the current view that looks like it thinks you want the start-end date range.

Let me see if the new chart component is able to accomplish this, if it currently can't be done I can file a feature request for this. But my hope is that we can get things sorted with the chart currently.

Are you able to share the data that is being passed to the chart and rendered?

Where in the new chart did you "Set the tick format to show Month Year"? I think the v2 chart should have dtick M1 set automatically, but it is doing some formatting from the data source. So my guess is your data might include two months for each value that is being rendered turned into a bar :thinking:

I made a super simple test case and the v2 chart was able to render my data just like how you have in your first screen shot. However, my table is not stacking values, so maybe that is an edge case that the chart does not handle by default that needs some tinkering :thinking:

For your v2 chart, can you also click on "Series" and then share with me the screen shot of the inspector after you click into Series?

Mine looks like this:

I would assume that if X data is set to Month, that it will appear like mine below:

But my data is very simple, it depends on if your data being passed in is making the chart think you want two months per bar and we need to override this or if something else was changed in the chart that would make it a date range on the x-axis instead of a single month per tick.

Hi @Sol_Cuadrado,

Just wanted to share some info I got from the eng team that built out the v2 charts.

They said the main setting you would need to change would be the “X-axis” “Scale” setting, and change that to “Date”.

Also inside the x-axis inspector, by clicking the FX button next to "label format" you can enter in the %b to format the date.

Waiting to hear back on how to shift the bars to be started and ended by the corresponding months. I believe we would need to see the data you are passing in, if you are able to share that it would be very helpful!

1 Like