canvas-datagrid
Version:
Canvas based data grid web component. Capable of displaying millions of contiguous hierarchical rows and columns without paging or loading, on a single canvas element.
48 lines • 1.28 kB
HTML
<html>
<head>
<!-- this file is for developing in a sandbox on a local machine -->
<script src="./developer.js"></script>
<script>
var s = document.createElement('script');
s.src = "../dist/canvas-datagrid.debug.js?cacheBust=" + +new Date();
s.onload = g;
document.head.appendChild(s);
</script>
<meta name="viewport" content="width=device-width">
<style>
html, body {
height: 100%;
min-height: 100%;
margin: 0;
padding: 0;
overflow: auto;
}
.n {
height: 300px;
width: 300px;
position: absolute;
top: 900px;
left: 100px;
overflow: scroll;
}
.grid {
margin-top: 90px;
margin-left: 90px;
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<!-- <div class="grid" id="grid" style="height: 100%;"></div> -->
<div class="n">
<div class="grid" id="grid"></div>
</div>
<!-- <canvas-datagrid
style="background-color: dodgerblue;"
selectionmode="row"
data='[{"a": 1, "b": 2}, {"a": 3, "b": 4}]'>
</canvas-datagrid> -->
</body>
</html>