maotu导入细节
注册参数说明
我们在前面注册图形库的时候，调用了如下方法
leftAsideStore.registerConfig('',[])该参数一共接收两个参数，第一个参数代表图元图形库的分类名称，一般传个中文作为标题就可以了，不过注意名称不要冲突，后注册的名称将会覆盖前面注册的配置。
第二个参数代表该分类下面的图元图形库配置，参数解析如下
| 属性名 | 属性解释 | 是否必填 | 备注 |
|---|---|---|---|
| id | 图元的标识 值必须唯一 | 是 | 当图形类型是vue时，id代表vue组件注册的名称 |
| title | 要显示的标题，一般用中文表示 | 是 | |
| type | 图元的类型 | 是 | 可以传递的值有svg、 vue、 img、 custom-svg，根据要导入的图元图形库自己选择即可 |
| thumbnail | 显示到左侧工具栏时显示的缩略图 | 是 | 当类型是img时，该项属性将被用作图形库图元 |
| svg | 对应svg文件内容 | 否 | 当图形类型是svg的时候，该项为必填值 |
| props | 图形库图元属性 | 是 | 格式说明请查看下面的说明 |
| events | 图元默认执行事件 | 否 | |
| ports | 图元的吸附锚点位置 | 否 |
props说明
props是用来定义图形库动态属性的，比如说我们常常会使用不同的颜色代表不同的图形状态，此时就可以把颜色这个属性定义到props里，结构如下
color: {
type: 'color',
val: '#FF0000', // 默认值
title: '填充色' // 显示到右侧属性面板时的标题
}此时选中图形，在右侧属性栏就可以看到该属性，并可以对属性进行修改
maotu封装了一系列props.type可供选择，可选的值有"number" | "input" | "color" | "select" | "switch" | "jsonEdit" | "textArea"
传递不同的type将会改变属性在右侧属性栏的外观和行为，例如我们传递刚刚传递的color，将会在右侧以颜色选择器的方式展现
props还有两个可选参数，分别是options和disabled
options通常搭配select类型使用，用来存放下拉框的选项值，例如下面的结构
fontFamily: {
title: '字体',
type: 'select',
val: '黑体',
options: [
{
value: '黑体',
label: '黑体'
},
{
value: '宋体',
label: '宋体'
}
]
}上面的结构展示出来的效果如下：
disabled是一个布尔类型，如果为true，将不会显示到右侧属性面板里，但是仍然可以通过代码修改属性
导入svg文件的细节说明
我们在前面导入svg文件的时候，发现props里面定义了
fill: {
type: 'color',
val: '#FF0000',
title: '填充色'
}此时我们便可以在右侧属性面板对该图形的颜色做一些控制
maotu内部针对svg文件做了支持，这样用户只需要对svg文件注册，而无需编写代码即可实现动态去修改svg本身的一些属性，目前已知支持的有：
fillfill-opacitystrokestroke-width
我们在前面导入自定义svg中讲到：直接导入svg文件的时候，创建出来的图形库所有节点的属性都是统一设置的
拿fill举例，有可能一些场景我们并不需要同时设置所有路径的fill，这时候我们只需要在svg文件里指定好固定颜色，这样就不会更新其颜色了，比如说下面的文件，我们将外部圆形的颜色固定为蓝色:
<svg width="557" height="554" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
<g>
<path
d="m279,38.19467a238.80533,238.80533 0 1 1 -238.80533,238.80533a238.80533,238.80533 0 0 1 238.80533,-238.80533m0,-38.528a277.33333,277.33333 0 1 0 277.33333,277.33333a277.33333,277.33333 0 0 0 -277.33333,-277.33333z"
fill="blue"
id="circle1"
/>
<path
id="line1"
d="m436.15733,143.928a14.67733,14.67733 0 0 0 -12.8,7.44533a96,96 0 0 1 -137.10933,24.66134a125.09867,125.09867 0 0 0 -188.032,24.14933a14.208,14.208 0 0 0 -1.28,2.13333a5.80267,5.80267 0 0 0 -0.66133,1.408a14.656,14.656 0 0 0 24.14933,15.68a6.272,6.272 0 0 0 1.28,-1.49333a96.832,96.832 0 0 1 13.248,-16.49067a95.76533,95.76533 0 0 1 124.62933,-9.30133a125.07733,125.07733 0 0 0 189.26934,-26.176a5.824,5.824 0 0 0 0.68266,-1.49333a14.63467,14.63467 0 0 0 -13.44,-20.43734l0.064,-0.08533z"
/>
<path
id="line2"
d="m440.15733,239.928a14.67733,14.67733 0 0 0 -12.8,7.44533a96,96 0 0 1 -137.10933,24.66134a125.09867,125.09867 0 0 0 -188.032,24.14933a14.208,14.208 0 0 0 -1.28,2.13333a5.80267,5.80267 0 0 0 -0.66133,1.408a14.656,14.656 0 0 0 24.14933,15.68a6.272,6.272 0 0 0 1.28,-1.49333a96.832,96.832 0 0 1 13.248,-16.49067a95.76533,95.76533 0 0 1 124.62933,-9.30133a125.07733,125.07733 0 0 0 189.26934,-26.176a5.824,5.824 0 0 0 0.68266,-1.49333a14.63467,14.63467 0 0 0 -13.44,-20.43734l0.064,-0.08533z"
/>
<path
id="line3"
d="m444.15733,336.928a14.67733,14.67733 0 0 0 -12.8,7.44533a96,96 0 0 1 -137.10933,24.66134a125.09867,125.09867 0 0 0 -188.032,24.14933a14.208,14.208 0 0 0 -1.28,2.13333a5.80267,5.80267 0 0 0 -0.66133,1.408a14.656,14.656 0 0 0 24.14933,15.68a6.272,6.272 0 0 0 1.28,-1.49333a96.832,96.832 0 0 1 13.248,-16.49067a95.76533,95.76533 0 0 1 124.62933,-9.30133a125.07733,125.07733 0 0 0 189.26934,-26.176a5.824,5.824 0 0 0 0.68266,-1.49333a14.63467,14.63467 0 0 0 -13.44,-20.43734l0.064,-0.08533z"
/>
</g>
</svg>然后修改颜色的时候将不会再修改圆形的颜色了
