Skip to main content

Release 1.2.2

· 2 min read

Release 1.2.2 is now available, with new background components for Angular and Vue, as well some reactivity enhancements to Angular and Svelte, overlays, and some minor fixes and improvements. Also in this release we've pushed a version of our popular AI Agent Builder for Svelte and Vue.

General​

  • Internal updates to the update*** methods to ensure that any associated type change is grouped along with the updates in a transaction.
  • Added new relayoutOnVertexRemove option to Surface and Paper. Useful when you're using a static layout such as the Hierarchy layout.

Vue​

  • Added BackgroundComponent, GridBackgroundComponent, ImageBackgroundComponent and TiledImageBackgroundComponent
  • Internal updates to the re-render mechanism
  • Introduced edge specific VueEdgeWrapperProps interface for overlay component props

Angular​

  • Added BackgroundComponent, GridBackgroundComponent, ImageBackgroundComponent and TiledImageBackgroundComponent
  • Added new $edgeData(), $sourceData() and $targetData() signals to the BaseAngularOverlayComponent. These give you reactive access to the data for the edge and for its source and target vertices.

Svelte​

  • Added BackgroundComponent, GridBackgroundComponent, ImageBackgroundComponent and TiledImageBackgroundComponent
  • Added usePaper hook
  • Added hide prop to the snippet passed to SurfacePopup.
  • Updated Svelte component overlays to make the edge (and its source/target) reactive, so the overlay can now show a live view of the edge's backing data or that of its source/target.

Issue Fixes​

  • #5 - Lasso consumes tap event on edge
  • Vue/Angular Fix for the SurfacePopup's hide function - it was not locating the ref correctly.

Breaking​

  • The refreshLayoutOnEdgeConnect Surface/Paper render option was renamed to relayoutOnEdgeConnect

Try VisuallyJs​

VisuallyJs offers an extensive list of starter apps, diagrams, charts and dashboards to quick start your development, in React, Angular, Vue, Svelte and Typescript/Javascript.

VisuallyJs - build diagrams and rich visual UIs fast
Call Flow
Use VisuallyJs to build a visual Call Flow editor
VisuallyJs - effortlessly build professional node based UIs with Javascript, Typescript, React, Svelte, Angular and Vue
AI Agent Builder
Use VisuallyJs to create an advanced AI agent builder
VisuallyJs - build diagrams and rich visual UIs fast
Chatbot
Use VisuallyJs to build a Chatbot editor, with actions, messages, input and choices
When you've reached the limits with ReactFlow, VisuallyJs has what you need
Flowchart
Fully featured flowchart builder including support for custom shapes, edge routing to avoid vertices, shape resize/rotate, SVG/PNG/JPG export and more
VisuallyJs - JavaScript and Typescript diagramming library that fuels exceptional UIs
BPMN
BPMN editor for modelling the steps of a business process. Pools, lanes, and a full set of task, event and gateway types
When you've reached the limits with ngDiagram, VisuallyJs has what you need
ERD
ERD editor for modelling the steps of a business process
VisuallyJs - callflow builders, sankey charts, database schemas, ERD diagrams and more
Gantt
Interactive Gantt chart featuring tasks, task groups and milestones
VisuallyJs - fully featured alternative to ReactFlow and ngDiagram
Kanban
Fully featured Kanban board. Drag items between columns and use the inspector to update items and columns
When you've reached the limits with ngDiagram, VisuallyJs has what you need
Database Schema
Database Schema builder with support for tables, views, multiple columns types, and column relationships
When you've reached the limits with ngDiagram, VisuallyJs has what you need
Org Chart
Uses the classic org chart layout and provides an inspector from which the user can navigate around
VisuallyJs - leading alternative to GoJS, JointJS, ReactFlow and SvelteFlow
Circuit Diagram
Fully featured starter app containing a circuit diagram builder
VisuallyJs - fully featured alternative to ReactFlow and ngDiagram
Scada/HMI
Professional and modern Scada/HMI application with fluid, heating/cooling & instrumentation shapes, adhering to the HMI ISA-101 Design Standard
VisuallyJs - build diagrams and rich visual UIs fast
Mindmap
The mindmap builder highlights several advanced features, such as custom layouts, parsers and exporters
When you've reached the limits with ngDiagram, VisuallyJs has what you need
Neighbourhood Views
Demonstrates how to include multiple views of a dataset on one page
When you've reached the limits with SvelteFlow, VisuallyJs has what you need
Logic Gates
Fully featured starter app containing a logic gates diagram builder
When you've reached the limits with ReactFlow, VisuallyJs has what you need
Template
Basic starter app demonstrating how to setup VisuallyJs and its main features
When you've reached the limits with SvelteFlow, VisuallyJs has what you need
Area & Line charts
Use VisuallyJs to create area and line charts
VisuallyJs - build diagrams and rich visual UIs fast
Bar & Column charts
Multiple series, stacked, grouped, pivoted, and much more
When you've reached the limits with ReactFlow, VisuallyJs has what you need
Scatter & Bubble charts
Circle, rectangle, triangle or custom markers, multiple series, fully customizable
When you've reached the limits with ReactFlow, VisuallyJs has what you need
Sankey chart
Use VisuallyJs to create a professional Sankey chart, with support for pivoting
VisuallyJs - flowcharts, AI Agent builders, chatbots, bar charts, decision trees, mindmaps, org charts and more
Supply Chain Analyzer
Dashboard for managing and analyzing supply chains
VisuallyJs - callflow builders, sankey charts, database schemas, ERD diagrams and more
Network Infrastructure
Combine a network management diagram with charts showing projected cost and resource usage
VisuallyJs - callflow builders, sankey charts, database schemas, ERD diagrams and more
Scrolling Lists
Use the ListManager plugin to manage scrolling lists: as elements are scrolled out of the view, their edges are moved to the list container
VisuallyJs - flowcharts, AI Agent builders, chatbots, bar charts, decision trees, mindmaps, org charts and more
FIFA World Cup
A visualizer for the FIFA World cup - group stages, team journeys and a tournament view.
When you've reached the limits with ReactFlow, VisuallyJs has what you need
Fault Tree Analysis
Combines a fault tree analysis diagram with charts showing risk and list of cut sets