I have a requirement where I need to take screenshot of the viewport and use it later.
Issue is, user can interact with page and add/delete elements. Over that, if an element is partially visible, I need to capture that only.
I have tried
- HTML2Canvas
- WebRTC
Issue with this HTML2Canvas take screenshot of an element. So if part of element is not visible, even that is added.
Issue with WebRTC is, first it requires permission from user. So if user declines it, my code will fail. Apart from that, it takes screenshot of entire screen and not just viewport.
So, is there a way where you can take screenshot of viewport?
Foe example, in below example, if you run in SO's output window, you will see the scroll. So given position at top, I just want to capture the visible content and not the entire div.
.container {
display: flex;
flex-direction: row;
}
.container > div {
padding: 5px;
margin: 5px;
border: 1px solid gray;
font-size: 2em;
}<div class='container'>
<div>
Paragraphs are the building blocks of papers. Many students define paragraphs in terms of length: a paragraph is a group of at least five sentences, a paragraph is half a page long, etc. In reality, though, the unity and coherence of ideas among sentences is what constitutes a paragraph. A paragraph is defined as “a group of sentences or a single sentence that forms a unit” (Lunsford and Connors 116). Length and appearance do not determine whether a section in a paper is a paragraph. For instance, in some styles of writing, particularly journalistic styles, a paragraph can be just one sentence long. Ultimately, a paragraph is a sentence or group of sentences that support one main idea. In this handout, we will refer to this as the “controlling idea,” because it controls what happens in the rest of the paragraph.
</div>
<div>
Paragraphs are the building blocks of papers. Many students define paragraphs in terms of length: a paragraph is a group of at least five sentences, a paragraph is half a page long, etc. In reality, though, the unity and coherence of ideas among sentences is what constitutes a paragraph. A paragraph is defined as “a group of sentences or a single sentence that forms a unit” (Lunsford and Connors 116). Length and appearance do not determine whether a section in a paper is a paragraph. For instance, in some styles of writing, particularly journalistic styles, a paragraph can be just one sentence long. Ultimately, a paragraph is a sentence or group of sentences that support one main idea. In this handout, we will refer to this as the “controlling idea,” because it controls what happens in the rest of the paragraph.
</div>
</div>References of my research:
