If your Heatmap screenshot does not render as expected, it's possible that the page width or height is being fixed with Javascript.
Page width fixed with Javascript
Hotjar captures a screenshot at the following divice widths:
Desktop: 1280px
Tablet: 800px
Phone: 380px
If your screenshot appears to be cut-off, you can check to see if Javascript is being used to set a fixed width whenever the browser size changes. If a user visits a page on your site with a fixed browser width that is not the required width the Hotjar screenshot tool uses, then the screenshot may not render correctly.
Possible solution: You can try retaking the screenshot in-app. Alternatively, you can set up future Heatmaps using the Heatmap delay workaround. This will allow you to manually capture the screenshot yourself when you create a new heatmap.
Page height fixed with Javascript
Your page may have some elements with 100% of the browser height which could be set using JavaScript. Hotjar takes page screenshots in a single large window and these types of elements can continue enlarging, rendering the screenshot incorrectly.
Possible solution: You may need help from your development team to look into this issue. It can sometimes be fixed by setting a maximum value for your height calculation (this can be a value you choose, up to 1200). Setting a limit can help address this problem.
viewportHeight = (viewportHeight > 1200) ? 1200 : viewportHeight;
// - or - //
if (viewportHeight > 1200) {
viewportHeight = 1200;
}
Heatmaps will not show the full screenshot on pages that are larger than 15,000 pixels in height
As mention in our Heatmap Limitations, pages with a height that is greater than 15,000 pixels will not fully render. Pages longer than this will be cropped to this point.