Q2: Development (50 points) Designing and implementing a direct manipulation based technique for splitting a matrix. Given a matrix with 20 rows and 16 columns, you should design a direct manipulation technique on it, so you can split it into several matrices in a smaller size. Specifically, your tasks are: 1) Show a 20 x 16 matrix on a web page, 2) Design and implement direction manipulations on this matrix, 3) Via such manipulations, this matrix can be split into two or more smaller matrices. Implement your design with web-based techniques (e.g., D3.js). In the webpage, you can only show a 20 x 16 matrix and the matrices after splitting. Using UI widgets is NOT allowed. You should write a paragraph in the webpage to explain what a user can do to split the matrix. Regarding to the development part, you should use good software engineering practices. Comment your code, use consistent formatting, use meaningful variable names, etc.

Fig: 1