Skip to content

Commit 358ebfe

Browse files
namedgraphclaude
andcommitted
Append 3D graph panels client-side after ForceGraph3D mounts
ForceGraph3D clears the container element on init, wiping any server-rendered child elements. Mirror the pattern from 3D-Linked-Data/graph-client.xsl: server outputs only the bare canvas div; ldh:AppendGraph3DPanels appends tooltip, info-panel, show-panel, and zoom button via ixsl:append-content after FG3D has mounted. Called from both ldh:InitDocumentGraph3D and the view.xsl initial-load block. Also replaced hardcoded convert-data call in view.xsl with ldh:redisplay-graph so filter checkboxes take effect. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
1 parent fdef11c commit 358ebfe

3 files changed

Lines changed: 42 additions & 35 deletions

File tree

src/main/webapp/static/com/atomgraph/linkeddatahub/xsl/bootstrap/2.3.2/client/block/view.xsl

Lines changed: 13 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -705,18 +705,21 @@ exclude-result-prefixes="#all"
705705
<ixsl:set-property name="document" select="$results" object="$graph-state"/>
706706
<ixsl:set-property name="loaded-uris" select="ixsl:new('Array', [])" object="$graph-state"/>
707707
<ixsl:set-property name="{$canvas-id}" select="$graph-state" object="$graphs"/>
708+
709+
<xsl:call-template name="ldh:AppendGraph3DPanels">
710+
<xsl:with-param name="canvas" select="$canvas"/>
711+
<xsl:with-param name="canvas-id" select="$canvas-id"/>
712+
</xsl:call-template>
708713
</xsl:if>
709714

710715
<!-- Convert RDF to graph data and render (initial or re-render) -->
711-
<xsl:variable name="graph-instance" select="ixsl:get(ixsl:get($graphs, $canvas-id), 'instance')"/>
712-
<xsl:variable name="graph-data" as="item()">
713-
<xsl:apply-templates select="$results" mode="ldh:ForceGraph3D-convert-data">
714-
<xsl:with-param name="show-stubs" select="true()" tunnel="yes"/>
715-
<xsl:with-param name="show-literals" select="false()" tunnel="yes"/>
716-
</xsl:apply-templates>
717-
</xsl:variable>
718-
<xsl:message>ldh:RenderViewMode GraphMode: calling graphData(), nodes=<xsl:value-of select="ixsl:get(ixsl:get($graph-data, 'nodes', map{'convert-result': false()}), 'length')"/> links=<xsl:value-of select="ixsl:get(ixsl:get($graph-data, 'links', map{'convert-result': false()}), 'length')"/></xsl:message>
719-
<xsl:sequence select="ixsl:call($graph-instance, 'graphData', [$graph-data], map{'convert-args': false()})[current-date() lt xs:date('2000-01-01')]"/>
716+
<xsl:variable name="graph-state" select="ixsl:get($graphs, $canvas-id)"/>
717+
<xsl:variable name="graph-instance" select="ixsl:get($graph-state, 'instance')"/>
718+
<xsl:call-template name="ldh:redisplay-graph">
719+
<xsl:with-param name="canvas-id" select="$canvas-id"/>
720+
<xsl:with-param name="graph-state" select="$graph-state"/>
721+
<xsl:with-param name="graph-instance" select="$graph-instance"/>
722+
</xsl:call-template>
720723
</xsl:if>
721724
</xsl:template>
722725

@@ -1130,19 +1133,7 @@ exclude-result-prefixes="#all"
11301133
<xsl:template match="rdf:RDF" mode="bs2:Graph">
11311134
<xsl:param name="canvas-id" as="xs:string"/>
11321135

1133-
<div id="{$canvas-id}" class="graph-3d-canvas">
1134-
<div id="tooltip-{$canvas-id}" class="graph-3d-tooltip"/>
1135-
<div id="info-panel-{$canvas-id}" class="graph-3d-info-panel">
1136-
<div id="info-content-{$canvas-id}">Click a node to see details</div>
1137-
</div>
1138-
<div id="show-panel-{$canvas-id}" class="graph-3d-show-panel">
1139-
<label><input type="checkbox" id="show-stubs-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter" checked="checked"/> Resources without descriptions</label>
1140-
<label><input type="checkbox" id="show-literals-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter"/> Literals
1141-
<label class="sub-option"><input type="checkbox" id="show-locale-literals-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter" disabled="disabled"/> Matching locale only</label>
1142-
</label>
1143-
</div>
1144-
<button data-canvas-id="{$canvas-id}" class="graph-3d-zoom btn btn-small">Zoom to fit</button>
1145-
</div>
1136+
<div id="{$canvas-id}" class="graph-3d-canvas"/>
11461137
</xsl:template>
11471138

11481139
<!-- parallax -->

src/main/webapp/static/com/atomgraph/linkeddatahub/xsl/bootstrap/2.3.2/client/graph3d.xsl

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -333,6 +333,29 @@ exclude-result-prefixes="#all"
333333
</dl>
334334
</xsl:template>
335335

336+
<!-- PANEL INJECTION (called after ldh:ForceGraph3D-init, which clears the container) -->
337+
338+
<xsl:template name="ldh:AppendGraph3DPanels">
339+
<xsl:param name="canvas" as="element()"/>
340+
<xsl:param name="canvas-id" as="xs:string"/>
341+
342+
<xsl:for-each select="$canvas">
343+
<xsl:result-document href="?." method="ixsl:append-content">
344+
<div id="tooltip-{$canvas-id}" class="graph-3d-tooltip"/>
345+
<div id="info-panel-{$canvas-id}" class="graph-3d-info-panel">
346+
<div id="info-content-{$canvas-id}">Click a node to see details</div>
347+
</div>
348+
<div id="show-panel-{$canvas-id}" class="graph-3d-show-panel">
349+
<label><input type="checkbox" id="show-stubs-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter" checked="checked"/> Resources without descriptions</label>
350+
<label><input type="checkbox" id="show-literals-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter"/> Literals
351+
<label class="sub-option"><input type="checkbox" id="show-locale-literals-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter" disabled="disabled"/> Matching locale only</label>
352+
</label>
353+
</div>
354+
<button data-canvas-id="{$canvas-id}" class="graph-3d-zoom btn btn-small">Zoom to fit</button>
355+
</xsl:result-document>
356+
</xsl:for-each>
357+
</xsl:template>
358+
336359
<!-- DOCUMENT-MODE GRAPH INIT (called from ldh:rdf-document-response) -->
337360

338361
<xsl:template name="ldh:InitDocumentGraph3D">
@@ -370,6 +393,11 @@ exclude-result-prefixes="#all"
370393
<ixsl:set-property name="loaded-uris" select="ixsl:new('Array', [])" object="$graph-state"/>
371394
<ixsl:set-property name="{$canvas-id}" select="$graph-state" object="$graphs"/>
372395

396+
<xsl:call-template name="ldh:AppendGraph3DPanels">
397+
<xsl:with-param name="canvas" select="$canvas"/>
398+
<xsl:with-param name="canvas-id" select="$canvas-id"/>
399+
</xsl:call-template>
400+
373401
<xsl:variable name="graph-instance" select="ixsl:get($graph-state, 'instance')"/>
374402
<xsl:call-template name="ldh:redisplay-graph">
375403
<xsl:with-param name="canvas-id" select="$canvas-id"/>

src/main/webapp/static/com/atomgraph/linkeddatahub/xsl/bootstrap/2.3.2/layout.xsl

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -936,19 +936,7 @@ exclude-result-prefixes="#all">
936936
</xsl:when>
937937
<xsl:when test="$ac:mode = '&ac;GraphMode'">
938938
<xsl:variable name="canvas-id" select="generate-id() || '-graph-canvas'" as="xs:string"/>
939-
<div id="{$canvas-id}" class="graph-3d-canvas">
940-
<div id="tooltip-{$canvas-id}" class="graph-3d-tooltip"/>
941-
<div id="info-panel-{$canvas-id}" class="graph-3d-info-panel">
942-
<div id="info-content-{$canvas-id}">Click a node to see details</div>
943-
</div>
944-
<div id="show-panel-{$canvas-id}" class="graph-3d-show-panel">
945-
<label><input type="checkbox" id="show-stubs-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter" checked="checked"/> Resources without descriptions</label>
946-
<label><input type="checkbox" id="show-literals-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter"/> Literals
947-
<label class="sub-option"><input type="checkbox" id="show-locale-literals-{$canvas-id}" data-canvas-id="{$canvas-id}" class="graph-3d-filter" disabled="disabled"/> Matching locale only</label>
948-
</label>
949-
</div>
950-
<button data-canvas-id="{$canvas-id}" class="graph-3d-zoom btn btn-small">Zoom to fit</button>
951-
</div>
939+
<div id="{$canvas-id}" class="graph-3d-canvas"/>
952940
</xsl:when>
953941
<xsl:otherwise>
954942
<xsl:apply-templates select="." mode="bs2:Row">

0 commit comments

Comments
 (0)