InfluxDB is the Time Series Platform where developers build real-time applications for analytics, IoT and cloud-native services. Easy to start, it is available in the cloud or on-premises. Learn more →
Top 23 JavaScript SVG Projects
-
Project mention: [E] I'd like to learn how to make high-quality interactive visualizations to explain statistical topics. (See example in post) | reddit.com/r/statistics | 2023-01-18
This is the source code for the distill pub you linked to: https://github.com/distillpub/post--visual-exploration-gaussian-processes. I dug through the code a little and believe most of the interactive visuals were created with d3.js. That's certainly 1 of the options you can use to recreate the same type of visuals. d3 is incredibly powerful (it's the tool professional news organisations use for their visualisations) but also rather complex. If you are new to Javascript in general, it might not be the most practical choice.
-
Project mention: does anyone know how are these cool web design effects and designs made? | reddit.com/r/web_design | 2023-02-01
-
Appwrite
Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!
-
Project mention: How to create a Youtube Studio like confetti ? Is this possible using just css? | reddit.com/r/css | 2023-01-15
mo.js or anime.js are both really great libraries to do these types of animations with—they have really smooth, performant animation
-
sharp
High performance Node.js image processing, the fastest module to resize JPEG, PNG, WebP, AVIF and TIFF images. Uses the libvips library.
-
1️⃣Freepik 2️⃣Glyphis 3️⃣Font Awesome 4️⃣Smashicons 5️⃣Iconfinder 6️⃣Shape so 7️⃣Flaticon 8️⃣The Noun Project 9️⃣IcoMoon 1️⃣0️⃣Icons8 1️⃣1️⃣Iconmonstr 1️⃣2️⃣Feather Icons 1️⃣3️⃣Material Icons
-
-
Look at software you use and identify underlying libraries.
SVGO https://github.com/svg/svgo is used by many graphics software but hasn't seen donations commensurate with usage https://opencollective.com/svgo
-
InfluxDB
Build time-series-based applications quickly and at scale.. InfluxDB is the Time Series Platform where developers build real-time applications for analytics, IoT and cloud-native services. Easy to start, it is available in the cloud or on-premises.
-
Fairphone Icon on https://simpleicons.org/
-
Project mention: [Showoff Saturday] I made a thing that shows you your valorant match stats | reddit.com/r/webdev | 2023-01-28
charts: https://frappe.io/charts
-
SuperTinyIcons
Under 1KB each! Super Tiny Icons are miniscule SVG versions of your favourite website and app logos
-
Snap SVG : The JavaScript SVG library for the modern web
-
1. Apex Charts
-
DOMPurify
DOMPurify - a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. DOMPurify works with a secure default, but offers a lot of configurability and hooks. Demo:
It's also important to sanitize user input to prevent the injection of malicious code. There are several libraries that can help you with this such as xss-clean, dompurify or santize-html.
-
Project mention: Launched my ADHD productivity app on product hunt - would love your support | reddit.com/r/ADHD_Programmers | 2022-11-12
Eh, I have no reason to, and not much interest in PHP anymore. Things like Vega seem really cool.
-
Project mention: [AskJS] Is there any javascript library that can perform boolean operations on svg paths (union, subtract, intersect, difference)? | reddit.com/r/javascript | 2022-07-28
Thanks for the link to this great and useful library. It's really awesome, and I didn't know there was a node.js version. But it seems that it doesn't support boolean operations, or at least I haven't found it in the documentation. There is only the following github issue with no answer: https://github.com/svgdotjs/svg.js/issues/339 And a request for an intersection function that doesn't seem to be implemented: https://github.com/svgdotjs/svg.js/issues/1200 Maybe I'm missing something?
-
-
Looking here: https://github.com/c3js/c3/issues/2831
-
-
Project mention: Trying to build a front end interactive browser or app experience where touch to screen simulates a visual heat map. | reddit.com/r/webdev | 2022-11-25
Javascript touch events paired with WebGL would be the route I’d go. There are some really great libraries for WebGL (twojs) or working with SVG (mojs) if you want to keep it simple
-
You might like these as well: https://github.com/primer/octicons
-
-
Project mention: Library suggestions for creating unidirectional graphs or flowcharts. | reddit.com/r/reactjs | 2022-10-22
Check out https://jsplumbtoolkit.com/
-
Now let’s define the asset for bootstrap5 Icons.
-
Sonar
Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.
NOTE:
The open source projects on this list are ordered by number of github stars.
The number of mentions indicates repo mentiontions in the last 12 Months or
since we started tracking (Dec 2020).
The latest post mention was on 2023-02-01.
JavaScript SVG related posts
- Flowchart editor dgrm.net / announcement / sequence diagrams support
- [Showoff Saturday] I made a thing that shows you your valorant match stats
- How SVG file is Animated like this? Server Side Rendering??
- Opensource Alternative to Ookla Speed Test
- Shields.io: Twitter badges are broken now
- [E] I'd like to learn how to make high-quality interactive visualizations to explain statistical topics. (See example in post)
- What's 538's tech stack?
-
A note from our sponsor - InfluxDB
www.influxdata.com | 5 Feb 2023
Index
What are some of the best open-source SVG projects in JavaScript? This list will help you:
| Project | Stars | |
|---|---|---|
| 1 | d3 | 104,244 |
| 2 | three.js | 88,625 |
| 3 | anime.js | 44,289 |
| 4 | sharp | 24,382 |
| 5 | feather | 23,098 |
| 6 | shields | 18,979 |
| 7 | svgo | 18,836 |
| 8 | simple-icons | 14,897 |
| 9 | Frappe Charts | 14,620 |
| 10 | SuperTinyIcons | 13,785 |
| 11 | Snap.svg | 13,648 |
| 12 | apexcharts.js | 12,217 |
| 13 | DOMPurify | 10,338 |
| 14 | vega | 10,198 |
| 15 | svg.js | 10,063 |
| 16 | zdog | 9,515 |
| 17 | c3 | 9,239 |
| 18 | dom-to-image | 9,162 |
| 19 | two.js | 7,929 |
| 20 | octicons | 7,633 |
| 21 | chart.xkcd | 7,341 |
| 22 | jsplumb | 7,289 |
| 23 | icons | 6,561 |
Write Clean JavaScript Code. Always.
Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.
www.sonarsource.com