@@ -209,20 +209,29 @@ <h3 class="text-base md:text-lg font-semibold mb-2">Simple Integration</h3>
209209 nodesGroup . appendChild ( circle ) ;
210210 }
211211
212- const text = document . createElementNS ( 'http://www.w3.org/2000/svg' , 'text' ) ;
213- text . setAttribute ( 'x' , node . x ) ;
214- // Adjust y position for triangle vs circle
215- if ( node . label === 'PROCESSING HUB' ) {
216- text . setAttribute ( 'y' , node . y - node . radius - 10 ) ;
212+ if ( node . label . includes ( 'ENDPOINT' ) ) {
213+ // add text inside
214+ const text = document . createElementNS ( 'http://www.w3.org/2000/svg' , 'text' ) ;
215+ text . setAttribute ( 'x' , node . x ) ;
216+ text . setAttribute ( 'y' , node . y + 4 ) ;
217+ text . setAttribute ( 'text-anchor' , 'middle' ) ;
218+ text . setAttribute ( 'fill' , '#6B7280' ) ;
219+ text . setAttribute ( 'font-size' , '14' ) ;
220+ text . setAttribute ( 'font-family' , 'monospace' ) ;
221+ text . textContent = node . label . split ( '-' ) [ 1 ] ;
222+ nodesGroup . appendChild ( text ) ;
217223 } else {
224+ // add text above
225+ const text = document . createElementNS ( 'http://www.w3.org/2000/svg' , 'text' ) ;
226+ text . setAttribute ( 'x' , node . x ) ;
218227 text . setAttribute ( 'y' , node . y - node . radius - 10 ) ;
228+ text . setAttribute ( 'text-anchor' , 'middle' ) ;
229+ text . setAttribute ( 'fill' , '#6B7280' ) ;
230+ text . setAttribute ( 'font-size' , '10' ) ;
231+ text . setAttribute ( 'font-family' , 'monospace' ) ;
232+ text . textContent = node . label ;
233+ nodesGroup . appendChild ( text ) ;
219234 }
220- text . setAttribute ( 'text-anchor' , 'middle' ) ;
221- text . setAttribute ( 'fill' , '#6B7280' ) ;
222- text . setAttribute ( 'font-size' , '10' ) ;
223- text . setAttribute ( 'font-family' , 'monospace' ) ;
224- text . textContent = node . label ;
225- nodesGroup . appendChild ( text ) ;
226235 } ) ;
227236
228237 // Particle system
0 commit comments