EdgeIt.JS 自动提取透明图片的图像轮廓，并进行描边

原创

房东的狗丶

发布于 2025-03-01 10:39:36

10200

代码可运行

文章被收录于专栏：友人a的笔记丶友人a的笔记丶

运行总次数：0

代码可运行

EdgeIt

基于Canvas的智能图片描边处理库，自动提取透明图片的图像轮廓，并进行描边 | 在线演示 | 在线文档

🚀 核心特性

智能边缘检测算法
抗锯齿描边渲染
零依赖，纯原生实现

📦 安装方式

npm install edgeit.js
# 或
yarn add edgeit.js

🛠 基础用法

const processor = new EdgeIt({
    strokeColor: '#ff3b30', // 描边颜色
    strokeWidth: 4          // 描边宽度（像素）
});

// 处理网络图片
processor.process('https://example.com/image.jpg')
    .then(result => document.body.appendChild(result));

⚙️ 配置选项

参数	类型	默认值	说明
`strokeColor`	String	`#000000`	描边颜色（支持 CSS 颜色格式）
`strokeWidth`	Number	`2`	描边宽度（像素）
`cache`	Boolean	`true`	缓存图片对象，下次不用重新加载
`willReadFrequently`	Boolean	`true`	启用抗锯齿
`imageSmoothing`	Boolean	`true`	启用imageSmoothing
`width`	Number	`null`	指定输出图像的宽度 (可选）
`height`	Number	`null`	指定输出图像的高度（可选）

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

canvas

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

canvas

登录后参与评论

0 条评论

热度

EdgeIt.JS 自动提取透明图片的图像轮廓，并进行描边

EdgeIt.JS 自动提取透明图片的图像轮廓，并进行描边

EdgeIt

🚀 核心特性

📦 安装方式

🛠 基础用法

⚙️ 配置选项

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐