Tool之Excalidraw:Excalidraw(开源的虚拟手绘风格白板)的简介、安装和使用方法、艾米莉应用之详细攻略

Tool之Excalidraw:Excalidraw(开源的虚拟手绘风格白板)的简介、安装和使用方法、艾米莉应用之详细攻略

目录

Excalidraw 简介

1、Excalidraw 的主要特点:

Excalidraw 安装和使用方法

1、Excalidraw的安装

T1、使用 npm 安装:

T2、使用 yarn 安装:

Excalidraw 案例应用


Excalidraw 简介

Excalidraw是一个开源的虚拟手绘风格白板,支持协作和端到端加密。你可以用它创建漂亮的手绘风格图表、线框图或任何你想要的东西。它是一个免费且开源的无限画布白板,具有手绘风格、暗模式、可定制性、图片支持、形状库支持、本地化(i18n)支持等特性。

Excalidraw 支持导出为 PNG、SVG 和剪贴板格式,并使用开放格式——将绘图导出为 .excalidraw JSON 文件。它提供丰富的工具,例如矩形、圆形、菱形、箭头、线条、自由绘制、橡皮擦等,并支持箭头绑定和带标签的箭头,以及撤销/重做、缩放和平移功能。

Excalidraw.com 网站是一个展示 Excalidraw 功能的最小化应用,其源码也包含在这个仓库中。该应用具有PWA支持(离线工作)、实时协作、端到端加密和本地优先支持(自动保存到浏览器)等功能,并支持生成可共享的只读链接。 未来,这些功能将作为插件添加到 npm 包中。

GitHub地址:https://github.com/excalidraw/excalidraw

1、Excalidraw 的主要特点:

Excalidraw 结合了手绘风格的直观易用性与强大的协作和导出功能,使其成为一个功能丰富且易于使用的虚拟白板工具。

>> 手绘风格:Excalidraw 的核心特点是其手绘风格的界面和绘图体验,让用户感觉像是在用笔在白板上作画。

>> 虚拟白板:它是一个虚拟白板,允许用户在数字环境中进行绘图和协作。

>> 无限画布:提供无限大的画布空间,用户无需担心空间限制。

>> 开源免费:Excalidraw 是一个开源项目,并且完全免费使用。

>> 协作功能:支持实时协作,多个用户可以同时在同一个画布上进行编辑。

>> 端到端加密:确保用户数据的安全性和隐私性。

>> 可定制性:允许用户自定义设置和扩展功能。

>> 图片支持:支持插入和编辑图片。

>> 形状库支持:提供各种形状库,方便用户快速创建图表。

>> 多语言支持:支持多种语言,方便全球用户使用。

>> 多种导出格式:支持导出为 PNG、SVG 和剪贴板格式,以及 .excalidraw JSON 文件。

>> 丰富的工具:提供多种绘图工具,例如矩形、圆形、箭头、线条、自由绘制、橡皮擦等,并支持箭头绑定和带标签的箭头。

>> 撤销/重做:支持撤销和重做操作,方便用户修改错误。

>> 缩放和平移:支持缩放和平移功能,方便用户查看和编辑大型图表。

>> PWA 支持:Excalidraw.com 版本支持渐进式网络应用 (PWA),可以在离线状态下工作。

>> 本地优先支持:自动保存到浏览器,避免数据丢失。

>> 可共享链接:可以生成可共享的只读链接,方便与他人分享作品。

Excalidraw 安装和使用方法

1、Excalidraw的安装

以下说明适用于将 Excalidraw 集成到您自己的应用程序时安装 Excalidraw npm 包。要运行本地开发环境,请参考开发指南。

T1、使用 npm 安装:

npm install react react-dom @excalidraw/excalidraw

T2、使用 yarn 安装:

yarn add react react-dom @excalidraw/excalidraw

Excalidraw 案例应用

Excalidraw 已经被许多公司和项目集成使用,包括:Google Cloud、Meta、CodeSandboxObsidian、Excalidraw、Replit、Slite、Notion、HackerRank以及许多其他公司和项目,这些案例展示了 Excalidraw 在不同场景下的应用,例如团队协作、流程图绘制、思维导图创作等。 更多集成案例可参考 GitHub 项目页面。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/64893.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【蓝桥杯选拔赛真题96】Scratch风车旋转 第十五届蓝桥杯scratch图形化编程 少儿编程创意编程选拔赛真题解析

目录 scratch风车旋转 一、题目要求 编程实现 二、案例分析 1、角色分析 2、背景分析 3、前期准备 三、解题思路 1、思路分析 2、详细过程 四、程序编写 五、考点分析 六、推荐资料 1、入门基础 2、蓝桥杯比赛 3、考级资料 4、视频课程 5、python资料 scratc…

奇怪问题| Chrome 访问csdn 创作中心的时候报错: 服务超时,请稍后重试

Chrome 访问csdn 创作中心的时候报错: 服务超时,请稍后重试用无痕浏览器可以正常访问 关闭代理无效清缓存和Cookies无效。考虑无痕浏览器模式下插件不生效,尝试把chrome 插件也禁用,发现有效,是该扩展程序的缘故

sentinel学习笔记7-熔断降级

本文属于sentinel学习笔记系列。网上看到吴就业老师的专栏,写的好值得推荐,我整理的有所删减,推荐看原文。 https://blog.csdn.net/baidu_28523317/category_10400605.html 限流需要我们根据不同的硬件条件做好压测,不好准确评估…

记录--uniapp 安卓端实现录音功能,保存为amr/mp3文件

🧑‍💻 写在开头 点赞 收藏 学会🤣🤣🤣 功能实现需要用到MediaRecorder、navigator.mediaDevices.getUserMedia、Blob等API,uniapp App端不支持,需要借助renderjs来实现 实现逻辑 通过naviga…

步进电机位置速度双环控制实现

步进电机位置速度双环控制实现 野火stm32电机教学 提高部分-第11讲 步进电机位置速度双环控制实现(1)_哔哩哔哩_bilibili PID模型 位置环作为外环,速度环作为内环。设定目标位置和实际转轴位置的位置偏差,经过位置PID获得位置期望,然后讲位置期望(位置变化反映了转轴的速…

MySQL 8.0:explain analyze 分析 SQL 执行过程

介绍 MySQL 8.0.16 引入一个实验特性:explain formattree ,树状的输出执行过程,以及预估成本和预估返 回行数。在 MySQL 8.0.18 又引入了 EXPLAIN ANALYZE,在 formattree 基础上,使用时,会执行 SQL &#…

事务、管道

目录 事务 相关命令 悲观锁 乐观锁 管道 实例 Pipeline与原生批量命令对比 Pipeline与事物对比 使用Pipeline注意事项 事务 相关命令 命令描述discard取消事务,放弃执行事务块内的所有命令exec执行所有事务块内的事务(所有命令依次执行&#x…

list的常用操作

list的介绍 list是序列容器,它允许在常数范围O(1)进行插入和删除在这段序列的任意位置,并且可以双向遍历 它是弥补vector容器的缺点,与vector有互补的韵味, 这里我们可以将其进行与vector进行对比 vect…

3.4 stm32系列:定时器(PWM、定时中断)

一、定时器概述 1.1 软件定时原理 使用纯软件(CPU死等)的方式实现定时(延时)功能; 不精准的延迟: /* 微秒级延迟函数* 不精准* stm32存在压出栈过程需要消耗时间* 存在流水线,执行时间不确定…

28、论文阅读:基于像素分布重映射和多先验Retinex变分模型的水下图像增强

A Pixel Distribution Remapping and Multi-Prior Retinex Variational Model for Underwater Image Enhancement 摘要介绍相关工作基于模型的水下图像增强方法:无模型水下图像增强方法:基于深度学习的水下图像增强方法: 论文方法概述像素分布…

【路径规划】原理及实现

路径规划(Path Planning)是指在给定地图、起始点和目标点的情况下,确定应该采取的最佳路径。常见的路径规划算法包括A* 算法、Dijkstra 算法、RRT(Rapidly-exploring Random Tree)等。 目录 一.A* 1.算法原理 2.实…

java web springboot

0. 引言 SpringBoot对Spring的改善和优化,它基于约定优于配置的思想,提供了大量的默认配置和实现 使用SpringBoot之后,程序员只需按照它规定的方式去进行程序代码的开发即可,而无需再去编写一堆复杂的配置 SpringBoot的主要功能…

实验四 综合数据流处理-Storm (单机和集群配置部分)

1.前期准备 (1)把docker和docker-compose给下载好 参考:基于docker-compose来搭建zookeeper集群-CSDN博客(注意对于这篇文章下面配置zookeeper的内容,可以直接跳过,因为我们只需要看最上面下载docker-com…

前端开发 之 12个鼠标交互特效下【附完整源码】

前端开发 之 12个鼠标交互特效下【附完整源码】 文章目录 前端开发 之 12个鼠标交互特效下【附完整源码】七:粒子烟花绽放特效1.效果展示2.HTML完整代码 八:彩球释放特效1.效果展示2.HTML完整代码 九:雨滴掉落特效1.效果展示2.HTML完整代码 十…

Java设计模式 —— 【结构型模式】外观模式详解

文章目录 概述结构案例实现优缺点 概述 外观模式又名门面模式,是一种通过为多个复杂的子系统提供一个一致的接口,而使这些子系统更加容易被访问的模式。该模式对外有一个统一接口,外部应用程序不用关心内部子系统的具体的细节,这…

基于Springboot + vue实现的汽车资讯网站

🥂(❁◡❁)您的点赞👍➕评论📝➕收藏⭐是作者创作的最大动力🤞 💖📕🎉🔥 支持我:点赞👍收藏⭐️留言📝欢迎留言讨论 🔥🔥&…

Html:点击图标链接发起QQ临时会话

我们在做前端开发的时候&#xff0c;会遇到用户需要点击一个图标可以发起QQ临时会话&#xff0c;这样不用添加好友也能沟通的&#xff0c;那我们就来看看如何实现这个功能&#xff1a; <a href"http://wpa.qq.com/msgrd?v3&uin你的QQ号码&siteqq&menuyes…

echarts画风向杆

1.安装echarts 2.引入echarts 4.获取数据&#xff0c;转换数据格式 windProfile.title.text ${moment(time.searchTime[0], ‘YYYY-MM-DD HH:mm:ss’).format( ‘YYYY-MM-DD HH:mm’ )}-${moment(time.searchTime[1], ‘YYYY-MM-DD HH:mm:ss’).format(‘YYYY-MM-DD HH:mm’)…

Linux系统编程——理解系统内核中的信号捕获

目录 一、sigaction() 使用 信号捕捉技巧 二、可重入函数 三、volatile关键字 四、SIGCHLD信号 在信号这一篇中我们已经学习到了一种信号捕捉的调用接口&#xff1a;signal(),为了深入理解操作系统内核中的信号捕获机制&#xff0c;我们今天再来看一个接口&#xff1a;si…

IEC104 协议 | 规约帧格式 / 规约调试

注&#xff1a;本文为 “ IEC104 协议” 相关文章合辑。 未整理去重&#xff0c;如有内容异常请看原文。 图片清晰度限于引文原状。 从零开始理解 IEC104 协议之一 ——104 规约帧格式 洪城小电工 IP 属地&#xff1a;江西 2020.06.10 00:30:54 前言 本文根据相关标准、本…