首页 > 其他分享 >史上最全SVG开源项目

史上最全SVG开源项目

时间:2023-12-18 21:45:38浏览次数:29  
标签:github SVG 最全 地址 开源 Git https com

史上最全SVG开源项目

徐大大 徐大大 中文   3 人赞同了该文章

SVG(Scalable Vector Graphics)是一种矢量图形格式,它提供了一种可以在网络上高效描述矢量图形的方法,其标准最初由W3C制定,于1999年发布SVG规范1.0版本。

在HTML5之前,SVG只能作为插件运行在浏览器中,存在诸多的限制和安全问题。2014 年,SVG迎来了发展的重要时刻, W3C 正式宣布 HTML5 成为推荐标准,并决定将 SVG 整合到这个全新的 Web 标准中。这意味着浏览器制造商开始为 SVG提供原生支持,使得开发者可以更方便地使用 SVG 创造交互式、可扩展的 Web 内容和图形展示。

SVG和Canvas是当前Web端图形处理的两大主流技术,有着各自的优势和适用场景。Canvas 2D图形应用开发相关的开源项目详见另一篇文章《史上最全Canvas 2D 开源项目》。

SVG规范

SVG规范最新草案版本( W3C Editor’s Draft 08 March 2023)

https://svgwg.org/svg2-draft/

SVG规范推荐版本(W3C Candidate Recommendation 04 October 2018)

https://www.w3.org/TR/2018/CR-SVG2-20181004/

SVG GitHub 仓库

https://github.com/w3c/svgwg/

SVG图形应用开发相关的开源项目

1、 svgo

SVG文件压缩和优化。

SVGO, short for SVG Optimizer, is a Node.js library and command-line application for optimizing SVG files.

Git项目地址

https://github.com/svg/svgo

Demo地址

https://svgo.dev/docs/plugins/

2、 svgedit

基于浏览器的SVG图形编辑工具

Powerful SVG-Editor for your browser。

Git项目地址

https://github.com/SVG-Edit/svgedit

Demo地址

https://svgedit.netlify.app/editor/index.html

3、 Snap.svg

Snap.svg提供强大且直观的SVG动画内容操纵API,支持屏蔽、裁剪、全梯度和组别等使得内容更具吸引力和交互性的功能。

The JavaScript library for modern SVG graphics.

Git项目地址

https://github.com/adobe-webplatform/Snap.svg

Demo地址

http://snapsvg.io/start/

http://snapsvg.io/docs/

4、 svg.js

SVG.js 是一个轻量级的 JavaScript 库,用于创建和操作 SVG 图形。它提供了一组简单易用的 API,使得开发者可以轻松创建各种形状、路径、文本、动画等 SVG 元素,而无需深入了解 SVG 的细节和DOM native API。

A lightweight library for manipulating and animating SVG, without any dependencies.

Git项目地址

https://github.com/svgdotjs/svg.js

Demo地址

https://svgjs.dev/docs/3.0/

5、 HuayouJS

HuayouJS增强了原生SVG所不提供的整体平移(pan)、缩放(zoom)和分层(Layer)等功能。与Snap和svg.js等产品思路显著不同,HuayouJS选择原生方案,支持开发者使用SVG原生对象模型和API开发应用。

HuayouJS is a 2D graphics library based on SVG,which provides Pan, Zoom, and Layer management functions.

Git项目地址

https://github.com/HuayouJS/huayou

Demo地址

https://huayoujs.github.io/huayou/examples/basic/index.html

https://huayoujs.github.io/huayou/examples/scada/index.html

6、 svgr

svgr是一个将SVG转换为React组件的工具。

SVGR is an universal tool to transform SVG into React components.

SVGR takes a raw SVG and transforms it into a ready-to-use React component.

Git项目地址

https://github.com/gregberge/svgr

Demo地址

https://react-svgr.com/

https://react-svgr.com/docs/getting-started/

7、 Font Awesome

一套绝佳的图标字体库和CSS框架。

The iconic SVG, font, and CSS toolkit

Git项目地址

https://github.com/FortAwesome/Font-Awesome

Demo地址

https://fontawesome.com/docs

8、 svg2png

把SVG转成PNG图片。

Converts SVGs to PNGs, using PhantomJS。

Git项目地址

https://github.com/domenic/svg2png

9、 Inkscape

Inkscape 是一款功能强大的开源矢量图形编辑软件。作为一个跨平台的桌面图形编辑工具,它提供了丰富的绘图和设计功能,可用于创建精美的插图、图标、徽标等各种矢量图形。Inkscape 支持 SVG 格式,并提供了丰富的绘图工具、路径编辑、渐变、滤镜等功能。

Git项目地址

https://github.com/inkscape/inkscape

下载地址

www.inkscape.org/

10、MDN SVG Document

目前为止全球最全面、最系统的SVG开发指引,包含入门(Tutorials)、参考(Reference)和指南(Guides)。MDN 提供多语言版本的SVG对象模型和API详细说明,并特别指出浏览器厂商对API的支持情况。

MDN SVG Document地址

https://developer.mozilla.org/e

标签:github,SVG,最全,地址,开源,Git,https,com
From: https://www.cnblogs.com/sexintercourse/p/17912356.html

相关文章

  • Oceanbase开源版 数据库恢复MySQL数据库的过程
    Oceanbase开源版数据库恢复MySQL数据库的过程背景想进行一下Oceanbase数据库的兼容性验证.想着用appcreate数据库的方式周期比较长.所以我想着换一套备份恢复的方式进行数据库的创建直接进行兼容性验证.这里面就需要进行一下数据库的备份恢复了.所以想总结一下.......
  • 白版应用,AI加持的新功能开源!
    Excalidraw把他们的文本到图表的功能开源了Excalidraw是一个虚拟白板应用,专门用于绘制类似手绘的图表。它提供了一个无限的、基于画布的白板,具有手绘风格,支持多种功能。之前我分享的:72张PNG,图解机器学习里面的插图都是用Excalidraw绘制的。6月份我翻译这个图解机器学习时......
  • Docker环境下部署Ghost开源内容管理系统
    一、Ghost介绍1.1Ghost简介Ghost是一款用于博客、出版物和内容网站的免费且开源的CMS(内容管理系统),它是完全基于JavaScript编写的。Ghost的主要特点是简单易用、高度可扩展、精美的设计和优秀的性能。1.2Ghost特点简单易用:Ghost的用户界面非常简单和直观,因此非常易于使用。它提供......
  • 2023 年活力开源贡献者、开源项目揭晓|JeecgBoot 成功入选
    JeecgBoot是一个开源的企业级快速开发平台,它成功入选2023年度生态开源项目,这是对其十年坚持开源的实至名归的认可。作为一个开源项目,JeecgBoot在过去的十年里一直秉承着开放、共享、协作的理念,不断推动着开源社区的发展。其成功入选2023年度生态开源项目,无疑是对其在开源领......
  • 基于php+mysql的一个开源IT资产管理系统——CAT:v1.0.5
    来自作者的一段为提高管理效率,良好发展开源的理想。   来一杯咖啡与茶,为IT运维从业者减轻管理负担,提升管理效率,从繁重无序的工作中解压出来,利用剩余时间多喝一杯休息一下。这是一个专为IT运维从业者打造的一站式解决方案平台,包含资产管理、工单、工作流、仓储等功能模......
  • svg 绘制旗帜
    效果: constdrawFlag=()=>{constviewBox=1024;constpoleHeight=1000;constpoleWidth=60;constpoleX=10;constpoleY=10;constx=poleX+poleWidth;consty=poleY+poleWidth;constwidth=800;constheight=6......
  • 暹罗外卖开源啦,一款java多商户外卖系统-商家入驻如美团饿了么
    暹罗外卖v1.0基于Vue/ElementUI和SpringCloud&Alibaba前后端分离的分布式微服务架构前言微信公众号【暹罗siam】,未来将会在公众号上持续性的输出很多原创小知识以及学习资源,欢迎各位小伙伴关注我,和我一起共同学习,同时我也希望各位小伙伴能够给暹罗外......
  • 动态绘制svg
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=......
  • 推荐一款redis开源的redis桌面管理工具,redislnsight,毕竟是官方出品,功能强大,外观颜值不
    1redislnsight简介RedisInsight是一款可视化工具,提供设计、开发和优化Redis应用程序的能力。查询、分析和与Redis数据进行交互。RedisInsight是一个直观高效的Redis图形用户界面,允许您与数据库交互并管理数据,内置支持Redis模块。2安装github可以访问的直接到如下链接去下载......
  • G-Rilling EMD HHT Matlab 开源代码
    downpackage_emd/EMDs/cemdc.m , 2354package_emd/EMDs/cemdc2.m , 2362package_emd/EMDs/cemdc2_fix.m , 2312package_emd/EMDs/cemdc_fix.m , 2305package_emd/EMDs/emd.m , 22275package_emd/EMDs/emd_local.m , 9897package_emd/EMDs/emd_online.m , 26315pack......