@cniot/canvas2flex

canvas画布中的绝对位置转换成flex布局，适应动态缩放能力

TODO:

1. 抽离核心代码
2. fixed布局支持（重要）在canvasConfig里增加一个position参数
3. 绝对定位支持
4. 使用rollup打包
5. 最小最大高度解析
6. 自适应规则（宽度按照百分比来算，高度改成min-height）
7. 高度相等的时候，出现了丢元素的情况

使用方式

import {transformMethod} from '@cniot/canvas2flex'
let res = transformMethod(data);
let {finalTransData} = res; // finalTransData里就包含了转换过后的所有数据

转换后字段含义：

{
    "start":0, // 起始位置
    "end":36, // 终止位置
    "children":[], // 子元素列表
    "type":"horizontal", // 横切还是纵切
    "proportion":"0.05000", // 这个元素占这一层元素的比例（用来计算宽度百分比）
    "canvasConfig":{
      "y":0,
      "height":36
    },//起始位置和高度
    "level":1, // 层级
    "isFillComponent":true, // 是不是一个填充元素
    "flexLayout":{
    "display":"flex",
      "flexDirection":"row",
      "flexGrow":0,
      "flexShrink":0,
      "minWidth":"0px",
      "height":"36px"
    }, // 这个元素的样式
    "tagName":"div" //只要是填充元素，tagName就是div
}

更新日志

###0.0.11:

1. 增加zIndex布局支持

0.0.9:

1. 修复图片不显示的问题
2. 增加lockedWidth/lockedMarginRight/lockedMarginLeft 三个属性，用来锁定边距