dom-to-css-layout
Converts a tree of DOM elements into a JSON blob compatible with Facebook's css-layout
Makes use of style-to-json to parse CSS rules that apply to elements in a tree, and traverses all child nodes of an element to build the full tree. This can then be put into css-layout and can be used to do layout with pure JavaScript (for canvas rendering for example) while leveraging the browsers CSSOM and plain old stylesheets and DOM.
For a list of all supported attributes, see css-layout. Note that valid units are required in the CSS, but will get stripped during the conversion.
use
npm install --save dom-to-css-layout
index.html
Text gets ignored
style.css
index.js
var toLayout = ;var exampleElement = document; var layout = ;
Layout will look like
{ "style": { "padding": 50 }, "children": [{ "style": { "padding": 10, "alignSelf": "stretch" }, "children": [] }]}