Implementing a search for virtual scrolling

Question

I have no code to produce on this, this is research. I work with angularjs and I want to create a specific data grid. This data file can display large data (over 1 million). Therefore, I get data on a set. My problem is that I don't want a page selector or infinite scroll, but I need a virtual scroll. A simple solution is to calculate the height of the scroll bar, depending on how many lines are multiplied by the height of the line, and it works. But lately, I have a new task: the row height depends on the data, and I can not determine the "standard" row of rows to calculate the scroll height.

I am searching on the Internet, but the problem seems to be resolved only when choosing a page selector. So, do you have any ideas to achieve this? or any link implementation based on my fix?

Thank you for your help and I hope my question is clear.

PS: I don’t know?

Answer 1

I'm not sure about ag-grid, but the kendo grid will serve your purpose. Below is a link to download more data using virtual scrolling in kendo

local data - http://demos.telerik.com/kendo-ui/grid/virtualization-local-data

deleted data - http://demos.telerik.com/kendo-ui/grid/virtualization-remote-data .

HTML , http://htmltreegrid.com/Home/Demo . HTML .

Answer 2

... ..

:

<input type="button" onclick="rowHeights();" value="Row Heights">
    <table id="rowHeight" border="1">
        <tr>
            <td>
               Column One<br />
               Big Column
            </td>

            <td>
               Column Two
            </td>
        </tr>
        <tr>
            <td>
               Second row column 1
            </td>
        </tr>
    </table>

JavaScript:

function rowHeights() {
        var tbl = document.getElementById('rowHeight').rows;
        alert("First Row Height: " + tbl[0].offsetHeight);
        alert("Second Row Height: " + tbl[1].offsetHeight);
        //all row height
        var allrowHeight = 0;
        for (var i = 0; i < tbl.length; i++) {
            allrowHeight += tbl[i].offsetHeight;
        }
        alert("Total Row Height: " + allrowHeight);
    }

, . JsFiddle: https://jsfiddle.net/x1Luxb5a/

Answer 3

, :

/

.

, , , , .

, , , . .

: - . .

: https://www.ag-grid.com/angular-grid-virtual-paging/virtualPaging.html

: https://www.ag-grid.com/angular-grid-virtual-paging/

Answer 4

You need to calculate it approximately. Estimate the average line height, if the line height is similar to either the backend, while saving the record, calculate approximately the line height and save it in the database (for example, based on the length of the text). And then, when you download the data, you can summarize all the heights and get them from the server.