[APM] Elastic chart issues #84238

cauemarcondes · 2020-11-24T15:50:36Z

This PR solves a few issues described here: #84178

When browsing around and choosing different time ranges, the charts are still returning empty after initial displaying data. This makes for a very jarring experience 🔴🔴🔴🔴🔴
Y-axis ticks don't show maxValue or any other ticks for percentages

elasticmachine · 2020-11-24T15:50:40Z

Pinging @elastic/apm-ui (Team:apm)

...omponents/shared/charts/transaction_breakdown_chart/transaction_breakdown_chart_contents.tsx

sorenlouv · 2020-11-24T16:44:13Z

x-pack/plugins/apm/public/components/shared/charts/timeseries_chart.tsx

+            }}
+            marker={<EuiIcon type="dot" color={annotationColor} />}
+            markerPosition={Position.Top}
+          />


Any reason for this duplication? Wasn't it better to have it in a separate <Annotations /> component?

Wasn't it better to have it in a separate component?

Having it as a separate component is the reason the chart disappears after the annotations is rendered. It is a workaround until this issue gets fixed elastic/elastic-charts#914

x-pack/plugins/apm/public/context/charts_sync_context.tsx

sorenlouv

Looks good. Thanks for fixing so quickly. I added a few comments, most notably that I think annotations should be in a separate context from the shared pointer event.

cauemarcondes · 2020-11-25T09:05:32Z

x-pack/plugins/apm/public/components/app/TransactionDetails/Distribution/index.tsx

@@ -224,7 +224,7 @@ export function TransactionDistribution({
            id="y-axis"
            position={Position.Left}
            ticks={3}
-            showGridLines
+            gridLine={{ visible: true }}


showGridLines is deprecated, changing all to use gridLine.

formgeist

In general the disappearing charts issue seems have been resolved. I spotted a few differences in the placement of the chart itself within the panel, it seems to have shifted upwards. The annotations are now conflicting with the titles. There's additional space under the legend, which is why I imagine the chart container has moved upwards.

sorenlouv

lgtm 👍

cauemarcondes · 2020-11-25T14:53:01Z

In general the disappearing charts issue seems have been resolved. I spotted a few differences in the placement of the chart itself within the panel, it seems to have shifted upwards. The annotations are now conflicting with the titles. There's additional space under the legend, which is why I imagine the chart container has moved upwards.

@formgeist I'm trying to figure out with @markov00 what could be caused this problem. None of us changed anything that could cause this change. I'm going to move forward with this PR, and open a new open to fix this problem.

kibanamachine · 2020-11-25T15:46:50Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request
Commit: 77e97c8

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`apm`	3.1MB	3.1MB	+1.3KB

History

💚 Build #90205 succeeded 13fac2e
💚 Build #90169 succeeded 2ae7df5
💚 Build #90007 succeeded a99d89f
💚 Build #90002 succeeded c069d57

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

* fixing charts * addressing pr comments

* master: (70 commits) [Uptime] Fix headers io-ts type (elastic#84089) [fleet] Add config options to accepted docker env vars (elastic#84338) [Fleet] Support URL query state in agent logs UI (elastic#84298) [basePathProxy] include query in redirect (elastic#84356) [Security Solution] Add Endpoint policy feature checks (elastic#83972) Fix issues with show_license_expiration (elastic#84361) [Security Solution][Resolver] Add support for predefined schemas for endpoint and winlogbeat (elastic#84103) [cli/dev] log a warning when --no-base-path is used with --dev (elastic#84354) [Fleet] Support input-level vars & templates (elastic#83878) [APM] Elastic chart issues (elastic#84238) [Time to Visualize] Fix Unlink Action via Rollback of ReplacePanel (elastic#83873) redirect to visualize listing page when by value visualization editor doesn't have a value input (elastic#84287) add live region for field search (elastic#84310) [ML] Persisted URL state for Anomalies table (elastic#84314) [dev/cli] detect worker type using env, not cluster module (elastic#83977) [Workplace Search] Migrate DisplaySettings tree (elastic#84283) Deprecate `xpack.task_manager.index` setting (elastic#84155) [Search] Search batching using bfetch (again) (elastic#84043) Use .kibana instead of .kibana_current to mark migration completion (elastic#83373) [Monitoring] Only look at ES for the missing data alert for now (elastic#83839) ...

* master: (119 commits) [Uptime] Fix headers io-ts type (elastic#84089) [fleet] Add config options to accepted docker env vars (elastic#84338) [Fleet] Support URL query state in agent logs UI (elastic#84298) [basePathProxy] include query in redirect (elastic#84356) [Security Solution] Add Endpoint policy feature checks (elastic#83972) Fix issues with show_license_expiration (elastic#84361) [Security Solution][Resolver] Add support for predefined schemas for endpoint and winlogbeat (elastic#84103) [cli/dev] log a warning when --no-base-path is used with --dev (elastic#84354) [Fleet] Support input-level vars & templates (elastic#83878) [APM] Elastic chart issues (elastic#84238) [Time to Visualize] Fix Unlink Action via Rollback of ReplacePanel (elastic#83873) redirect to visualize listing page when by value visualization editor doesn't have a value input (elastic#84287) add live region for field search (elastic#84310) [ML] Persisted URL state for Anomalies table (elastic#84314) [dev/cli] detect worker type using env, not cluster module (elastic#83977) [Workplace Search] Migrate DisplaySettings tree (elastic#84283) Deprecate `xpack.task_manager.index` setting (elastic#84155) [Search] Search batching using bfetch (again) (elastic#84043) Use .kibana instead of .kibana_current to mark migration completion (elastic#83373) [Monitoring] Only look at ES for the missing data alert for now (elastic#83839) ...

fixing charts

c069d57

cauemarcondes added release_note:skip Skip the PR/issue when compiling release notes v7.11.0 labels Nov 24, 2020

cauemarcondes requested a review from a team as a code owner November 24, 2020 15:50

botelastic bot added the Team:APM All issues that need APM UI Team support label Nov 24, 2020

cauemarcondes requested a review from formgeist November 24, 2020 15:51

Merge branch 'master' of github.com:elastic/kibana into apm-empty-charts

a99d89f

sorenlouv reviewed Nov 24, 2020

View reviewed changes

...omponents/shared/charts/transaction_breakdown_chart/transaction_breakdown_chart_contents.tsx Outdated Show resolved Hide resolved

sorenlouv reviewed Nov 24, 2020

View reviewed changes

x-pack/plugins/apm/public/context/charts_sync_context.tsx Outdated Show resolved Hide resolved

sorenlouv requested changes Nov 24, 2020

View reviewed changes

cauemarcondes mentioned this pull request Nov 25, 2020

[APM] Duplicate api requests on many pages #84249

Closed

addressing pr comments

68490ee

cauemarcondes requested a review from sorenlouv November 25, 2020 09:02

Merge branch 'master' of github.com:elastic/kibana into apm-empty-charts

2ae7df5

cauemarcondes commented Nov 25, 2020

View reviewed changes

Merge branch 'master' of github.com:elastic/kibana into apm-empty-charts

13fac2e

formgeist approved these changes Nov 25, 2020

View reviewed changes

sorenlouv approved these changes Nov 25, 2020

View reviewed changes

Merge branch 'master' of github.com:elastic/kibana into apm-empty-charts

77e97c8

cauemarcondes merged commit 8804b50 into elastic:master Nov 25, 2020

cauemarcondes deleted the apm-empty-charts branch November 25, 2020 16:08

cauemarcondes mentioned this pull request Nov 25, 2020

[7.x] [APM] Elastic chart issues (#84238) #84348

Merged

cauemarcondes added a commit to cauemarcondes/kibana that referenced this pull request Nov 25, 2020

[APM] Elastic chart issues (elastic#84238)

536891e

* fixing charts * addressing pr comments

cauemarcondes added a commit that referenced this pull request Nov 25, 2020

[APM] Elastic chart issues (#84238) (#84348)

8a40ae9

* fixing charts * addressing pr comments

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[APM] Elastic chart issues #84238

[APM] Elastic chart issues #84238

cauemarcondes commented Nov 24, 2020

elasticmachine commented Nov 24, 2020

sorenlouv Nov 24, 2020 •

edited

Loading

cauemarcondes Nov 25, 2020

sorenlouv left a comment •

edited

Loading

cauemarcondes Nov 25, 2020

formgeist left a comment

sorenlouv left a comment

cauemarcondes commented Nov 25, 2020

kibanamachine commented Nov 25, 2020

[APM] Elastic chart issues #84238

[APM] Elastic chart issues #84238

Conversation

cauemarcondes commented Nov 24, 2020

elasticmachine commented Nov 24, 2020

sorenlouv Nov 24, 2020 • edited Loading

Choose a reason for hiding this comment

cauemarcondes Nov 25, 2020

Choose a reason for hiding this comment

sorenlouv left a comment • edited Loading

Choose a reason for hiding this comment

cauemarcondes Nov 25, 2020

Choose a reason for hiding this comment

formgeist left a comment

Choose a reason for hiding this comment

sorenlouv left a comment

Choose a reason for hiding this comment

cauemarcondes commented Nov 25, 2020

kibanamachine commented Nov 25, 2020

💚 Build Succeeded

Metrics [docs]

Async chunks

History

sorenlouv Nov 24, 2020 •

edited

Loading

sorenlouv left a comment •

edited

Loading