Fabric.js 1.7.12 发布，简易 JavaScript Canvas 库

最新推荐文章于 2024-07-30 17:53:07 发布
最新推荐文章于 2024-07-30 17:53:07 发布
阅读量146 收藏
点赞数
文章标签： javascript ViewUI
原文链接：https://yq.aliyun.com/articles/109607
版权

Fabric.js 1.7.12 已发布，Fabric.js 是一款简单而强大的 JavaScript Canvas 库，在 HTML5 Canvas 元素之上提供了互动的对象模型，同时还包含 Canvas-to-SVG 解析器。

使用 Fabric.js 你可以创建和填充画布上的对象，从简单的几何图形到成百上千路径组成的复杂图形。你可以通过鼠标轻松的移动、缩放和旋转这些对象，修改它们的属性（颜色、透明度，层叠顺序）等等。

image

更新内容：

Fix: removed possible memleaks from window resize event. #3984
Fix: restored default cursor to noTarget only. unselectable objects get the standard hovercursor. #3953
Cache fixes: fix uncached pathGroup, removed cache creation at initialize time #3982
Improvement: nextTarget to mouseOut and prevTarget to mouseOver #3900
Improvement: add isClick boolean to left mouse up #3898
Fix: can start selection on top of non selectable object #3892
Improvement: better management of right/middle click #3888
Fix: subTargetCheck on activeObject/activeGroup was firing too many events #3909
Fix: After addWithUpdate or removeWithUpdate object coords must be updated. #3911

weixin_33736832
关注
fabric.js
02-16
Fabric.js Fabric.js是一个易于使用HTML5 canvas元素的框架。 它是画布元素顶部的交互式对象模型。 它也是SVG画布解析器。 使用Fabric.js，您可以在画布上创建和填充对象。 对象，例如简单的几何形状-矩形，圆形，椭圆形，多边形，或更复杂的形状，包含数百或数千个简单路径。 然后，您可以使用鼠标缩放，移动和旋转这些对象。 修改它们的属性-颜色，透明度，z-index等。您还可以一起操纵这些对象-通过简单的鼠标选择将它们分组。 面料非技术介绍 Fabric.js允许您使用JavaScript在网页上HTML <canvas>元素上轻松创建简单的形状，例如矩形，圆形，三角形和其他多边形，或者由许多路径组成的更复杂的形状。 然后，Fabric.js将允许您使用鼠标来操纵这些对象的大小，位置和旋转。 也可以使用Fabric.js库更改这些对象的某些属性，例如它们的
slf4j-api-1.7.12.jar
07-06
`slf4j-api-1.7.12.jar`是SLF4J API的1.7.12版本的实现库，这个版本发布于2015年，它包含了SLF4J的核心接口和类，使得开发者可以在不依赖具体日志实现的情况下编写代码。 在Java开发中，日志记录是非常重要的一部分...
Fabric.js 中文文档
最新发布
shiyzhang
07-30 1686
Fabric.js 是一个功能强大的 canvas 库，它提供了一套丰富的 API 来操作 canvas 元素和上面的对象。通过配置项、方法和事件，开发者可以轻松地在网页上实现复杂的图形和交互设计。上述文档简要介绍了 Fabric.js 的一些基本用法和配置，更多高级功能和细节请参考官方文档。
Fabric.js
热门推荐
qq_40407998的博客
09-15 2万+
Fabric.js是什么 Fabric.js 是一个简化HTML5 Canvas开发的Javascript库，Fabric.js提供了HTML5 Canvas本身缺失的对象模型、交互层、SVG解析器以及其他一整套工具。它是一个完全开源的项目，在MIT下获得授权，多年来一直在维护，近期要发布4.0版本，支持自定义controls。 Fabric.js能做什么 在Canvas画布上创建、填充图形（包括图片、文字、规则图形和复杂路径组成图形）。 给图形填充渐变颜色。 组合图形（包括组合图形、图形文字、图片等）。
Fabric.js: 动态和可交互的HTML5 Canvas库
gitblog_00003的博客
03-09 512
Fabric.js: 动态和可交互的HTML5 Canvas库 fabric.jsJavascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser项目地址:https://gitcode.com/gh_mirrors/fa/fabric.js Fabric.js是一个强大的、动态的、基于对象的JavaScript库，专为在HTML...
fabric.js 学习
weixin_30487701的博客
02-28 89
官网地址：http://fabricjs.com/ git https://github.com/kangax/fabric.js/ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport"...
Python库 | dtale-1.7.12-py2.7.egg
03-25
资源分类：Python库 所属语言：Python 使用前提：需要解压 资源全名：dtale-1.7.12-py2.7.egg 资源来源：官方 安装方法：https://lanzao.blog.csdn.net/article/details/101784059
Python库 | adb_enhanced-1.7.12-py3-none-any.whl
04-27
资源分类：Python库 所属语言：Python 资源全名：adb_enhanced-1.7.12-py3-none-any.whl 资源来源：官方 安装方法：https://lanzao.blog.csdn.net/article/details/101784059
TortoiseSVN64-1.7.12.zip
06-16
TortoiseSVN 1.7.12是该软件的一个较旧版本，发布于2013年。尽管有更新的版本可用，但在某些情况下，如系统兼容性问题或特定项目的需求，用户可能仍需使用这个版本。描述中提到的"如果无法上传文件，使用1.7版本...
fabric.js学习
过客如期的博客
10-12 7069
1.fabric[ˈfæbrɪk']是一个功能强大的运行在的JavaScript库,。fabric为canvas提供了一个交互式对象模型，通过简洁的api就可以在画布上进行丰富的操作。3.在使用过程发现文档阅读比较困难，因此自己在写的时候顺便总结一下，便于后续参考。
Fabricjs是一个可以轻松处理HTML5canvas元素的框架
08-08
Fabric.js是一个可以轻松处理HTML5 canvas元素的框架。 它是一个位于canvas元素顶部的交互式对象模型。 它也是一个SVG到canvas的解析器。
fabricjs画板工具
02-28
fabricjs插件 可以编辑图片缩放等功能
fabric.js介绍
10-25 611
fabric简介
Fabric.js 自定义对象操作方式，自对应边框、边框角等
徊忆羽菲
10-09 1903
自定义选框风格(鼠标框选时) 自定义边界, 控制角 透明控制角 选中后自定义背景色 没有边框 没有控制角 没有边框，没有控制角 自定义光标在对象悬停 元素移动状态 不允许框选 部分元素不能选中(选不到圆) 自定义画布背景色 自定义画布背景图 重叠影象 禁止元素旋转 禁止元素缩放 禁止元素横向移动 禁止元素纵向移动
Fabric.js的使用
weixin_30642267的博客
09-05 2377
最近项目有一个绘制的功能，搜了一圈发现fabric.js口碑不错，但是文档稀缺，于是东看看西搜搜的把项目的需求都给实现了，想分享一下。 篇幅有点长，但看完后可以轻松驾驭fabric。我的项目是基于VUE+webpack的。 先来看一下整体效果 1.安装fabric 在node环境下安装fabric.js需要先安装 jsdom 和canvas ①安装jsdom依赖 ...
Fabric.js简介
04-04 456
在本文中，我将向您介绍Fabric.js -a，使得与HTML5 canvas元素微风工作强大的JavaScript库。 织物提供了一种用于帆布丢失的对象模型，以及一个SVG语法分析器，交互性的层，和一个整体的不可缺少的其他工具套件。 这是一个完全开源的项目，麻省理工学院的许可，多年来与许多贡献。 我开始发现与天然帆布API工作的阵痛后，三年前与面料开发。 我创建了一个交互式的设计编辑器pri...
Canvs的js库：Fabric.js简单强大，用于绘制各种图形
贝格前端工场的博客
03-02 1110
Fabric.js是一个用于创建交互式的HTML5 Canvas应用程序的JavaScript库。它提供了一个简单而强大的API，用于在Web浏览器中绘制和操作图形对象。Fabric.js可以用于创建各种图形应用程序，例如绘图编辑器、图像编辑器、流程图、地图和数据可视化等。
Fabric.js中文文档
百念成诗
03-31 1万+
Fabric.js中文文档导航 说明： 1、本系列如果有两个超链接，则第一个是官方文档链接，第二个是中文文档链接，用/分隔，若不存在第二个链接或第二个链接无法跳转则代表没有或还未完成。 2、本系列大部分代码demo都是参考官方文档自己实践而成，有些地方与官方文档不一样会有说明，也有少部分没有亲自实现直接使用了官网文档的代码。 3、本系列代码使用vue语法，每篇文章的第一个代码片段会有标签和样式部分，其他代码无特殊情况只放部分mounted(){}中的代码或与上文没有重复的核心代码。 Vue中使用fabric
在android中使用rhino，在mianactive中有一个test方法，我需要在/sdcard文件中的test.js调用test方法，应该怎么写请写出详细代码
05-31
首先，需要在Android中导入Rhino库，可以使用以下代码添加依赖项: ```gradle dependencies { implementation 'org.mozilla:rhino:1.7.12' } ``` 然后，可以使用以下代码读取/sdcard/test.js文件中的JavaScript代码，并将其传递给Rhino解释器： ```java Context rhino = Context.enter(); rhino.setOptimizationLevel(-1); Scriptable scope = rhino.initStandardObjects(); File file = new File(Environment.getExternalStorageDirectory(), "test.js"); Reader reader = new FileReader(file); rhino.evaluateReader(scope, reader, "test", 1, null); ``` 在这段代码中，我们使用`Context.enter()`方法创建了一个Rhino上下文，设置了优化级别，并初始化了一个标准的JavaScript对象。然后，我们使用Java IO流读取文件中的JavaScript代码，并使用`rhino.evaluateReader()`方法将其解释为JavaScript脚本。 为了在test.js中调用MainActivity中的test()方法，我们需要将MainActivity对象传递给JavaScript代码中。这可以通过在Rhino上下文中定义Java对象实现，如下所示： ```java Object javaObject = Context.javaToJS(this, scope); ScriptableObject.putProperty(scope, "javaObject", javaObject); ``` 然后，在test.js文件中，我们可以使用以下代码来调用MainActivity中的test()方法： ```javascript javaObject.test(); ``` 完整代码如下： ```java Context rhino = Context.enter(); rhino.setOptimizationLevel(-1); Scriptable scope = rhino.initStandardObjects(); File file = new File(Environment.getExternalStorageDirectory(), "test.js"); Reader reader = new FileReader(file); rhino.evaluateReader(scope, reader, "test", 1, null); Object javaObject = Context.javaToJS(this, scope); ScriptableObject.putProperty(scope, "javaObject", javaObject); // 调用test()方法 String result = (String) ScriptableObject.callMethod(scope.get("javaObject", scope), "test", null, new Object[]{}); ``` 需要注意的是，这里假设test()方法返回一个字符串。如果test()方法返回其他类型的值，则需要调整代码以处理这些值。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值