基于JavaScript矩阵数据自动布局的方法

本发明公开了一种基于JavaScript矩阵数据自动布局的方法，步骤为：S1创建矩阵容器：自行定义一个HTML元素作为矩阵容器，并创建一个栅格容器；S2数据处理：对于多源数据进行格式处理；S3数据结构处理：判断数据是否为树形数据结构，若是则进行数据递归处理并数据分组后转至步骤S4，若不是则直接转至步骤S4；S4单数据项配置：配置数据属性和状态；S5用户交互：初始化数据状态属性，再判断是否开始用户交互，若是则进行拖拽、状态变更、缩放后，获取数据属性的变更，并修改源数据后进行数据呈现；否则，直接进行数据呈现。解决了树形和扁平化数据相兼容呈现。