Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Display bugs with rotated labels

See original GitHub issue

Original change in https://github.com/facebookresearch/hiplot/pull/213 Workaround: Use version <= 0.1.28

hi there. I’ve tried to track down which recent changes to hiplot resulted in my plots getting significantly harder to read, and narrowed it down to 0.1.28 -> 0.1.29 and believe this is the PR responsible.

This perfectly readable and stacked display: turned into which cuts off the final column name if I make the window any more narrow and causes a weird spacing issue on the right-side.

I very much support improving the visual interface of hiplot but I believe this hurt the overall experience. Would you be open to discussing some of the changes made here and perhaps a partial revert? Or am I best served maintaining a separate fork of the project? (I am not a front-end developer but am trying very hard to use hiplot in a tool I am building).

The above screenshots were in Opera (I’ve noticed Safari has had existing trouble with dragging columns). I also noticed that on Safari, this same change resulted in “ghosting” of the headers upon scrolling (and did not fix the aforementioned problem):

(that’s the “rearranging” problem in safari I mentioned, the annotation divorces from the column)

(original report in https://github.com/facebookresearch/hiplot/pull/214 from @mathematicalmichael )

Issue Analytics

State:
Created 2 years ago
Comments:11 (6 by maintainers)

Top GitHub Comments

1reaction

danthe3rdcommented, Oct 28, 2021

ah I see. that makes a lot of sense. since my data is generated from a uniform distributions, the transformations are barely perceptible. The extreme example is helpful to understand when this would be desirable for readability.

so regarding the unreadability issue for long numbers, is the proposed action to scale them to exp notation? seems like it’ll solve that problem for sure.

Yes I believe that’s the correct solution

as for the rotated labels, 90º rotations would solve all the problems except that it probably wont look very nice. taking away space from the columns for a label is not ideal either. so, special rules to handle spacing at the rightmost-side?

Currently the rotation angle depends on the number of columns (more rotation for more columns). The rightmost column has its font-size scaled down so it fits on the screen

what if the language being used for annotation labels is written right-to-left, I suppose that would mean that you’d handle it similarly on the left side instead?

That’s indeed something I didn’t try at this point, and I don’t believe it works out of the box …

0reactions

danthe3rdcommented, Nov 5, 2021

Hi @mathematicalmichael

Sure. Can you follow the instructions here to get started with developing HiPlot? (let me know if something is unclear, so I can update the doc accordingly)

Then what you want to modify is: (1) The right margin (2) The actual rotation angle (and maybe the font size as well) https://github.com/facebookresearch/hiplot/blob/69300173553b3b687b6baf3b06be9e35543157c6/src/parallel/parallel.tsx#L692-L693

Top Results From Across the Web

issues with displaying rotated labels using text() - Stack Overflow

Since labels titles are quite long I intended to rotate them using the text() function but I cannot get it to display correctly....

Problem: Labels do not rotate when the data frame is rotated

Open the General tab, and check the 'Rotate point and polygon labels when data frame is rotated' check box in the Data Frame...

584990 - Rotated Text not displaying correctly - chromium

Text for each state should be rotated to be read from bottom to top. View in Safari or Firefox to see correct behavior....

FusionCharts - Display labels in rotated mode with ... - JSFiddle

1. <!-- ; 2. Display labels in rotated mode with slant. ; 3. ; 4. Attributes: ; 5. # labelDisplay - Rotate...

How to fix the rotated label position in this plot? - Julia Discourse

Hi, I cannot figure how to correct the position of the rotated xticks label in the following plot: ... tickfont=font(12),guidefont=font(12)) display(plt).