@tsteur opened this Issue on September 8th 2022 Member

I'm on /index.php?module=CoreHome&action=index&idSite=12&period=week&date=today#?idSite=1&period=month&date=2022-08-26&category=General_Actions&subcategory=General_Pages

Then I change visualisation to "Display a table with goal metrics".

Then I scroll down.

Expected: The header row stay on top always visible when scrolling down.

Actual: The header row becomes invisible once you scroll down too far.

Then the visualisation becomes almost impossible to use since you never really know which value is for what goal etc. In the regular Table view the header row remains sticky but not for this visualisation.

@sgiehl commented on September 8th 2022 Member

@tsteur That is actually kind of expected behaviour. The problem is, that the sticky header doesn't work in combination with a x-scroll. So this should actually not only be an issue of the goal viz, but all reports that are wider then available space.

@peterhashair commented on September 9th 2022 Contributor

To completely fix this, maybe we can use a bootstrap 5 library (https://examples.bootstrap-table.com/#extensions/sticky-header.html), but we have to convert the table js quite a bit.

@sgiehl commented on September 9th 2022 Member

@peterhashair Does that lib support having sticky header and a sticky first column?

@peterhashair commented on September 11th 2022 Contributor
@sgiehl commented on September 12th 2022 Member

@peterhashair If you have a look at their implementation details, having sticky header and a sticky first column does not work there as well. At least it is no native support. They are using a sticky header only. The sticky first column is "simulated" by copying the full first column into a new table, that is then positioned absolute above the original table. The scrolling of both tables is then also synced using javascript.

That might be something we could also implement on our own. But iirc we didn't implement something like that initially, as it would be a lot more effort. See https://github.com/matomo-org/matomo/pull/18124

Powered by GitHub Issue Mirror