y-axis labels are cut off

[shoukewei]

The longer y-axis labels are cut off, United States, United Kingdom in chart. I tried to set a margin, but nothing changed.

[FlorianJacta]

Adding a left margin in the Taipy chart should allow you to see the entire text. To do so, I created a layout dictionary to change the layout of my chart:

from taipy import Gui 

data = {
    "Temperatures": [[17.2, 27.4, 28.6, 21.5],
                     [5.6, 15.1, 20.2, 8.1],
                     [26.6, 22.8, 21.8, 24.0],
                     [22.3, 15.5, 13.4, 19.6]],
    "Countries": ["United Kingdom", "United States", "Brazil", "Germany"],
    "Seasons": ["Winter", "Spring", "Summer", "Autumn"]
}

layout = {"margin": {"l": 120}}

md = "<|{data}|chart|type=heatmap|z=Temperatures|x=Seasons|y=Countries|layout={layout}|>"

Gui(md).run()

Taipy version: 2.3.1

[FabienLelaquais]

@shoukewei Can you provide us with some code so we can reproduce this problem? The thing is: Plotly, the front-end rendering library, is in charge of all those layout details and leaves the user in charge of fine-tuning the final output. Margins should be the way to go... but you're saying it has no impact...

Thanks!

[jrobinAV]

@FabienLelaquais Can you add an example in the chart documentation to show how to solve this issue?

Thank you.

[github-actions[bot]]

This issue has been labelled as "🥶Waiting for contributor" because it has been inactive for more than 14 days. If you would like to continue working on this issue, please add another comment or create a PR that links to this issue. If a PR has already been created which refers to this issue, then you should explicitly mention this issue in the relevant PR. Otherwise, you will be unassigned in 14 days. For more information please refer to the contributing guidelines.

[FabienLelaquais]

I don't know if I'll do that. That would be a setting in Plotly, and there is no reason to focus on this setting and not others. I'll try to come up with a rationale for a go or a no go rapidly.

[github-actions[bot]]

This issue has been labelled as "🥶Waiting for contributor" because it has been inactive for more than 14 days. If you would like to continue working on this issue, please add another comment or create a PR that links to this issue. If a PR has already been created which refers to this issue, then you should explicitly mention this issue in the relevant PR. Otherwise, you will be unassigned in 14 days. For more information please refer to the contributing guidelines.

[ScalarJerk]

@shoukewei does this issue still persist?

[FlorianJacta]

Still an issue.

from taipy import Gui

data = {
    "Temperatures": [
        [17.2, 27.4, 28.6, 21.5],
        [5.6, 15.1, 20.2, 8.1],
        [26.6, 22.8, 21.8, 24.0],
        [22.3, 15.5, 13.4, 19.6],
    ],
    "Countries": ["United Kingdom", "United States", "Brazil", "Germany"],
    "Seasons": ["Winter", "Spring", "Summer", "Autumn"],
}

md = "<|{data}|chart|type=heatmap|z=Temperatures|x=Seasons|y=Countries|>"

Gui(md).run()

[mahanteshimath]

@jrobinAV I have solved it can you assign to me

[FabienLelaquais]

I can certainly do that! Thanks @mahanteshimath (and sorry @shoukewei...).

[quest-bot[bot]]

New Quest!

A new Quest has been launched in @Avaiga’s repo. Merge a PR that solves this issue to loot the Quest and earn your reward.

---

Some loot has been stashed in this issue to reward the solver!

🗡 Comment @quest-bot embark to check-in for this Quest and start solving the issue. Other solvers will be notified!

⚔️ When you submit a PR, comment @quest-bot loot #559 to link your PR to this Quest.

Questions? Check out the docs.

[github-actions[bot]]

This issue has been labelled as "🥶Waiting for contributor" because it has been inactive for more than 14 days. If you would like to continue working on this issue, please add another comment or create a PR that links to this issue. If a PR has already been created which refers to this issue, then you should explicitly mention this issue in the relevant PR. Otherwise, you will be unassigned in 14 days. For more information please refer to the contributing guidelines.

[Vaibhav91one]

Please assign this issue to me @jrobinAV. (If !stale or !closed)

[FlorianJacta]

It seems that Streamlit creates the correct width or height for the chart in every case according to a user

[RaicyAugusto]

To solve this problem, you can set yaxis and xaxis in the layout with the parameter automargin=True for both axes. Then, in the layout, set autosize=True. This will make the height of the chart quite large. To adjust it, pass a class name to the chart function in Taipy and adjust the size to your preference, like this:

plotly: any_figure = px.bar(df, x='any', y='any', orientation='v', title='any')

any_figure.update_layout(yaxis=dict(automargin=True), xaxis=dict(automargin=True), autosize=True)

in taipy: tgb.chart(figure='{any_figure}', class_name='any_name')

Then style it in your CSS as follows: .any_name { display: flex; position: relative; height: vh; / Replace with any desired height using vh units / }

For example, you could use: .any_name { display: flex; position: relative; height: 35vh; }