-
Notifications
You must be signed in to change notification settings - Fork 27
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
tooltips are shown in the background overlay if a gosling component is placed in a modal dialog #528
Comments
I adjusted the z-index of this dialog from 10 to 2. This problem has been solved. |
Great to hear that you found a way to address the issue. The CSS class names of the tooltip are the following, so you can override the z-index of the tooltips in your application: <div class="track-mouseover-menu HiGlass-module_track-mouseover-menu-1AoaP">...</div> /* override styles of tooltips */
.track-mouseover-menu {
z-index: 1;
} Original CSS styles of the tooltips defined in HiGlass: |
@sehilyi Higlass can expand or shrink its plots when the screen size changes, so I want to expand the gosling component to fill the width of the parent container. Should the width properties of tracks be specified in pixels? How can I do that? Thanks, |
Hi Zhen, You could use the One limitation depending on your use case might be that upon the resize, the zoom level is unchanged, instead, the |
What I really want is that dragging the browser window border performs the resize of the gosling element, not using slider. Can pure css approach this? Zhen |
The slider is one example, and you could instead capture the resize event of the container of // Change the width upon resize event of the browser
useEffect(() => {
window.addEventListener(
"resize",
debounce(() => {
setVisPanelWidth(
window.innerWidth - CONFIG_PANEL_WIDTH - VIS_PADDING * 2
); // this value is used to set `width` of a track when updating spec
}, 500) // wait for 500ms instead of updating right away
);
}, []);
The pure CSS approach is not supported at the moment. |
I've created a new GitHub issue, and we can discuss further there #550 |
A tooltip is displayed in the region marked by a red box in the following figure. How can the tooltip be shown in a modal dialog instead?
Can you make the gosling component responsive? The size of views is automatically adjusted to match different device resolutions.
Zhen
The text was updated successfully, but these errors were encountered: