HTML5 Canvas Pivot tree grid

Pivot.js is an open-source javascript HTML5 Canvas based multidimensional UI grid implementation. It allows to draw multidimensional data in tree ordered style. Just get data from server-side and set it in Pivot.js.

• Multilevel column and row headers
• Headers could be organized in tree like style
• Virtual scrolling. Use it for large amounts of data
• Ultrafast scrolling. Up to 60 fps and more
• Low resource utilisation
• No aggregations on client. Data has to be aggregated on your server-side
• Edit events could be handled
• Pure javascript ( ECMAScript 5.1 ). No libraries or frameworks used.
• It’s free, nice and easy!

Demo

Usage example

---

Controls

Mouse click to select cell

Mouse down and move to select area

Use keyboard arrows to shift selection

Shift selected cell by arrow keys to borders to scroll

Mouse wheel to vertical scroll

Type to edit values in selected cell

Ctrl+C to copy values from selected area to buffer

Mouse click on headers with ‘-‘ sign to collapse node

Mouse click on headers with ‘+’ sign to expand node