From 4e8a7e0b4c7f2bb9e62c61ce5dc2d6876e9d6aea Mon Sep 17 00:00:00 2001
From: saurabhg772244 <saurabh@mermaidchart.com>
Date: Wed, 21 Aug 2024 19:59:41 +0530
Subject: [PATCH] updated tilted cylinder

---
 .../rendering-elements/shapes/tiltedCylinder.ts       | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/tiltedCylinder.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/tiltedCylinder.ts
index ed05a4f6d..2fabcd482 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/tiltedCylinder.ts
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/tiltedCylinder.ts
@@ -13,6 +13,11 @@ function createCylinderPathD(rx: number, ry: number, w: number, h: number) {
             A ${rx} ${ry} 0 0 0 ${-w / 2} ${h / 2}
             L ${w / 2} ${h / 2}
             A ${rx} ${ry} 0 0 0 ${w / 2} ${-h / 2}
+            `;
+}
+
+function createInnerPathD(rx: number, ry: number, w: number, h: number) {
+  return `M${w / 2} ${-h / 2}
             A ${rx} ${ry} 0 0 0 ${w / 2} ${h / 2}`;
 }
 
@@ -38,7 +43,11 @@ export const tiltedCylinder = async (parent: SVGAElement, node: Node) => {
   const cylinderPath = createCylinderPathD(rx, ry, w, h);
   const cylinderNode = rc.path(cylinderPath, options);
 
-  const tiltedCylinder = shapeSvg.insert(() => cylinderNode, ':first-child');
+  const innerPath = createInnerPathD(rx, ry, w, h);
+  const innerNode = rc.path(innerPath, options);
+
+  let tiltedCylinder = shapeSvg.insert(() => innerNode, ':first-child');
+  tiltedCylinder = shapeSvg.insert(() => cylinderNode, ':first-child');
 
   tiltedCylinder.attr('class', 'basic label-container');