higlass

higlass copied to clipboard

would be really nice to be able to easily view a symmetric square region of the genome. thanks!

Could you please elaborate a little bit? What if your browser window is not square?

Perhaps you could post a screenshot of a mockup of what the desired output should look like?

so should be able to make square regions as an option, ie. having the diagonal of the heatmap intersect the upper left and lower right corner, which it doesn't necessarily do even if the defined region is square.... let me know if this makes any more sense. thanks!

Ah, I see. Thanks for the clarification. I'll try to get to that in the near future. By the way, is that how the gene annotations appear for you? They look overly large.

I think the main issue is the automatic vertical stretching of views to fill the container element, which prevents you from making two perfectly square matrix views. Here's a hack to try to do this on my vertical monitor by adding an empty view underneath, though I can't get the width and height of the center view to be exactly the same.

Just want to bump this, would be very useful to create illustrations.

One way to achieve this might be to dynamically add empty tracks or margins that are automatically adjusted to keep the center heatmap square 🤔

What I have done for a couple applications is to embed the React HiGlassComponent component into a parent React application, and modify the child component based on what is going on around it.

The HiGlassComponent viewConfig property references a viewconf that is stored as a state property in the parent React application.

I attach an event listener that listens for browser window resize events, which triggers a function, which measures the browser dimensions and adjusts height properties of views inside the viewconf. The application state is then updated with the adjusted viewconf, and this redraws the HiGlass component.

In my case, the HiGlass component width is the full width of the browser, but its height (and the height of specific tracks within the viewconf) is determined and recalculated, depending on the browser window height.

In your case, you might adjust width and height based on what visual appearance you need, so that they are equal and, perhaps, are some minimum or maximum, depending on other UI components in or layout properties of your application. In addition, if you wanted the matrix to always be aligned to the diagonal, I think you could also set initialXDomain and initialYDomain properties to be equal.