Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: DAG default zoom cuts off some node label text #2060

Open
yurishkuro opened this issue Dec 18, 2023 · 12 comments
Open

[Bug]: DAG default zoom cuts off some node label text #2060

yurishkuro opened this issue Dec 18, 2023 · 12 comments

Comments

@yurishkuro
Copy link
Member

yurishkuro commented Dec 18, 2023

What happened?

When viewing System Architecture | DAG for HotROD graph, the label for "redis-manual" node only shows "redis-" text, and there is no way to zoom out more.

image

Steps to reproduce

  1. Download https://github.com/jaegertracing/jaeger/blob/main/examples/hotrod/docker-compose.yml file and run the HotROD example
  • JAEGER_VERSION=1.52 docker compose -f examples/hotrod/docker-compose.yml up
  1. Generate one trace from HotROD: http://localhost:8080
  2. Run dev version of the UI: yarn start, type o and press ENTER
  3. In the dev UI go to System Architecture | DAG http://localhost:5173/dependencies

Expected behavior

All text labels should be visible.

Proposal

The calculation of the default 100% zoom should be fixed so that the graph is not so large. Perhaps there should be a max node size, or max label font size. E.g. on my monitor the font of the labels is about 2x of the font of the rest of the text in the UI, it's not necessary to zoom in so closely by default. Note that this only affects small graphs, with larger graphs we have the opposite effect (#1981 (comment)), so if we can fix it in the same way then great, but it's not the primary objective of this ticket.

@Chinmay-Deo-2004
Copy link

I would like to help with this issue. I'm running the project on a windows-11 machine.

I got a trace from HotROD running on my localhost at port 8000 (8080 was unavailable on my machine.) and got this result:
image

I'm unsure of what is meant by running the dev version of the UI using yarn start. Could you please provide more details for this step?

@yurishkuro
Copy link
Member Author

yarn start is how you run the local build of the UI. See the README.

@Chinmay-Deo-2004
Copy link

I followed along the steps to reproduce the bug, and I'm getting this output at the trace.
image
What do I need to do to get the required result?

@Wise-Wizard
Copy link
Contributor

I ran the steps mentioned above, and on my local the screen is showing a fine result with no text being cut-off
Screenshot 2023-12-21 174322

@Wise-Wizard
Copy link
Contributor

Even toggling to a smaller screen does not cut the text off
Screenshot 2023-12-21 174535

@Chinmay-Deo-2004
Copy link

I reran the code fixing some syntactical errors on my side. I was able to successfully reproduce the bug:

image

I'll work on fixing it.

@Wise-Wizard
Copy link
Contributor

I ran the steps mentioned above, and on my local the screen is showing a fine result with no text being cut-off Screenshot 2023-12-21 174322

What browser are you using? It could be possible that your browser is auto adjusting it for you.

I am using Brave Browser

@Chinmay-Deo-2004
Copy link

I ran the steps mentioned above, and on my local the screen is showing a fine result with no text being cut-off Screenshot 2023-12-21 174322

What browser are you using? It could be possible that your browser is auto adjusting it for you.

I am using Brave Browser

Try using edge or Chrome. Brave has a few extra features, the bug is quite evident on edge, which I am currently running.

@Wise-Wizard
Copy link
Contributor

I tried using Chrome and Edge as well, but it's working fine in both of them!
Screenshot 2023-12-21 175526
Screenshot 2023-12-21 175555

@Chinmay-Deo-2004
Copy link

I tried using Chrome and Edge as well, but it's working fine in both of them! Screenshot 2023-12-21 175526 Screenshot 2023-12-21 175555

That's strange. What OS are you on?

@Wise-Wizard
Copy link
Contributor

I am using Windows

@Wise-Wizard
Copy link
Contributor

Ok, I have identified the fix to this issues, I have forked and running Jaeger UI locally but you are running it on Jaeger-all-in-one service (Port 16686). The fault is in that service providing the UI. This approach will really help you fix this bug I hope!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants