-
-
Notifications
You must be signed in to change notification settings - Fork 23
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
Overlapping text on adjacent spans that also overlap #15
Comments
It seems to be preferable to use the waterfall plugin for this situation - move your requests data to the waterfall section on initialization and all will be fine.) The flame chart (as a concept, not this project) does not allow situations where you can have two nodes overlap in duration. |
It's still the best visualization for the idea of a trace however. the difference being the concept of async function calls. real world data HAS async function calls so ensuring this can support those visualizations cleanly is ideal. Even modern javascript has the concept of async calls now. |
those async functions are awaited time, maybe that time could be colored with some diagonal lines to represent them as async |
so... while we have all been discussing this.. this DOES allow you to have overlapping time frames... I'm doing some final testing but I believe I've got all the cases figured out to support it smoothly. My coming PR also simplifies the render to a single render queue that is called sequentially rather than having 3 render queues that are called sequentially. It was the 3 render queues that caused the issue here as the text renders occurred after ALL the rectangle renders. This mean for the canvas. it placed text over everything even though the calls to add to queue happened in a different order. By collapsing the queues to a single one we can render in order with the expectation that last in wins. Additionally adding in a simple fix to properly grab the hit-region for overlapping spans. It's pretty slick and the changes look to be just as performant. PR incoming soon. |
…ct hit boxing and text to also overlap * Updated render queues to be a single render queue * Updated hit box searching to find the last hit rather than the first hit under assumption that last hit is the region 'on top' * Fixed waterfall text render to occur after rectangle render
Could you provide a code snippet that would cause such a trace with overlapping frames? |
I updated the demo to randomly generate such an example. i.e. during generation of frames it will randomly create a frame that overlaps. |
yes. but that is manually generated data. |
Ok, I think there is a misunderstanding here, so I will put it this way Or is this not about javascript at all? |
this is not javascript... these are server traces of things being profiled like a php, ruby, python, dotnet or java application etc... The flame chart visualization works wonderfully for these types of representations and thats what I use if for. |
I think we should find another solution for this case. As I saw in the PR that you opened, the current solution breaks core engine optimizations and looks like it doesn't solve the problems you want to solve. I think it's preferable to use something like logic in waterfall data with intervals and timings in the same node. Because the case where we have two or more nodes in the same period also breaks the timeframe plugin logic (in the top plugin in the UI you can see broken line on your screenshot) and possibly broken tree cluster logic. |
If you check the picture that I posted above, the diagonal lines are what we achieved with intervals. |
Is this fix released? |
@fizerkhan No.( |
@pyatyispyatil Thanks for the quick response. In Telemetry data, more than one span can have the same start time and different duration due to its async nature. If you have a better solution, Please suggest it. We will work on it and give you the PR request. |
I think you need to combine the use of waterfall chart and flame chart. In waterfall you can display multiple independent spans with intersecting timelines, and in turn in the flame chart you can display their “content” If your asynchrony involves multi-threaded execution of spans, that is, each span can execute its own code, then most likely you need to use several independent flame charts and display data in them depending on the thread. There is a similar thing in the examples. |
When 2 adjacent spans have starts and durations that cause an overlap, the first spans text is not occluded by the second span. See the top highlighted call out in the image above.
NOTE: This is a holder issue for me as I'm going to try and fix it myself.
The text was updated successfully, but these errors were encountered: