Share via

Chart.Line in Adaptive Card renders incorrectly on iOS Teams app when x-axis values are string type

정성원 0 Reputation points
2026-04-03T07:16:32.9466667+00:00

Description

When sending an Adaptive Card containing a Chart.Line element to MS Teams, the chart fails to render correctly on the iOS Teams mobile app if the x-axis (x) values are of string type (e.g., "Day 1", "Day 2", ...).

All data points collapse onto a single vertical line at x=0, and the x-axis only shows "0" instead of the expected string labels. The same card renders correctly on the Mac Teams desktop app.

스크린샷 2026-04-03 오후 3.38.05

모바일 이슈

Environment

ios Teams Version : 8.5.1

Sample Payload

"body": {
        "type": "message",
        "attachments": [
            {
                "contentType": "application/vnd.microsoft.card.adaptive",
                "content": {
                    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
                    "type": "AdaptiveCard",
                    "version": "1.4",
                    "body": [
                        {
                            "type": "TextBlock",
                            "text": "윙크 데일리 알람",
                            "weight": "Bolder",
                            "size": "Large",
                            "color": "Good"
                        },
                        {
                            "type": "Container",
                            "items": [
                                {
                                    "type": "Chart.Line",
                                    "title": "Sample",
                                    "xAxisTitle": "Days",
                                    "yAxisTitle": "Sales",
                                    "colorSet": "diverging",
                                    "data": [
                                        {
                                            "legend": "Outlook",
                                            "values": [
                                                {
                                                    "x": "Day 1",
                                                    "y": 99
                                                },
                                                {
                                                    "x": "Day 2",
                                                    "y": 63
                                                },
                                                {
                                                    "x": "Day 3",
                                                    "y": 64
                                                },
                                                {
                                                    "x": "Day 4",
                                                    "y": 63
                                                },
                                                {
                                                    "x": "Day 5",
                                                    "y": 78
                                                }
                                            ]
                                        },
                                        {
                                            "legend": "Teams",
                                            "values": [
                                                {
                                                    "x": "Day 1",
                                                    "y": 12
                                                },
                                                {
                                                    "x": "Day 2",
                                                    "y": 12
                                                },
                                                {
                                                    "x": "Day 3",
                                                    "y": 33
                                                },
                                                {
                                                    "x": "Day 4",
                                                    "y": 1
                                                },
                                                {
                                                    "x": "Day 5",
                                                    "y": 80
                                                }
                                            ]
                                        },
                                        {
                                            "legend": "Copilot",
                                            "values": [
                                                {
                                                    "x": "Day 1",
                                                    "y": 96
                                                },
                                                {
                                                    "x": "Day 2",
                                                    "y": 27
                                                },
                                                {
                                                    "x": "Day 3",
                                                    "y": 5
                                                },
                                                {
                                                    "x": "Day 4",
                                                    "y": 45
                                                },
                                                {
                                                    "x": "Day 5",
                                                    "y": 59
                                                }
                                            ]
                                        }
                                    ]
                                }
                            ]
                        }
                    ]
                }
            }
        ]
    }
Microsoft Teams | Development
Microsoft Teams | Development

Building, integrating, or customizing apps and workflows within Microsoft Teams using developer tools and APIs

2 answers

Sort by: Most helpful
Most helpful Newest Oldest
  1. Dora-T 11,940 Reputation points Microsoft External Staff Moderator
    2026-04-03T07:59:11.3166667+00:00

    Hi 정성원

    Thank you for reaching out to the Microsoft Q&A forum and for sharing the details of your scenario.

    Based on my research, I came across another thread that discusses similar behavior with line charts on the Teams iOS client:

    Unfortunately, at this time there is no confirmed workaround or fix available, and no official updates have been shared yet.

    As a moderator, I don’t have the access or tooling to investigate this issue further. In the meantime, I recommend raising this issue on GitHub, where experienced engineers and contributors may be able to offer more targeted help.

    Reference: Participating in a discussion - GitHub Docs. 

    I understand this may not be the outcome you were hoping for, and I truly appreciate your patience and understanding.

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

  2. Q&A Assist
    2026-04-03T07:16:48.13+00:00
    AI generated content. This question contains an answer created with AI from Q&A Assist. Learn more

    Chart.Line in Adaptive Cards supports string values for the x-axis, as shown in the chart schema where each data point is defined with x and y values inside the data array. The payload provided follows this schema correctly, so the behavior difference between Mac desktop and iOS Teams is not due to an invalid card definition but to a platform-specific rendering issue in the iOS Teams client.

    There is no card-side setting or property in Chart.Line that can change how iOS interprets string x values versus numeric ones. The shared chart properties (title, xAxisTitle, yAxisTitle, data, color, colorSet, layout properties, and host capability requirements) are already being used as intended.

    Given that:

    • The same payload renders correctly on desktop Teams.
    • The payload conforms to the documented Chart.Line schema.

    This should be treated as a Teams iOS chart rendering bug rather than a card-authoring problem. The practical options are:

    1. Keep the current schema-compliant payload and report the issue through Microsoft support or the Teams developer feedback channels so the iOS client can be fixed.
    2. As a temporary workaround, switch to numeric x values (for example, 1, 2, 3, 4, 5) and convey the labels in a separate legend or TextBlock, so that the chart remains usable on iOS until the client is updated.

    References:

    0 comments

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.