layer_elements
<pre><code class="language-plantuml">@startsalt
!$size = 12
!$color = yellowgreen
scale 1.5
{
{T
+ @/lib/fabric/src/schemeIns.js
++ <font size=$size color=$color><&folder></font> **schemeIns**
+++ index.js
+++ <font size=$size color=$color><&folder></font> schemes
++++ default.js
++ <font size=$size color=$color><&folder></font> **zGroup**
+++ index.js
+++ <font size=$size color=$color><&folder></font> watermark
++++ watermark-default.js
++++ watermark-other.js
+++ <font size=$size color=$color><&folder></font> logo
++++ logo-default.js
++++ logo-other.js
}
}
@endsalt</code></pre>
<pre><code class="language-plantuml">!theme spacelab
skinparam backgroundColor #FCFCFC
start
partition class {
partition defaultOptions {
split
:module;
split again
:style/scheme;
split again
:top,left,width,height;
end split
}
partition render(opt,callback) {
:defaultOptions.head -> opt.head;
partition head {
split
#555:type;
split again
#555:top;
split again
#555:left;
split again
#555:width;
split again
#555:height;
end split
}
:defaultOptions.logo -> opt.logo;
partition logo {
split
#555:type;
split again
#555:top;
split again
#555:left;
split again
#555:width;
split again
#555:height;
end split
}
}
partition toDataUrl {
:eee;
}
}
stop
</code></pre>
<pre><code class="language-plantuml">@startwbs
!theme spacelab
skinparam backgroundColor #FCFCFC
+ 合成器
++ 海报合成器
++ 封面合成器
+++ defaultOptions
++++_ watermark
+++++_ <font color=red>**style**</font>
+++++_ top
+++++_ left
+++++_ width
+++++_ height
----_ head
+++++_ style
+++++_ top
+++++_ left
+++++_ width
+++++_ height
+++_ toDataUrl(itemData,options)
++++_ itemData
---- options
+++++_ watermark
++++++_ style
++++++_ top
++++++_ left
++++++_ width
++++++_ height
-----_ head
++++++_ style
++++++_ top
++++++_ left
++++++_ width
++++++_ height
+++_ render(itemData,options)
++ 层元素组合
+++_ watermark水印
++++_ <font color=red>**style**</font>1水印样式1
++++_ style2水印样式2
+++_ head头像
++++_ style1头像样式1
++++_ style2头像样式2
legend center
层元素组合支持多样式选择（根据style）
options配置覆盖：层元素layer_pos → 合成器defaultOptions
判断自动定位或用户移动定位autoPosition？
end legend
@endwbs
</code></pre>
<h3>背景图</h3>
<pre><code class="language-plantuml">!theme bluegray
skinparam backgroundColor #FCFCFC
start
:activity;
stop
</code></pre>
<h3>Logo</h3>
<pre><code class="language-plantuml">!theme bluegray
skinparam backgroundColor #FCFCFC
start
:activity;
stop
</code></pre>
<h3>二维码</h3>
<pre><code class="language-plantuml">!theme bluegray
skinparam backgroundColor #FCFCFC
start
:activity;
stop
</code></pre>
<h3>水印</h3>
<pre><code class="language-plantuml">!theme bluegray
skinparam backgroundColor #FCFCFC
start
:activity;
stop</code></pre>
<h3>头像</h3>
<pre><code class="language-plantuml">!theme bluegray
skinparam backgroundColor #FCFCFC
start
:activity;
stop
</code></pre>