[Recurrent] Upgrade mermaid.js to the latest version x.y.z

Feature requests
,
21

Adding that I would love this upgrade. Ideally to latest at v11.1.0 which also adds architecture as a diagram type.

I think in general a planned cadence of upgrading Mermaid would be good (every 3 months or something like that?), so that Obsidian keeps up to date with latest features. Mermaid seems to be doing upgrades at a good pace, and it would be nice if we could know that Obsidian will be current withing X amount of time.

2 Likes
22

I am looking forward to being able to control the layout with block diagrams!

23

I would love to get access to architecture diagrams. I have started using them elsewhere and being able to start integrating them into my personal documentation

24

I would love if the new version would be v11.0.0 or newer, since that adds Packet Diagrams which is just perfect for my every day work. I hope a new mermaid version is in scope sometime in the near future <3

2 Likes
25

Bumping this, my mermaid chart fails to render on Obsidian, but it works on the official mermaid live editor.

26

I would suggest sharing the code, or the specific feature that isn’t working for you. While you wait for an upgrade, someone might have a suggested workaround, or spot a syntax problem.

Or if it seems like something really important, maybe upgrading will get higher priority. Either way, I suggest giving more info about your problem.

27

Sure.

OS: Fedora Linux 40
Obsidian version: v1.6.7 (Flatpak)
Only one community plugin installed (Self-hosted LiveSync)

Code (Uncomment the last two lines to reproduce):

```mermaid
flowchart TB
    user{External user}

    subgraph sitea[Site A]
    
	    subgraph sitearpi4b["Raspberry Pi 4B (Home Assistant OS)"]
		    siteaadguardhome[AdGuardHome]
		    siteachrony[Chrony]
		    siteatailscale((Tailscale))
	    end
	    
		subgraph siteads220["Synology DS220+ (DSM7)"]
		    siteahyperbackup["Hyper Backup"]
		    
			subgraph siteadebian["Debian (VM)"]
				siteacups[CUPS]
				siteascanservjs[Scanservjs]
			end
	    end

		subgraph siteamt6000["GL-iNET MT6000 (OpenWRT)"]
			siteanginx[luci-ssl-nginx]
			siteaacme[luci-app-acme]
			siteawireguard[luci-proto-wireguard]
		end
		
	end
	
    subgraph siteb[Site B]
		subgraph sitebjonsbon2["Jonsbo N2 (TrueNAS Scale)"]
			sitebdemocratic_csi[democratic-csi]
			sitebtruenas_rsync[rsync]
			sitebpbs["Proxmox Backup Server (VM)"]
			sitebvault["Hashicorp Vault (Docker)"]
		end

		subgraph sitebformdt1["Formd T1 (Proxmox)"]
			subgraph sitebdebian1["Debian (VM)"]
				sitebwolf[games-on-whales]
			end
			
			subgraph sitebdebian2["Debian (VM)"]
				sitebk8s_worker1["Kubernetes (Worker)"]
			end
			
			subgraph sitebdmz[DMZ]
				subgraph sitebcentos1["CentOS Stream (VM)"]
					sitebdmz_nginx[nginx]
					sitebdmz_ddclient[ddclient]
					sitebdmz_certbot[certbot]
					sitebdmz_blog["Personal blog"]
				end
				
				subgraph sitebcentos2["CentOS Stream (VM)"]
					sitebdmz_javaproj["Java project"]
				end
			end
		end

		subgraph sitebrpi4b1["Raspberry Pi 4B (Home Assistant OS)"]
		    sitebadguardhome[AdGuardHome]
		    sitebchrony[Chrony]
		    sitebtailscale((Tailscale))
	    end

		subgraph sitebj4125["Cnction J4125 (OpenWRT)"]
			sitebddns[luci-app-ddns]
			sitebwireguard[luci-proto-wireguard]
			sitebwol[luci-app-wol]
		end
	
		subgraph sitebwax220["Netgear WAX220 (OpenWRT)"]
			sitebnginx[luci-ssl-nginx]
			sitebacme[luci-app-acme]
		end

		subgraph sitebrpi4b2["Raspberry Pi 4B (PiKVM)"]
		end
		
		subgraph sitebrpi4zero2w["Raspberry Pi Zero 2 W (PiKVM)"]
		end

		subgraph sitebrpi5["Raspberry Pi 5 (Raspberry Pi OS)"]
			sitebk8s_control_plane1["Kubernetes (Control Plane)"]
		end

		subgraph sitebn100["BKHD N100 (Proxmox)"]
			subgraph sitebdebian3["Debian (VM)"]
				sitebk8s_worker2["Kubernetes (Worker)"]
			end
		end

		subgraph sitebk8s["Kubernetes Cluster"]
			k8s_lavalink[Lavalink]
			k8s_discordbot["Discord Bot"]
			k8s_freshrss[FreshRSS]
			k8s_couchdb[CouchDB]
			k8s_dashy[Dashy]
			k8s_postgres[Postgres]
			k8s_fireflyiii["Firefly III"]
			subgraph sitebhelm["Helm charts"]
				sitebk8s_kube_prometheus_stack{{kube-prometheus-stack}}
				sitebk8s_external_secrets{{external-secrets}}
				sitebk8s_argocd{{argo-cd}}
				sitebk8s_cert_manager{{cert-manager}}
				sitebk8s_metallb{{metallb}}
				sitebk8s_ingress_nginx{{ingress-nginx}}
				sitebk8s_external_dns{{external-dns}}
				sitebk8s_cilium{{cilium}}
			end
		end
    end

	%% sitea connections
	siteanginx --> siteads220
	siteanginx --> sitearpi4b

	%% siteb connections
	sitebnginx --> sitebjonsbon2
	sitebnginx --> sitebformdt1
	sitebnginx --> sitebrpi4b1
	sitebnginx --> sitebrpi4b2
	sitebnginx --> sitebrpi4zero2w
	sitebdmz_nginx --> sitebcentos2
	sitebdmz_nginx --> sitebdmz_blog

	sitebk8s_control_plane1 <--> sitebk8s
	sitebk8s_worker2 <--> sitebk8s
	sitebk8s --> sitebdemocratic_csi
	sitebk8s_external_secrets --> sitebvault

	%% Cross site connections
	sitebtruenas_rsync <--> siteahyperbackup
	sitebwireguard <--> siteawireguard

	%% External user connection
	user --(Wireguard)--> siteanginx
	user --(Wireguard)--> sitebnginx
	user --(Wireguard)--> sitebk8s_ingress_nginx

	user --Tailscale--> siteatailscale
	user --Tailscale--> sitebtailscale

	%% These two lines crash mermaid in obsidian
	%%user --> sitebdmz_nginx
	%%sitebk8s_worker1 <--> sitebk8s
```
1 Like
28

Now that mermaid.js supports an expanded catalogue of shapes out of the box it has become my go to, but it was introduced in v11.3.0 and whatever version is in obsidian atm, is too old. The feature I’m needing but Obsidian is unable to render is this one:

I’m on Obsidian v1.7.4 snap

1 Like
29

Seconding this, I’m also really in need of this creating and deleting feature, without it my sequence diagrams end up with very wide graphics with lots of vertical lines for nodes that are used only twice

30

I want to draw flowchart with math in node value but it won’t render in Obsidian side. I don’t know when this feature is introduced to Mermaid, but I hope Obsidian would bump its Mermaid version that includes math! Pretty please :smiling_face_with_tear: