konva-react
发表于|更新于
|浏览量:
“善良一点,因为大家的一生都不容易。”——《奇迹男孩》。
官方文档:https://konvajs.org/docs/react/
中文文档:http://konvajs-doc.bluehymn.com/docs/react/
安装:
1 | pnpm install react-konva konva --save |
在konva中能做到的,在konva-react也一样能做到,只不过是换了一种写法罢了
这里有个使用konva-react的在线编辑器Demo
https://konvajs.org/docs/sandbox/Canvas_Editor.html
是基于一个叫Polotno的框架,它提供了多种react对konva的封装,能开箱即用
但其不可以免费用于商业用途
可以算得上是最佳实践了

相关推荐
2025-05-17
pickr
业精于勤,荒于嬉。—— 韩 愈《进学解》 https://github.com/simonwep/pickr Pickr:一个简单、多主题、响应式且可定制的颜色选择器库在网页设计和前端开发中,颜色选择器是一个不可或缺的工具。虽然许多框架提供了内置的颜色选择器,但它们往往难以扩展或自定义。Pickr 是一个轻量级、无依赖的颜色选择器库,它提供了丰富的功能,同时完全兼容所有主流 CSS 框架。 什么是 Pickr?Pickr 是一个开源的颜色选择器库,支持多种颜色格式(如 rgba、hsla、hsva 等),并提供多种主题和自定义选项。它专为现代前端开发设计,具有以下特点: 核心特点: 无依赖:不依赖任何第三方库(如 jQuery)。 多格式支持:支持 rgba、hsla、hsva、hex 和 CMYK 格式。 多主题:内置多种主题样式,兼容主流 CSS 框架(如 Bootstrap、Materialize)。 响应式设计:适配移动端和桌面端。 自定义能力:可通过 JavaScript 和 CSS 轻松自定义外观和功能。 支持透明度:包括 alpha 通道的选择。 轻量级:小巧...
2021-08-24
页面滚动事件
有些路是非要单独一人去跋涉,路再远再长,也得独自默默走下去。——席慕蓉 HTML DOM事件大全:https://www.runoob.com/jsref/dom-obj-event.html 可以如下写法: 12345window.onscroll = function() { console.log("滚动上下距离" + document.documentElement.scrollTop || document.body.scrollTop); console.log("滚动左右距离" + document.documentElement.scrollLeft || document.body.scrollLeft);}// jquery $(window).scroll(()=>{}) uniapp页面生命周期文档:https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e9%a1%b5%e9%9d%a2%e7%94%9f%...
2020-08-30
新版vue项目的创建
下载nodejs 然后一直下一步安装就行 打开vscode 点击左下角的 点击终端 (Win+R输入cmd或者powershell一样的) 然后开始安装vue 1234567891011121314151617181920212223242526#查看版本(如果nodejs安装完了还是显示不是内部或外部命令,也不是可运行的程序或批处理文件,重新打开一下vscode或命令框)PS C:\Users\1> npm -v6.14.5#安装cnpmPS C:\Users\1> npm install -g cnpm --registry=https://registry.npm.taobao.org#查看cnpm版本PS C:\Users\1> cnpm -vcnpm@6.1.1 (C:\Users\1\AppData\Roaming\npm\node_modules\cnpm\lib\parse_argv.js)npm@6.14.5 (C:\Users\1\AppData\Roaming\npm\node_modules\cnpm\node_modules\npm\...
2022-04-01
antdv动态表单组件
你已春色摇曳,我仍一身旧雪。——送花的人走了 分享一个自己写的antdv动态表单组件 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618...
2023-07-24
psd的js脚本
我们可以随自己的高兴来认识这个世界,然而世界总少不了光明面和阴暗面。——歌德 今天研究了下psd的脚本 Photoshop 中的脚本 https://github.com/Adobe-CEP/CEP-Resources/tree/master/Documentation/Product%20specific%20Documentation/Photoshop%20Scripting 然后下载了脚本监视器插件,可以让我们在使用psd时生成对应的脚本 Downloadable plug-ins and content in Photoshop 然后解压,复制Scripting Utilties 粘贴到PS的路径下面的Plug-ins下面 重启ps即可,之后执行操作则会在桌面生成脚本文件 脚本内容: 1234567891011121314151617181920212223242526272829303132333435363738394041// Copyright 2002-2007. Adobe Systems, Incorporated. All right...
2024-10-29
typescript-exercises(三)
青年人的教育是国家的基石。——富兰克林 题面: 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970/*Intro: Since we already have some of the additional information about our users, it's a good idea to output it in a nice way.Exercise: Fix type errors in logPerson function. logPerson function should accept both User and Admin and should output relevant information according to the input: occupation for User an...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog