Documentation of Google Raw Results - Part 1

All Google Search Results from pages 1 – 5 based on the following search string. Listing the website with the title, author and creation date in case it exists and is, for example, a blog entry instead of a Github page or general homepage. For each result, possible modeling libraries are listed and related remarks documented in case some interesting information was already discovered. However, modeling tools that are not library-related are not considered in more detail.

javascript AND web AND (diagramming | drawing) AND (open-source OR open source OR OSS)

Search date: 2022-03-31
→ Number of considered websites 76

• https://modeling-languages.com/javascript-drawing-libraries-diagrams/: "20+ JavaScript libraries to draw your own diagrams (2022 edition)" by Hamza Ed-douibi (Feb 23, 2022)

Mentioned Frameworks/Libraries	Some Remarks based on Website information
JointJS
Rappid	commercial version of JointJS
MxGraph	used by Draw.io no third-party software
GoJS	implementing interactive diagrams
JsUML2 library	discontinued in 2017 UML javascript library
Mindfusion Digram Library	rich set of predefined shapes create own shapes heavily documented
Nomnoml	textual modeling tool
Mermaid.js	focus: generting diagrams from text files depends on D3 and dagre-d3 as diagraming libraries
Diagram.js	used by BPMN.io
State.js	focus: hierachical state machines modeling
Eclipse Sprotty and Eclipse Graphical Language Server Platform (GLSP)	helps create modeling environment
D3	manipulating documents based on data extremely fast
Raphaël	drawing vector art
Draw2D	development stalled
Fabric.js
Paper.js	vector graphic scripting
JsPlumb
p5.js	creating graphics based on Processing
Cytpscape.js	graph analysis and visualization
dagre-d3	uses D3 project is abandoned
vis.js	project is abandoned
React Diagrams
Tldraw	number of shapes simple but clear diagrams VSCode extension available

• https://code.tutsplus.com/articles/best-free-and-open-source-drawing-libraries-in-javascript--cms-37731: "8 Best Free and Open-Source Drawing Libraries in JavaScript" by Monty Shokeen (Aug 20, 2021)

Mentioned Frameworks/Libraries	Some Remarks based on Website information
Two.js	very well documented
Paper.js	focus: vector-based drawings
P5.js	active community
Konva	draw basic shapes as well as adding animations
Fabric.js
Snap.svg	create vector graphics
SVG.js	animate or draw SVG
JS Sequence Diagrams	depends on Snap.svg among other libraries for UML diagrams

• https://ourcodeworld.com/articles/read/159/top-5-best-free-diagrams-javascript-libraries: "Top 5 : Best free diagrams javascript libraries" by Carlos Delgado (May 30, 2016)

Mentioned Frameworks/Libraries	Some Remarks based on Website information
Mermaid
Flowchart	draw flow charts
JS Sequence Diagrams	turn text into UML sequence diagrams uses Raphaël
Cytoscape.js	for graph analysis and visualization
Joint.js	create static diagrams or fully interactive diagramming tools
GoJS.js	paid library

• https://hackernoon.com/my-top-13-javascript-diagram-libraries-g2a53z6u: "My Top 13 JavaScript Diagram Libraries" (May 21, 2020)

Mentioned Frameworks/Libraries	Some Remarks based on Website information
Basic Primitives Diagram	for dependencies visualization and analysis no dependencies to third-party libraries
DHTMLX Diagram	fast rendering and high performance only commercial licenses
GoJS	detailed documentation extremely fast commercial licenses, only for academic and educational purposes free
Google Charts	for org charts
JSPlumbtoolkit	textual modeling tool only commercial licenses
Kendo UI	only commercial licenses
MxGraph	used by Draw.io no third-party plugins user manuals available regular fixes and updates free
OrgChart JS (BalkanGraph)	focus org charts only commercial licenses
Rappid / JointJS	Rappid: commercial but JoinsJs free for building diagramming/ modeling applications
Syncfusion	build interactive diagrams examples and documentation only commercial licenses
Treant.js	focus: tree diagrams uses Raphaël free
Webix Organogram	focus: org charts only commercial licenses
yFiles for HTML	only commercial licenses

• https://github.com/jgraph/drawio

  → code for diagramming application: DrawIO → uses Mxgraph

• https://www.goodfirms.co/blog/best-free-open-source-diagram-software-solutions: "The Best 8 Free and Open Source Diagram Software Solutions" by Andrea Hernandez

  → diagramming tools not modeling libraries

• https://p5js.org/

  → p5.js

• https://www.chartjs.org/

  → Chart.js

• https://lzomedia.com/blog/8-best-free-and-open-source-drawing-libraries-in-javascript/: "8 Best Free and Open Source Drawing Libraries in JavaScript"

  → Content taken from above Code Tutplus Page

• https://gojs.net/latest/index.html

  → GoJS

• https://gojs.net/latest/index.html?gclid=EAIaIQobChMIrOfk6-7v9gIVx-J3Ch2PdgrVEAMYASAAEgL3xfD_BwE

  → GoJS

• https://www.diagrams.net/

  → Diagramming tool (based on MxGraph)

• https://www.yworks.com/products/yed

  → Diagramming tool and not web-based

• https://opensource.com/article/18/8/flowchart-diagramming-linux: "9 flowchart and diagramming tools for Linux" by Chris Hermansen (August 22, 2018)

  → Tools not libraries

• https://mermaid-js.github.io/mermaid/#/

  → Mermaid

• https://plotly.com/javascript/: "Plotly JavaScript Open Source Graphing Library"

  → Plotly (based on D3.js)

• https://processing.org/

  → Tool not library (→ p5.js)

• https://two.js.org/

  → Two.js

• https://d3js.org/

  → D3.js

• https://www.modelio.org/

  → Modeling Tool

• https://go.masterschool.com/industry-leaders-eu?utm_source=google&utm_medium=cpc&utm_id=16606269336&campaignid=16606269336&hsa_acc=2781550509&hsa_cam=16606269336&hsa_grp=131597631981&hsa_ad=589152732154&hsa_net=adwords&hsa_src=g&hsa_ver=3&hsa_mt=p&hsa_kw=open%20source%20software&hsa_tgt=kwd-23880270&gclid=EAIaIQobChMI7ZTYpKHw9gIVErLVCh0NcAGNEAMYASAAEgJgfvD_BwE (shown as Ad)

  → not related

• https://gojs.net/latest/index.html?gclid=EAIaIQobChMI7ZTYpKHw9gIVErLVCh0NcAGNEAMYAiAAEgJ8i_D_BwE (shown as Ad)

  → GoJS

• https://mindfusion.eu/javascript-diagram.html (shown as Ad)

  → Mindfusion JavaScript Diagram

• https://en.wikipedia.org/wiki/Diagrams.net

  → Diagrams.net

• https://graphviz.org/

  → Graphviz visualization software

• https://js.cytoscape.org/

  → Cytoscape.js

• https://www.electronjs.org/apps

  → ElectronJs: Framework für Desktop-Anwendungen

• https://softwarerecs.stackexchange.com/questions/18599/open-source-javascript-libraries-for-generating-process-flow-diagrams: Community Question: "Open-source javascript libraries for generating process flow diagrams" (Apr 9, 2015)

  → Primefaces 5.2 Diagram Component library
  → Javascript InfoVis Toolkit
  → D3.js
  → JsPlumb
  → Essential Diagram for JS (but not open-source)
  → Three.js
  

• https://www.os-js.org/

  → OS.js (Web desktop platform)

• https://openlayers.org/

  → OpenLayers (Focusing on Maps)

• https://medevel.com/open-source-uml-tools/: "16 Popular Free And Open Source UML tools" by Omama Yahia (Aug 14, 2021)

  → Tools not frameworks

• https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API

  → Web Audio API (Focuses on audio and visualizations related to it)

• https://gojs.net/latest/index.html?gclid=EAIaIQobChMI6-LDgOfw9gIV1eFRCh0IeQvsEAMYASAAEgJnwfD_BwE (shown as Ad)

  → GoJS

• https://mindfusion.eu/javascript-diagram.html (shown as Ad)

  → Mindfusion JavaScript Diagram

• http://www.amcharts.com/javascript-charts/?gclid=EAIaIQobChMIitvgxO_w9gIVlrt3Ch1vVQu_EAAYAiAAEgLGkPD_BwE (shown as Ad)

  → amCharts (data visualization)

• https://www.pwc.de/de/digitale-transformation/open-source-software-management-und-compliance.html?utm_source=google&utm_medium=cpc&utm_campaign=open_source_software&gclid=EAIaIQobChMIitvgxO_w9gIVlrt3Ch1vVQu_EAAYAyAAEgLUY_D_BwE (shown as Ad)

  → not related

• https://dhtmlx.com/docs/products/dhtmlxDiagram/?gclid=EAIaIQobChMIitvgxO_w9gIVlrt3Ch1vVQu_EAAYBCAAEgLUwvD_BwE (shown as Ad)

  → DHTMLX Diagram library

• https://brainhub.eu/library/javascript-open-source-projects/: "Top 20 JavaScript Open Source Projects On GitHub" (Apr 13, 2021)

Mentioned Frameworks/Libraries	Some Remarks based on Website information
React
TensorFlow.js	Machine learning not modeling library
Node.js	JS runtime environment not modeling library
AngularJS	Front-End JS framework not modeling library
jQuery	not modeling library
npm	package manager not modeling library
Vue.js	design and organize web applications not modeling library
Ember.js	to create single-page web applications not modeling library
MeteorJS	not modeling library
Polymer	build reusable widgets among other things, not modeling library
Math.js	math functions among other things, not modeling library
Jest	testing framework, not modeling library
Prettier	code formatter not modeling library
Chance	random generator helper not modeling library
Chartify	build charts but not modeling library
localForage	JS storage library not modeling library
Tone.js	audio framework not modeling library
draw.io	web diagramming application
mxGraph
Mermaid
Spacetime	not modeling library

• https://owasp.org/www-project-threat-dragon/

  → Threat Dragon (threat modeling)

• https://leafletjs.com/

  → Leaflet.js (for interactive maps)

• https://threejs.org/

  → Three.js (intended for VR content)

• https://www.jointjs.com/

  → Rappid (commercial)
  → JointJS

• https://web.chemdoodle.com/

  → CheDoode Web Components (chemical graphics and cheminformatics)

• https://gephi.org/

  → Open Graph Viz Platform (software)

• https://js.wiki/

  → Wiki.js (open source Wiki software)

• http://literallycanvas.com/

  → Literally Canvas (not maintained and outdated)

• http://paperjs.org/

  → Paper.js

• https://www.bta-weiterbildung.de/weiterbildungen/php-frameworks-laravel-vue-react?gclid=EAIaIQobChMIitvgxO_w9gIVlrt3Ch1vVQu_EAMYASAAEgITn_D_BwE (shown as Ad)

  → not related

• https://gojs.net/latest/index.html?gclid=EAIaIQobChMIitvgxO_w9gIVlrt3Ch1vVQu_EAMYAiAAEgKUTvD_BwE (shown as Ad)

  → GoJS

• https://www.izito.de/ws?q=javascript%20developers&asid=iz_de_gc5_03&mt=b&nw=g&de=c&ap=&ac=1839&cid=1747163231&aid=73912596212&locale=de_DE&gclid=EAIaIQobChMIitvgxO_w9gIVlrt3Ch1vVQu_EAMYAyAAEgKXdfD_BwE (shown as Ad)

  → new websearch on izito

• https://www.brainiuminfotech.com/services/web-development/web-development.php?gclid=EAIaIQobChMI9tW0lffw9gIVzdvVCh1N_Ax7EAAYASAAEgKY7PD_BwE (shown as Ad)

  → not related

• https://www.gigaguenstig.de/ws?q=free%20web%20designer%20software&asid=giga_de_gc3_02&mt=b&nw=g&de=c&ap=&ac=5369&cid=9027905195&aid=91701635979&locale=de_DE&gclid=EAIaIQobChMI9tW0lffw9gIVzdvVCh1N_Ax7EAAYAiAAEgJ_j_D_BwE (shown as Ad)

  → new websearch on gigagünstig

• https://www.pwc.de/de/digitale-transformation/open-source-software-management-und-compliance.html?utm_source=google&utm_medium=cpc&utm_campaign=open_source_software&gclid=EAIaIQobChMI9tW0lffw9gIVzdvVCh1N_Ax7EAAYAyAAEgKJ0fD_BwE (shown as Ad)

  → not related

• https://www.getapp.com/p/sem/diagram-software/?t=Best%20Diagram%20Software&camp=adw_search&utm_content=g&utm_source=ps-google&utm_campaign=COM_EMEA_Desktop_BR-Diagram&utm_medium=cpc&account_campaign_id=2060873242&account_adgroup_id=79837502041&ad_id=367729302921&utm_term=diagram%20software&matchtype=b&gclid=EAIaIQobChMI9tW0lffw9gIVzdvVCh1N_Ax7EAAYBCAAEgIR0PD_BwE (shown as Ad)

  → MindManager
  → Rappid
  

• https://jsxgraph.uni-bayreuth.de/wp/index.html

  → JSXGraph (interactive geometry, data visualization and function plotting)

• https://c4model.com/

  → C4 modeling language, not modeling library

• https://www.sigmajs.org/

  → Sigma.js (visualize graphs of many nodes and edges)

• https://cloudblogs.microsoft.com/opensource/tag/javascript/

  → not related

• https://strapi.io/

  → not modeling library

• https://togetherjs.com/

  → TogetherJS (collaboration tools and features)

• https://developers.google.com/maps/documentation/javascript/libraries-open-source

  → not modeling related

• https://code.nasa.gov/

  → not related

• https://interactjs.io/

  → interact.js

• [http://sv-eintracht-theissen.de › animate-leaflet-map]

  → could not be loaded

• https://delphiparser.com/product/code-dependencies-analyzing-wizard-evaluation-edition/?gadw=free&gclid=EAIaIQobChMI9tW0lffw9gIVzdvVCh1N_Ax7EAMYASAAEgJaAvD_BwE (shown as Ad)

  → not related

• https://de.seekweb.com/ws?q=roadmap%20tool%20open%20source&asid=sw_de_gc2_04&mt=b&nw=g&de=c&ap=&ac=15252&cid=12601103023&aid=121112759498&locale=de_DE&gclid=EAIaIQobChMI9tW0lffw9gIVzdvVCh1N_Ax7EAMYAiAAEgJmhfD_BwE (shown as Ad)

  → new websearch on Seekweb

• https://mindfusion.eu/javascript-diagram.html (shown as Ad)

  → Mindfusion JavaScript Diagram

---

Last update: 2022-08-31