leafer-ui 1.0.10 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +184 -6
- package/dist/web.cjs +32 -67
- package/dist/web.esm.js +32 -67
- package/dist/web.esm.min.js +1 -1
- package/dist/web.js +185 -457
- package/dist/web.min.cjs +1 -1
- package/dist/web.min.js +1 -1
- package/dist/web.module.js +185 -455
- package/dist/web.module.min.js +1 -1
- package/package.json +11 -11
package/README.md
CHANGED
|
@@ -16,15 +16,15 @@
|
|
|
16
16
|
|
|
17
17
|
## 快速入门
|
|
18
18
|
|
|
19
|
-
[1. 准备在线 Playground 环境](https://leaferjs.com/ui/guide/runtime.
|
|
19
|
+
[1. 准备在线 Playground 环境](https://leaferjs.com/ui/guide/runtime.html)
|
|
20
20
|
|
|
21
21
|
可通过 **Cloud Studio** 模版创建一个 **LeaferJS 项目**，用于运行、练习后续的示例代码。
|
|
22
22
|
|
|
23
|
-
[2. 学习 LeaferJS 快速入门教程](https://leaferjs.com/ui/guide/basic/app.
|
|
23
|
+
[2. 学习 LeaferJS 快速入门教程](https://leaferjs.com/ui/guide/basic/app.html)
|
|
24
24
|
|
|
25
25
|
跟随官网教程步骤（文档底部有下一步引导按钮）从浅到深的学习，动手调试每一段示例代码。
|
|
26
26
|
|
|
27
|
-
[3. 开发一个画龙点睛的小游戏](https://leaferjs.com/ui/contest/guide.
|
|
27
|
+
[3. 开发一个画龙点睛的小游戏](https://leaferjs.com/ui/contest/guide.html)
|
|
28
28
|
|
|
29
29
|
给你一条会飞的龙，看你能做出什么好玩的小游戏分享给我们 ◠‿◠
|
|
30
30
|
|
|
@@ -34,15 +34,16 @@
|
|
|
34
34
|
|
|
35
35
|
## 场景包
|
|
36
36
|
|
|
37
|
-
高效绘图场景，推荐安装更轻量的 [leafer-draw](https://leaferjs.com/ui/guide/
|
|
37
|
+
高效绘图场景，推荐安装更轻量的 [leafer-draw](https://leaferjs.com/ui/guide/install/draw/start.html) （49KB min+gzip）。
|
|
38
38
|
|
|
39
|
-
游戏开发场景，推荐安装更省心的 [leafer-game](https://leaferjs.com/ui/guide/install/game/start.
|
|
39
|
+
游戏开发场景，推荐安装更省心的 [leafer-game](https://leaferjs.com/ui/guide/install/game/start.html)，已集成了游戏相关插件。
|
|
40
40
|
|
|
41
41
|
图形编辑场景，推荐安装更省心的 [leafer-editor](https://leaferjs.com/ui/guide/install/editor/start.html)，已集成了图形编辑器相关插件。
|
|
42
42
|
|
|
43
43
|
## 互动交流
|
|
44
44
|
|
|
45
|
-
有问题、建议可以 [提交 issue](https://github.com/leaferjs/leafer-ui/issues)
|
|
45
|
+
有问题、建议可以 [提交 issue](https://github.com/leaferjs/leafer-ui/issues)，留下你的贡献足迹，了解 [提问的智慧](https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md#%E6%8F%90%E9%97%AE%E7%9A%84%E6%99%BA%E6%85%A7)
|
|
46
|
+
。
|
|
46
47
|
|
|
47
48
|
欢迎加入 [技术交流群](https://leaferjs.com/#contact) ，与小伙伴们建立联系，共同学习进步，偶尔会有特殊福利。
|
|
48
49
|
|
|
@@ -106,6 +107,183 @@ LeaferJS 致力于实现一套简洁、开放、现代化的 UI 绘图语言标
|
|
|
106
107
|
|
|
107
108
|
[每一位参与生态的社区成员](https://www.leaferjs.com/ui/contribute/)
|
|
108
109
|
|
|
110
|
+
## 赞助商
|
|
111
|
+
|
|
112
|
+
<p><h3 align="center">金牌赞助商</h3></p>
|
|
113
|
+
<p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 15px;">
|
|
114
|
+
<a target="_blank" href="https://github.com/dromara/yft-design">
|
|
115
|
+
<img width="180" title="yft-design" src="https://www.leaferjs.com/image/sponsor/gold/yft.jpg" loading="lazy" />
|
|
116
|
+
</a>
|
|
117
|
+
<a target="_blank" href="https://www.finclip.com/landing/miniappgame?from=leafer">
|
|
118
|
+
<img width="180" title="FinClip" src="https://www.leaferjs.com/image/sponsor/gold/finclip.jpg" loading="lazy" />
|
|
119
|
+
</a>
|
|
120
|
+
<a target="_blank" href="https://hiif.ong">
|
|
121
|
+
<img width="180" title="hiif" src="https://www.leaferjs.com/image/sponsor/gold/hiif.jpg" loading="lazy" />
|
|
122
|
+
</a>
|
|
123
|
+
<a target="_blank" href="https://www.seafox.cc">
|
|
124
|
+
<img width="180" title="seafox" src="https://www.leaferjs.com/image/sponsor/gold/seafox.jpg" loading="lazy" />
|
|
125
|
+
</a>
|
|
126
|
+
<a target="_blank" href="https://dooring.vip">
|
|
127
|
+
<img width="180" title="dooring" src="https://www.leaferjs.com/image/sponsor/gold/dooring.jpg" loading="lazy" />
|
|
128
|
+
</a>
|
|
129
|
+
<a target="_blank" href="https://pro.kuaitu.cc">
|
|
130
|
+
<img width="180" title="快图设计" src="https://www.leaferjs.com/image/sponsor/gold/kuaitu.jpg" loading="lazy" />
|
|
131
|
+
</a>
|
|
132
|
+
<a target="_blank" href="https://chensuiyi.me">
|
|
133
|
+
<img width="180" title="前端之虎陈随易" src="https://www.leaferjs.com/image/sponsor/gold/chensuiyi.jpg" loading="lazy" />
|
|
134
|
+
</a>
|
|
135
|
+
<a target="_blank" href="https://boardos.online">
|
|
136
|
+
<img width="180" title="在线实时白板协作系统" src="https://www.leaferjs.com/image/sponsor/gold/boardos.svg" loading="lazy" />
|
|
137
|
+
</a>
|
|
138
|
+
<a target="_blank" href="http://www.yunform.cn">
|
|
139
|
+
<img width="180" title="数据查询录入表单页面制作效率工具" src="https://www.leaferjs.com/image/sponsor/gold/yunform.svg" loading="lazy" />
|
|
140
|
+
</a>
|
|
141
|
+
</p>
|
|
142
|
+
<p><h3 align="center">银牌赞助</h3></p>
|
|
143
|
+
<p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 5px;">
|
|
144
|
+
<a target="_blank" href="https://github.com/daodaolee">
|
|
145
|
+
<img width="40" title="道里" src="https://www.leaferjs.com/image/sponsor/user/108.jpg" loading="lazy" />
|
|
146
|
+
</a>
|
|
147
|
+
<a target="_blank" href="https://afdian.com/u/4c42d1dc97f311ef908752540025c377">
|
|
148
|
+
<img width="40" title="dong" src="https://www.leaferjs.com/image/sponsor/user/yellow.png" loading="lazy" />
|
|
149
|
+
</a>
|
|
150
|
+
<a target="_blank" href="https://afdian.com/u/e46181dc5e1b11ef87ce52540025c377">
|
|
151
|
+
<img width="40" title="爱发电用户_PxsB" src="https://www.leaferjs.com/image/sponsor/user/blue.png" loading="lazy" />
|
|
152
|
+
</a>
|
|
153
|
+
<a target="_blank" href="https://www.fastadmin.net">
|
|
154
|
+
<img width="40" title="F4nniu-FastAdmin开源框架" src="https://www.leaferjs.com/image/sponsor/user/85.jpeg" loading="lazy" />
|
|
155
|
+
</a>
|
|
156
|
+
<a target="_blank" href="">
|
|
157
|
+
<img width="40" title="风之影" src="https://www.leaferjs.com/image/sponsor/user/81.jpg" loading="lazy" />
|
|
158
|
+
</a>
|
|
159
|
+
<a target="_blank" href="">
|
|
160
|
+
<img width="40" title="😊" src="https://www.leaferjs.com/image/sponsor/user/79.jpg" loading="lazy" />
|
|
161
|
+
</a>
|
|
162
|
+
<a target="_blank" href="https://pro.kuaitu.cc/">
|
|
163
|
+
<img width="40" title="秦少卫" src="https://www.leaferjs.com/image/sponsor/user/72.jpeg" loading="lazy" />
|
|
164
|
+
</a>
|
|
165
|
+
<a target="_blank" href="https://afdian.com/a/herobeast">
|
|
166
|
+
<img width="40" title="herobeast" src="https://www.leaferjs.com/image/sponsor/user/63.jpeg" loading="lazy" />
|
|
167
|
+
</a>
|
|
168
|
+
<a target="_blank" href="https://afdian.com/u/e16c1f960c1d11ef8b7552540025c377">
|
|
169
|
+
<img width="40" title="Evel" src="https://www.leaferjs.com/image/sponsor/user/62.jpeg" loading="lazy" />
|
|
170
|
+
</a>
|
|
171
|
+
<a target="_blank" href="https://afdian.com/u/f77b17e400bd11efa77c5254001e7c00">
|
|
172
|
+
<img width="40" title="robot" src="https://www.leaferjs.com/image/sponsor/user/61.jpeg" loading="lazy" />
|
|
173
|
+
</a>
|
|
174
|
+
<a target="_blank" href="https://afdian.com/u/db7681e4005111efb4d45254001e7c00">
|
|
175
|
+
<img width="40" title="icezeros" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" />
|
|
176
|
+
</a>
|
|
177
|
+
<a target="_blank" href="https://afdian.com/u/100c3db0005011ef828d52540025c377">
|
|
178
|
+
<img width="40" title="林伟强" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" />
|
|
179
|
+
</a>
|
|
180
|
+
<a target="_blank" href="https://github.com/Misakey-Mikoto">
|
|
181
|
+
<img width="40" title="misakey" src="https://www.leaferjs.com/image/sponsor/user/orange.png" loading="lazy" />
|
|
182
|
+
</a>
|
|
183
|
+
<a target="_blank" href="https://afdian.com/u/446c7466fbce11eebaea5254001e7c00">
|
|
184
|
+
<img width="40" title="junna" src="https://www.leaferjs.com/image/sponsor/user/57.jpeg" loading="lazy" />
|
|
185
|
+
</a>
|
|
186
|
+
<a target="_blank" href="http://www.nickspace.cn">
|
|
187
|
+
<img width="40" title="NickSpace" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" />
|
|
188
|
+
</a>
|
|
189
|
+
<a target="_blank" href="https://afdian.com/a/ziiziz">
|
|
190
|
+
<img width="40" title="YGG" src="https://www.leaferjs.com/image/sponsor/user/55.jpeg" loading="lazy" />
|
|
191
|
+
</a>
|
|
192
|
+
<a target="_blank" href="https://afdian.com/u/49e029bafd2c11eea4bd5254001e7c00">
|
|
193
|
+
<img width="40" title="tony" src="https://www.leaferjs.com/image/sponsor/user/51.jpeg" loading="lazy" />
|
|
194
|
+
</a>
|
|
195
|
+
<a target="_blank" href="https://afdian.com/u/58b6df30fb0411eeb1e252540025c377">
|
|
196
|
+
<img width="40" title="lk" src="https://www.leaferjs.com/image/sponsor/user/48.jpeg" loading="lazy" />
|
|
197
|
+
</a>
|
|
198
|
+
<a target="_blank" href="https://afdian.com/u/ddafe100f58c11eea53652540025c377">
|
|
199
|
+
<img width="40" title="214L" src="https://www.leaferjs.com/image/sponsor/user/47.jpeg" loading="lazy" />
|
|
200
|
+
</a>
|
|
201
|
+
<a target="_blank" href="https://afdian.com/u/987502eaf87611eeb08052540025c377">
|
|
202
|
+
<img width="40" title="南" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" />
|
|
203
|
+
</a>
|
|
204
|
+
<a target="_blank" href="">
|
|
205
|
+
<img width="40" title=".." src="https://www.leaferjs.com/image/sponsor/user/44.jpg" loading="lazy" />
|
|
206
|
+
</a>
|
|
207
|
+
<a target="_blank" href="">
|
|
208
|
+
<img width="40" title="__tynam" src="https://www.leaferjs.com/image/sponsor/user/43.jpg" loading="lazy" />
|
|
209
|
+
</a>
|
|
210
|
+
<a target="_blank" href="https://github.com/zhixiaotong">
|
|
211
|
+
<img width="40" title="知晓同丶" src="https://www.leaferjs.com/image/sponsor/user/42.png" loading="lazy" />
|
|
212
|
+
</a>
|
|
213
|
+
<a target="_blank" href="">
|
|
214
|
+
<img width="40" title="馒头" src="https://www.leaferjs.com/image/sponsor/user/41.jpeg" loading="lazy" />
|
|
215
|
+
</a>
|
|
216
|
+
<a target="_blank" href="">
|
|
217
|
+
<img width="40" title="烟雨江南" src="https://www.leaferjs.com/image/sponsor/user/37.jpeg" loading="lazy" />
|
|
218
|
+
</a>
|
|
219
|
+
<a target="_blank" href="">
|
|
220
|
+
<img width="40" title="sunboy" src="https://www.leaferjs.com/image/sponsor/user/36.jpeg" loading="lazy" />
|
|
221
|
+
</a>
|
|
222
|
+
<a target="_blank" href="">
|
|
223
|
+
<img width="40" title="张恒来啦" src="https://www.leaferjs.com/image/sponsor/user/35.jpeg" loading="lazy" />
|
|
224
|
+
</a>
|
|
225
|
+
<a target="_blank" href="">
|
|
226
|
+
<img width="40" title="呆若牦牛" src="https://www.leaferjs.com/image/sponsor/user/34.jpeg" loading="lazy" />
|
|
227
|
+
</a>
|
|
228
|
+
<a target="_blank" href="">
|
|
229
|
+
<img width="40" title="艳霞" src="https://www.leaferjs.com/image/sponsor/user/33.jpeg" loading="lazy" />
|
|
230
|
+
</a>
|
|
231
|
+
<a target="_blank" href="">
|
|
232
|
+
<img width="40" title="robot" src="https://www.leaferjs.com/image/sponsor/user/29.jpeg" loading="lazy" />
|
|
233
|
+
</a>
|
|
234
|
+
<a target="_blank" href="https://afdian.com/u/1a0a7664f7aa11ee906d52540025c377">
|
|
235
|
+
<img width="40" title="刘杨" src="https://www.leaferjs.com/image/sponsor/user/26.jpeg" loading="lazy" />
|
|
236
|
+
</a>
|
|
237
|
+
<a target="_blank" href="https://afdian.com/u/7ca4df10f60d11eebbe652540025c377">
|
|
238
|
+
<img width="40" title="biudefar" src="https://www.leaferjs.com/image/sponsor/user/25.jpeg" loading="lazy" />
|
|
239
|
+
</a>
|
|
240
|
+
<a target="_blank" href="https://afdian.com/u/1a9fa4d20e3511eebd235254001e7c00">
|
|
241
|
+
<img width="40" title="skywalker512" src="https://www.leaferjs.com/image/sponsor/user/21.jpeg" loading="lazy" />
|
|
242
|
+
</a>
|
|
243
|
+
<a target="_blank" href="https://afdian.com/a/xiaou-utools">
|
|
244
|
+
<img width="40" title="xiaou" src="https://www.leaferjs.com/image/sponsor/user/19.jpg" loading="lazy" />
|
|
245
|
+
</a>
|
|
246
|
+
<a target="_blank" href="https://afdian.com/u/4752d472f6d311ee8c375254001e7c00">
|
|
247
|
+
<img width="40" title="黄鸭梨" src="https://www.leaferjs.com/image/sponsor/user/yellow.png" loading="lazy" />
|
|
248
|
+
</a>
|
|
249
|
+
<a target="_blank" href="https://afdian.com/u/1b50c4dcf64811ee8a6b52540025c377">
|
|
250
|
+
<img width="40" title="子洋" src="https://www.leaferjs.com/image/sponsor/user/17.jpeg" loading="lazy" />
|
|
251
|
+
</a>
|
|
252
|
+
<a target="_blank" href="https://afdian.com/u/901e5b3ef64411ee855f5254001e7c00">
|
|
253
|
+
<img width="40" title="一只胖憨憨" src="https://www.leaferjs.com/image/sponsor/user/16.jpeg" loading="lazy" />
|
|
254
|
+
</a>
|
|
255
|
+
<a target="_blank" href="https://afdian.com/u/b25e2fbef62911ee8a965254001e7c00">
|
|
256
|
+
<img width="40" title="channely" src="https://www.leaferjs.com/image/sponsor/user/15.jpeg" loading="lazy" />
|
|
257
|
+
</a>
|
|
258
|
+
<a target="_blank" href="https://afdian.com/u/6332e502f5b511eebb6a52540025c377">
|
|
259
|
+
<img width="40" title="ibryang" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" />
|
|
260
|
+
</a>
|
|
261
|
+
<a target="_blank" href="https://afdian.com/u/6332e502f5b511eebb6a52540025c377">
|
|
262
|
+
<img width="40" title="阎魔罪歌" src="https://www.leaferjs.com/image/sponsor/user/11.jpeg" loading="lazy" />
|
|
263
|
+
</a>
|
|
264
|
+
<a target="_blank" href="https://afdian.com/u/6332e502f5b511eebb6a52540025c377">
|
|
265
|
+
<img width="40" title="kooriookami" src="https://www.leaferjs.com/image/sponsor/user/10.jpeg" loading="lazy" />
|
|
266
|
+
</a>
|
|
267
|
+
<a target="_blank" href="https://afdian.com/u/8b178a02f5b011ec9b4b52540025c377">
|
|
268
|
+
<img width="40" title="毛豆花生" src="https://www.leaferjs.com/image/sponsor/user/8.jpeg" loading="lazy" />
|
|
269
|
+
</a>
|
|
270
|
+
<a target="_blank" href="https://afdian.com/a/programschool">
|
|
271
|
+
<img width="40" title="编程学院" src="https://www.leaferjs.com/image/sponsor/user/7.jpg" loading="lazy" />
|
|
272
|
+
</a>
|
|
273
|
+
<a target="_blank" href="https://afdian.com/u/8230187ef5a811eeba2d5254001e7c00">
|
|
274
|
+
<img width="40" title="Jikun" src="https://www.leaferjs.com/image/sponsor/user/5.jpeg" loading="lazy" />
|
|
275
|
+
</a>
|
|
276
|
+
<a target="_blank" href="https://afdian.com/u/606e6332f55111eeb78352540025c377">
|
|
277
|
+
<img width="40" title="黄某人" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" />
|
|
278
|
+
</a>
|
|
279
|
+
<a target="_blank" href="https://afdian.com/u/681f0bd0eff311ee975a52540025c377">
|
|
280
|
+
<img width="40" title="爱发电用户_xugk" src="https://www.leaferjs.com/image/sponsor/user/yellow.png" loading="lazy" />
|
|
281
|
+
</a>
|
|
282
|
+
</p>
|
|
283
|
+
<p><h3 align="center">铜牌赞助</h3></p>
|
|
284
|
+
<p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 15px;">
|
|
285
|
+
李维亮 朝夕 SaltedFish zhk 格子 等等 goosen 建伟F4nniu 梁福斌 江万江 杨超 ToB Dev 前端之虎陈随易 A☀️云☀️A ʚ LMT ɞ 爱发电用户_c9c82 轻简历 爱发电用户_0fac0 wangyesheji.cn 风间 爱发电用户_Tqsm 爱发电用户_6KpE dongdong zwm 爱发电用户_3725c Noth1ng 纳西妲の√ 爱发电用户_Ahb9 爱发电用户_7617d 冷漠 爱发电用户_9RXB 今日值得读 爱发电用户_49sT 爱发电用户_NFCS 爱发电用户_43ad8 爱发电用户_30455 xiaozhang 砖吐筷筷 爱发电用户_b47b3 longbow1998 爱发电用户_5d755 爱发电用户_b76b8 爱发电用户_e70c2 爱发电用户_039dc 花祁 爱发电用户_99f39 坤坤 爱发电用户_X6hp 爱发电用户_s5u9 曹吉美爸爸 啸沧海 Ronny Biu 王志强 PD.新城คิดถึง 糖颂缘冥倾 ALBERT. 爱发电用户_UXEV SaltedFish 爱发电用户_76f9d Leafer 爱发电用户_Pbm7 </p>
|
|
286
|
+
|
|
109
287
|
## License
|
|
110
288
|
|
|
111
289
|
MIT 开源许可协议，可以免费使用，且能用于商业场景。
|
package/dist/web.cjs
CHANGED
|
@@ -620,25 +620,25 @@ class Renderer {
|
|
|
620
620
|
if (userConfig)
|
|
621
621
|
this.config = core.DataHelper.default(userConfig, this.config);
|
|
622
622
|
this.__listenEvents();
|
|
623
|
-
this.__requestRender();
|
|
624
623
|
}
|
|
625
624
|
start() {
|
|
626
625
|
this.running = true;
|
|
626
|
+
this.update(false);
|
|
627
627
|
}
|
|
628
628
|
stop() {
|
|
629
629
|
this.running = false;
|
|
630
630
|
}
|
|
631
|
-
update() {
|
|
632
|
-
this.changed
|
|
631
|
+
update(change = true) {
|
|
632
|
+
if (!this.changed)
|
|
633
|
+
this.changed = change;
|
|
634
|
+
this.__requestRender();
|
|
633
635
|
}
|
|
634
636
|
requestLayout() {
|
|
635
637
|
this.target.emit(core.LayoutEvent.REQUEST);
|
|
636
638
|
}
|
|
637
639
|
render(callback) {
|
|
638
|
-
if (!(this.running && this.canvas.view))
|
|
639
|
-
this.
|
|
640
|
-
return;
|
|
641
|
-
}
|
|
640
|
+
if (!(this.running && this.canvas.view))
|
|
641
|
+
return this.update();
|
|
642
642
|
const { target } = this;
|
|
643
643
|
this.times = 0;
|
|
644
644
|
this.totalBounds = new core.Bounds();
|
|
@@ -772,16 +772,17 @@ class Renderer {
|
|
|
772
772
|
}
|
|
773
773
|
}
|
|
774
774
|
__requestRender() {
|
|
775
|
-
|
|
775
|
+
if (this.requestTime)
|
|
776
|
+
return;
|
|
777
|
+
const requestTime = this.requestTime = Date.now();
|
|
776
778
|
core.Platform.requestRender(() => {
|
|
777
|
-
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() -
|
|
779
|
+
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
|
|
780
|
+
this.requestTime = 0;
|
|
778
781
|
if (this.running) {
|
|
779
782
|
if (this.changed && this.canvas.view)
|
|
780
783
|
this.render();
|
|
781
784
|
this.target.emit(core.RenderEvent.NEXT);
|
|
782
785
|
}
|
|
783
|
-
if (this.target)
|
|
784
|
-
this.__requestRender();
|
|
785
786
|
});
|
|
786
787
|
}
|
|
787
788
|
__onResize(e) {
|
|
@@ -797,7 +798,7 @@ class Renderer {
|
|
|
797
798
|
}
|
|
798
799
|
}
|
|
799
800
|
this.addBlock(new core.Bounds(0, 0, 1, 1));
|
|
800
|
-
this.
|
|
801
|
+
this.update();
|
|
801
802
|
}
|
|
802
803
|
__onLayoutEnd(event) {
|
|
803
804
|
if (event.data)
|
|
@@ -1148,46 +1149,6 @@ const PointerEventHelper = {
|
|
|
1148
1149
|
}
|
|
1149
1150
|
};
|
|
1150
1151
|
|
|
1151
|
-
const WheelEventHelper = {
|
|
1152
|
-
getMove(e, config) {
|
|
1153
|
-
let { moveSpeed } = config;
|
|
1154
|
-
let { deltaX, deltaY } = e;
|
|
1155
|
-
if (e.shiftKey && !deltaX) {
|
|
1156
|
-
deltaX = deltaY;
|
|
1157
|
-
deltaY = 0;
|
|
1158
|
-
}
|
|
1159
|
-
if (deltaX > 50)
|
|
1160
|
-
deltaX = Math.max(50, deltaX / 3);
|
|
1161
|
-
if (deltaY > 50)
|
|
1162
|
-
deltaY = Math.max(50, deltaY / 3);
|
|
1163
|
-
return { x: -deltaX * moveSpeed * 2, y: -deltaY * moveSpeed * 2 };
|
|
1164
|
-
},
|
|
1165
|
-
getScale(e, config) {
|
|
1166
|
-
let zoom;
|
|
1167
|
-
let scale = 1;
|
|
1168
|
-
let { zoomMode, zoomSpeed } = config;
|
|
1169
|
-
const delta = e.deltaY || e.deltaX;
|
|
1170
|
-
if (zoomMode) {
|
|
1171
|
-
zoom = (zoomMode === 'mouse') ? true : (!e.deltaX && (core.Platform.intWheelDeltaY ? Math.abs(delta) > 17 : Math.ceil(delta) !== delta));
|
|
1172
|
-
if (e.shiftKey || e.metaKey || e.ctrlKey)
|
|
1173
|
-
zoom = true;
|
|
1174
|
-
}
|
|
1175
|
-
else {
|
|
1176
|
-
zoom = !e.shiftKey && (e.metaKey || e.ctrlKey);
|
|
1177
|
-
}
|
|
1178
|
-
if (zoom) {
|
|
1179
|
-
zoomSpeed = core.MathHelper.within(zoomSpeed, 0, 1);
|
|
1180
|
-
const min = e.deltaY ? config.delta.y : config.delta.x;
|
|
1181
|
-
scale = 1 - delta / (min * 4) * zoomSpeed;
|
|
1182
|
-
if (scale < 0.5)
|
|
1183
|
-
scale = 0.5;
|
|
1184
|
-
if (scale >= 1.5)
|
|
1185
|
-
scale = 1.5;
|
|
1186
|
-
}
|
|
1187
|
-
return scale;
|
|
1188
|
-
}
|
|
1189
|
-
};
|
|
1190
|
-
|
|
1191
1152
|
const KeyEventHelper = {
|
|
1192
1153
|
convert(e) {
|
|
1193
1154
|
const base = core$1.InteractionHelper.getBase(e);
|
|
@@ -1196,7 +1157,7 @@ const KeyEventHelper = {
|
|
|
1196
1157
|
}
|
|
1197
1158
|
};
|
|
1198
1159
|
|
|
1199
|
-
const {
|
|
1160
|
+
const { pathCanDrag } = core$1.InteractionHelper;
|
|
1200
1161
|
class Interaction extends core$1.InteractionBase {
|
|
1201
1162
|
__listenEvents() {
|
|
1202
1163
|
super.__listenEvents();
|
|
@@ -1406,13 +1367,7 @@ class Interaction extends core$1.InteractionBase {
|
|
|
1406
1367
|
}
|
|
1407
1368
|
onWheel(e) {
|
|
1408
1369
|
this.preventDefaultWheel(e);
|
|
1409
|
-
|
|
1410
|
-
if (wheel.disabled)
|
|
1411
|
-
return;
|
|
1412
|
-
const scale = wheel.getScale ? wheel.getScale(e, wheel) : WheelEventHelper.getScale(e, wheel);
|
|
1413
|
-
const local = this.getLocal(e);
|
|
1414
|
-
const eventBase = core$1.InteractionHelper.getBase(e);
|
|
1415
|
-
scale !== 1 ? this.zoom(getZoomEventData(local, scale, eventBase)) : this.move(getMoveEventData(local, wheel.getMove ? wheel.getMove(e, wheel) : WheelEventHelper.getMove(e, wheel), eventBase));
|
|
1370
|
+
this.wheel(Object.assign(Object.assign(Object.assign({}, core$1.InteractionHelper.getBase(e)), this.getLocal(e)), { deltaX: e.deltaX, deltaY: e.deltaY }));
|
|
1416
1371
|
}
|
|
1417
1372
|
onGesturestart(e) {
|
|
1418
1373
|
if (this.useMultiTouch)
|
|
@@ -1425,14 +1380,12 @@ class Interaction extends core$1.InteractionBase {
|
|
|
1425
1380
|
if (this.useMultiTouch)
|
|
1426
1381
|
return;
|
|
1427
1382
|
this.preventDefaultWheel(e);
|
|
1428
|
-
const local = this.getLocal(e);
|
|
1429
1383
|
const eventBase = core$1.InteractionHelper.getBase(e);
|
|
1430
|
-
|
|
1431
|
-
const
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
this.
|
|
1435
|
-
this.rotate(getRotateEventData(local, changeAngle / Math.PI * 180 * (rotateSpeed / 4 + 0.1), eventBase));
|
|
1384
|
+
Object.assign(eventBase, this.getLocal(e));
|
|
1385
|
+
const scale = (e.scale / this.lastGestureScale);
|
|
1386
|
+
const rotation = (e.rotation - this.lastGestureRotation) / Math.PI * 180 * (core.MathHelper.within(this.config.wheel.rotateSpeed, 0, 1) / 4 + 0.1);
|
|
1387
|
+
this.zoom(Object.assign(Object.assign({}, eventBase), { scale: scale * scale }));
|
|
1388
|
+
this.rotate(Object.assign(Object.assign({}, eventBase), { rotation }));
|
|
1436
1389
|
this.lastGestureScale = e.scale;
|
|
1437
1390
|
this.lastGestureRotation = e.rotation;
|
|
1438
1391
|
}
|
|
@@ -1600,6 +1553,8 @@ function stroke(stroke, ui, canvas) {
|
|
|
1600
1553
|
case 'center':
|
|
1601
1554
|
canvas.setStroke(stroke, __strokeWidth, options);
|
|
1602
1555
|
canvas.stroke();
|
|
1556
|
+
if (options.__useArrow)
|
|
1557
|
+
strokeArrow(ui, canvas);
|
|
1603
1558
|
break;
|
|
1604
1559
|
case 'inside':
|
|
1605
1560
|
canvas.save();
|
|
@@ -1637,6 +1592,8 @@ function strokes(strokes, ui, canvas) {
|
|
|
1637
1592
|
case 'center':
|
|
1638
1593
|
canvas.setStroke(undefined, __strokeWidth, options);
|
|
1639
1594
|
drawStrokesStyle(strokes, false, ui, canvas);
|
|
1595
|
+
if (options.__useArrow)
|
|
1596
|
+
strokeArrow(ui, canvas);
|
|
1640
1597
|
break;
|
|
1641
1598
|
case 'inside':
|
|
1642
1599
|
canvas.save();
|
|
@@ -1662,6 +1619,14 @@ function strokes(strokes, ui, canvas) {
|
|
|
1662
1619
|
}
|
|
1663
1620
|
}
|
|
1664
1621
|
}
|
|
1622
|
+
function strokeArrow(ui, canvas) {
|
|
1623
|
+
if (ui.__.dashPattern) {
|
|
1624
|
+
canvas.beginPath();
|
|
1625
|
+
ui.__drawPathByData(canvas, ui.__.__pathForArrow);
|
|
1626
|
+
canvas.dashPattern = null;
|
|
1627
|
+
canvas.stroke();
|
|
1628
|
+
}
|
|
1629
|
+
}
|
|
1665
1630
|
|
|
1666
1631
|
const { getSpread, getOuterOf, getByMove, getIntersectData } = core.BoundsHelper;
|
|
1667
1632
|
function shape(ui, current, options) {
|
package/dist/web.esm.js
CHANGED
|
@@ -621,25 +621,25 @@ class Renderer {
|
|
|
621
621
|
if (userConfig)
|
|
622
622
|
this.config = DataHelper.default(userConfig, this.config);
|
|
623
623
|
this.__listenEvents();
|
|
624
|
-
this.__requestRender();
|
|
625
624
|
}
|
|
626
625
|
start() {
|
|
627
626
|
this.running = true;
|
|
627
|
+
this.update(false);
|
|
628
628
|
}
|
|
629
629
|
stop() {
|
|
630
630
|
this.running = false;
|
|
631
631
|
}
|
|
632
|
-
update() {
|
|
633
|
-
this.changed
|
|
632
|
+
update(change = true) {
|
|
633
|
+
if (!this.changed)
|
|
634
|
+
this.changed = change;
|
|
635
|
+
this.__requestRender();
|
|
634
636
|
}
|
|
635
637
|
requestLayout() {
|
|
636
638
|
this.target.emit(LayoutEvent.REQUEST);
|
|
637
639
|
}
|
|
638
640
|
render(callback) {
|
|
639
|
-
if (!(this.running && this.canvas.view))
|
|
640
|
-
this.
|
|
641
|
-
return;
|
|
642
|
-
}
|
|
641
|
+
if (!(this.running && this.canvas.view))
|
|
642
|
+
return this.update();
|
|
643
643
|
const { target } = this;
|
|
644
644
|
this.times = 0;
|
|
645
645
|
this.totalBounds = new Bounds();
|
|
@@ -773,16 +773,17 @@ class Renderer {
|
|
|
773
773
|
}
|
|
774
774
|
}
|
|
775
775
|
__requestRender() {
|
|
776
|
-
|
|
776
|
+
if (this.requestTime)
|
|
777
|
+
return;
|
|
778
|
+
const requestTime = this.requestTime = Date.now();
|
|
777
779
|
Platform.requestRender(() => {
|
|
778
|
-
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() -
|
|
780
|
+
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
|
|
781
|
+
this.requestTime = 0;
|
|
779
782
|
if (this.running) {
|
|
780
783
|
if (this.changed && this.canvas.view)
|
|
781
784
|
this.render();
|
|
782
785
|
this.target.emit(RenderEvent.NEXT);
|
|
783
786
|
}
|
|
784
|
-
if (this.target)
|
|
785
|
-
this.__requestRender();
|
|
786
787
|
});
|
|
787
788
|
}
|
|
788
789
|
__onResize(e) {
|
|
@@ -798,7 +799,7 @@ class Renderer {
|
|
|
798
799
|
}
|
|
799
800
|
}
|
|
800
801
|
this.addBlock(new Bounds(0, 0, 1, 1));
|
|
801
|
-
this.
|
|
802
|
+
this.update();
|
|
802
803
|
}
|
|
803
804
|
__onLayoutEnd(event) {
|
|
804
805
|
if (event.data)
|
|
@@ -1149,46 +1150,6 @@ const PointerEventHelper = {
|
|
|
1149
1150
|
}
|
|
1150
1151
|
};
|
|
1151
1152
|
|
|
1152
|
-
const WheelEventHelper = {
|
|
1153
|
-
getMove(e, config) {
|
|
1154
|
-
let { moveSpeed } = config;
|
|
1155
|
-
let { deltaX, deltaY } = e;
|
|
1156
|
-
if (e.shiftKey && !deltaX) {
|
|
1157
|
-
deltaX = deltaY;
|
|
1158
|
-
deltaY = 0;
|
|
1159
|
-
}
|
|
1160
|
-
if (deltaX > 50)
|
|
1161
|
-
deltaX = Math.max(50, deltaX / 3);
|
|
1162
|
-
if (deltaY > 50)
|
|
1163
|
-
deltaY = Math.max(50, deltaY / 3);
|
|
1164
|
-
return { x: -deltaX * moveSpeed * 2, y: -deltaY * moveSpeed * 2 };
|
|
1165
|
-
},
|
|
1166
|
-
getScale(e, config) {
|
|
1167
|
-
let zoom;
|
|
1168
|
-
let scale = 1;
|
|
1169
|
-
let { zoomMode, zoomSpeed } = config;
|
|
1170
|
-
const delta = e.deltaY || e.deltaX;
|
|
1171
|
-
if (zoomMode) {
|
|
1172
|
-
zoom = (zoomMode === 'mouse') ? true : (!e.deltaX && (Platform.intWheelDeltaY ? Math.abs(delta) > 17 : Math.ceil(delta) !== delta));
|
|
1173
|
-
if (e.shiftKey || e.metaKey || e.ctrlKey)
|
|
1174
|
-
zoom = true;
|
|
1175
|
-
}
|
|
1176
|
-
else {
|
|
1177
|
-
zoom = !e.shiftKey && (e.metaKey || e.ctrlKey);
|
|
1178
|
-
}
|
|
1179
|
-
if (zoom) {
|
|
1180
|
-
zoomSpeed = MathHelper.within(zoomSpeed, 0, 1);
|
|
1181
|
-
const min = e.deltaY ? config.delta.y : config.delta.x;
|
|
1182
|
-
scale = 1 - delta / (min * 4) * zoomSpeed;
|
|
1183
|
-
if (scale < 0.5)
|
|
1184
|
-
scale = 0.5;
|
|
1185
|
-
if (scale >= 1.5)
|
|
1186
|
-
scale = 1.5;
|
|
1187
|
-
}
|
|
1188
|
-
return scale;
|
|
1189
|
-
}
|
|
1190
|
-
};
|
|
1191
|
-
|
|
1192
1153
|
const KeyEventHelper = {
|
|
1193
1154
|
convert(e) {
|
|
1194
1155
|
const base = InteractionHelper.getBase(e);
|
|
@@ -1197,7 +1158,7 @@ const KeyEventHelper = {
|
|
|
1197
1158
|
}
|
|
1198
1159
|
};
|
|
1199
1160
|
|
|
1200
|
-
const {
|
|
1161
|
+
const { pathCanDrag } = InteractionHelper;
|
|
1201
1162
|
class Interaction extends InteractionBase {
|
|
1202
1163
|
__listenEvents() {
|
|
1203
1164
|
super.__listenEvents();
|
|
@@ -1407,13 +1368,7 @@ class Interaction extends InteractionBase {
|
|
|
1407
1368
|
}
|
|
1408
1369
|
onWheel(e) {
|
|
1409
1370
|
this.preventDefaultWheel(e);
|
|
1410
|
-
|
|
1411
|
-
if (wheel.disabled)
|
|
1412
|
-
return;
|
|
1413
|
-
const scale = wheel.getScale ? wheel.getScale(e, wheel) : WheelEventHelper.getScale(e, wheel);
|
|
1414
|
-
const local = this.getLocal(e);
|
|
1415
|
-
const eventBase = InteractionHelper.getBase(e);
|
|
1416
|
-
scale !== 1 ? this.zoom(getZoomEventData(local, scale, eventBase)) : this.move(getMoveEventData(local, wheel.getMove ? wheel.getMove(e, wheel) : WheelEventHelper.getMove(e, wheel), eventBase));
|
|
1371
|
+
this.wheel(Object.assign(Object.assign(Object.assign({}, InteractionHelper.getBase(e)), this.getLocal(e)), { deltaX: e.deltaX, deltaY: e.deltaY }));
|
|
1417
1372
|
}
|
|
1418
1373
|
onGesturestart(e) {
|
|
1419
1374
|
if (this.useMultiTouch)
|
|
@@ -1426,14 +1381,12 @@ class Interaction extends InteractionBase {
|
|
|
1426
1381
|
if (this.useMultiTouch)
|
|
1427
1382
|
return;
|
|
1428
1383
|
this.preventDefaultWheel(e);
|
|
1429
|
-
const local = this.getLocal(e);
|
|
1430
1384
|
const eventBase = InteractionHelper.getBase(e);
|
|
1431
|
-
|
|
1432
|
-
const
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
this.
|
|
1436
|
-
this.rotate(getRotateEventData(local, changeAngle / Math.PI * 180 * (rotateSpeed / 4 + 0.1), eventBase));
|
|
1385
|
+
Object.assign(eventBase, this.getLocal(e));
|
|
1386
|
+
const scale = (e.scale / this.lastGestureScale);
|
|
1387
|
+
const rotation = (e.rotation - this.lastGestureRotation) / Math.PI * 180 * (MathHelper.within(this.config.wheel.rotateSpeed, 0, 1) / 4 + 0.1);
|
|
1388
|
+
this.zoom(Object.assign(Object.assign({}, eventBase), { scale: scale * scale }));
|
|
1389
|
+
this.rotate(Object.assign(Object.assign({}, eventBase), { rotation }));
|
|
1437
1390
|
this.lastGestureScale = e.scale;
|
|
1438
1391
|
this.lastGestureRotation = e.rotation;
|
|
1439
1392
|
}
|
|
@@ -1601,6 +1554,8 @@ function stroke(stroke, ui, canvas) {
|
|
|
1601
1554
|
case 'center':
|
|
1602
1555
|
canvas.setStroke(stroke, __strokeWidth, options);
|
|
1603
1556
|
canvas.stroke();
|
|
1557
|
+
if (options.__useArrow)
|
|
1558
|
+
strokeArrow(ui, canvas);
|
|
1604
1559
|
break;
|
|
1605
1560
|
case 'inside':
|
|
1606
1561
|
canvas.save();
|
|
@@ -1638,6 +1593,8 @@ function strokes(strokes, ui, canvas) {
|
|
|
1638
1593
|
case 'center':
|
|
1639
1594
|
canvas.setStroke(undefined, __strokeWidth, options);
|
|
1640
1595
|
drawStrokesStyle(strokes, false, ui, canvas);
|
|
1596
|
+
if (options.__useArrow)
|
|
1597
|
+
strokeArrow(ui, canvas);
|
|
1641
1598
|
break;
|
|
1642
1599
|
case 'inside':
|
|
1643
1600
|
canvas.save();
|
|
@@ -1663,6 +1620,14 @@ function strokes(strokes, ui, canvas) {
|
|
|
1663
1620
|
}
|
|
1664
1621
|
}
|
|
1665
1622
|
}
|
|
1623
|
+
function strokeArrow(ui, canvas) {
|
|
1624
|
+
if (ui.__.dashPattern) {
|
|
1625
|
+
canvas.beginPath();
|
|
1626
|
+
ui.__drawPathByData(canvas, ui.__.__pathForArrow);
|
|
1627
|
+
canvas.dashPattern = null;
|
|
1628
|
+
canvas.stroke();
|
|
1629
|
+
}
|
|
1630
|
+
}
|
|
1666
1631
|
|
|
1667
1632
|
const { getSpread, getOuterOf, getByMove, getIntersectData } = BoundsHelper;
|
|
1668
1633
|
function shape(ui, current, options) {
|