[APM][Trace Waterfall] Adjust bar size discounting the size of the padding left added #179525
Labels
apm:waterfall
bug
Fixes for quality problems that affect the customer experience
stale
Used to mark issues that were closed for being stale
Team:obs-ux-infra_services
Observability Infrastructure & Services User Experience Team
Comments
cauemarcondes
added
bug
|
Pinging @elastic/obs-ux-infra_services-team (Team:obs-ux-infra_services) |
cauemarcondes
changed the title
|
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. |
botelastic
bot
added
the
stale
cauemarcondes
added a commit
to cauemarcondes/kibana
that referenced
this issue
Mar 28, 2025
closes elastic#179525 Before: <img width="1348" alt="Screenshot 2025-03-27 at 16 50 34" src="https://github.com/user-attachments/assets/4812c283-571b-48a6-be45-d352ff7e1e75" /> After: <img width="1313" alt="Screenshot 2025-03-27 at 16 49 57" src="https://github.com/user-attachments/assets/baa41183-6d97-4f46-98b4-012ef2b489f4" /> (cherry picked from commit c6acecf) # Conflicts: # x-pack/solutions/observability/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/waterfall/waterfall_item.tsx
# for free
to join this conversation on GitHub.
Already have an account?
# to comment
In the example above we see that the
GETbar is not properly aligned to its parent. It's pushed a bit to the right due to the left padding.Solution:
We need to adjust the bar size to discount the size of the padding added.
This is the payload for tests
``` { "name": "GET", "context": { "trace_id": "0x5c7e945a22d62bd868f193a93557a139", "span_id": "0xc10f49189c4ad5dc", "trace_state": "[]" }, "kind": "SpanKind.CLIENT", "parent_id": "0x84f05cf2f3048d52", "start_time": "2024-03-25T14:22:44.199622Z", "end_time": "2024-03-25T14:22:44.354087Z", "status": { "status_code": "UNSET" }, "attributes": { "http.method": "GET", "http.url": "https://otel-python.es.europe-west9.gcp.elastic-cloud.com/", "http.status_code": 200 }, "events": [], "links": [], "resource": { "attributes": { "telemetry.sdk.language": "python", "telemetry.sdk.name": "opentelemetry", "telemetry.sdk.version": "1.23.0", "service.name": "otel-test", "service.version": "0.1", "deployment.environment": "production", "telemetry.auto.version": "0.44b0" }, "schema_url": "" } } { "name": "info", "context": { "trace_id": "0x5c7e945a22d62bd868f193a93557a139", "span_id": "0x84f05cf2f3048d52", "trace_state": "[]" }, "kind": "SpanKind.INTERNAL", "parent_id": "0x51972000aec0e19d", "start_time": "2024-03-25T14:22:44.199510Z", "end_time": "2024-03-25T14:22:44.354181Z", "status": { "status_code": "UNSET" }, "attributes": { "http.request.method": "GET", "db.system": "elasticsearch", "db.operation": "info", "url.full": "[https://otel-python.es.europe-west9.gcp.elastic-cloud.com:443/](https://otel-python.es.europe-west9.gcp.elastic-cloud.com/)", "server.address": "otel-python.es.europe-west9.gcp.elastic-cloud.com", "server.port": 443, "db.elasticsearch.cluster.name": "5f121400ac014744bfffece4da1aeaf6", "db.elasticsearch.node.name": "instance-0000000000" }, "events": [], "links": [], "resource": { "attributes": { "telemetry.sdk.language": "python", "telemetry.sdk.name": "opentelemetry", "telemetry.sdk.version": "1.23.0", "service.name": "otel-test", "service.version": "0.1", "deployment.environment": "production", "telemetry.auto.version": "0.44b0" }, "schema_url": "" } } { "name": "POST", "context": { "trace_id": "0x5c7e945a22d62bd868f193a93557a139", "span_id": "0xb7679f01c469f3ca", "trace_state": "[]" }, "kind": "SpanKind.CLIENT", "parent_id": "0x02968f87ac28d08f", "start_time": "2024-03-25T14:22:44.354386Z", "end_time": "2024-03-25T14:22:44.902202Z", "status": { "status_code": "UNSET" }, "attributes": { "http.method": "POST", "http.url": "https://otel-python.es.europe-west9.gcp.elastic-cloud.com/logs-*/_search", "http.status_code": 200 }, "events": [], "links": [], "resource": { "attributes": { "telemetry.sdk.language": "python", "telemetry.sdk.name": "opentelemetry", "telemetry.sdk.version": "1.23.0", "service.name": "otel-test", "service.version": "0.1", "deployment.environment": "production", "telemetry.auto.version": "0.44b0" }, "schema_url": "" } } { "name": "search", "context": { "trace_id": "0x5c7e945a22d62bd868f193a93557a139", "span_id": "0x02968f87ac28d08f", "trace_state": "[]" }, "kind": "SpanKind.INTERNAL", "parent_id": "0x51972000aec0e19d", "start_time": "2024-03-25T14:22:44.354254Z", "end_time": "2024-03-25T14:22:44.902647Z", "status": { "status_code": "UNSET" }, "attributes": { "http.request.method": "POST", "db.system": "elasticsearch", "db.operation": "search", "db.elasticsearch.path_parts.index": "logs-*", "db.statement": "{\"query\":{\"match_all\":{}}}", "url.full": "[https://otel-python.es.europe-west9.gcp.elastic-cloud.com:443/logs-*/_search](https://otel-python.es.europe-west9.gcp.elastic-cloud.com/logs-*/_search)", "server.address": "otel-python.es.europe-west9.gcp.elastic-cloud.com", "server.port": 443, "db.elasticsearch.cluster.name": "5f121400ac014744bfffece4da1aeaf6", "db.elasticsearch.node.name": "instance-0000000000" }, "events": [], "links": [], "resource": { "attributes": { "telemetry.sdk.language": "python", "telemetry.sdk.name": "opentelemetry", "telemetry.sdk.version": "1.23.0", "service.name": "otel-test", "service.version": "0.1", "deployment.environment": "production", "telemetry.auto.version": "0.44b0" }, "schema_url": "" } } { "name": "/", "context": { "trace_id": "0x5c7e945a22d62bd868f193a93557a139", "span_id": "0x51972000aec0e19d", "trace_state": "[]" }, "kind": "SpanKind.SERVER", "parent_id": null, "start_time": "2024-03-25T14:22:44.199093Z", "end_time": "2024-03-25T14:22:44.902787Z", "status": { "status_code": "UNSET" }, "attributes": { "http.method": "GET", "http.server_name": "127.0.0.1", "http.scheme": "http", "net.host.port": 8000, "http.host": "127.0.0.1:8000", "http.target": "/", "net.peer.ip": "127.0.0.1", "http.user_agent": "Mozilla/5.0 (X11; Linux x86_64; rv:124.0) Gecko/20100101 Firefox/124.0", "net.peer.port": 47726, "http.flavor": "1.1", "http.route": "/", "http.status_code": 200 }, "events": [], "links": [], "resource": { "attributes": { "telemetry.sdk.language": "python", "telemetry.sdk.name": "opentelemetry", "telemetry.sdk.version": "1.23.0", "service.name": "otel-test", "service.version": "0.1", "deployment.environment": "production", "telemetry.auto.version": "0.44b0" }, "schema_url": "" } } ```The text was updated successfully, but these errors were encountered: