fix(viz): draw hyperedges in network coords to fix HiDPI offset#335
Open
nhkimmm wants to merge 1 commit intosafishamsi:v4from
Open
fix(viz): draw hyperedges in network coords to fix HiDPI offset#335nhkimmm wants to merge 1 commit intosafishamsi:v4from
nhkimmm wants to merge 1 commit intosafishamsi:v4from
Conversation
vis-network's afterDrawing hook passes a ctx that already has the view transform (pan + zoom + devicePixelRatio) applied. The previous drawHyperedges manually re-applied (p - offset) * scale + canvas.width/2 on top of that ctx, which double-applied the transform and — because canvas.width is the physical pixel buffer, not the CSS width — mis-anchored on HiDPI by cssWidth/2 to the right and cssHeight/2 down. Result: hyperedge polygons rendered detached from their nodes in the lower-right area of the canvas on Retina displays. Accept the ctx from the callback argument and draw node positions raw, so hyperedges use the same coordinate path as nodes and edges.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
fix(viz): draw hyperedges in network coords to fix HiDPI offset
Fixes #334.
Problem
drawHyperedgesin_hyperedge_scriptmanually re-applies the network view transform on top of a ctx that vis-network has already transformed for theafterDrawinghook, and usescanvas.width / 2as a center anchor.canvas.widthis the physical pixel buffer (cssWidth × devicePixelRatio), not the CSS width, so on DPR = 2 (Retina) the anchor landscssWidth / 2to the right andcssHeight / 2down — and the doubled transform compounds the error. Net effect: hyperedge convex hulls render disconnected from their nodes in the lower-right area of the viewport. See #334 for the full analysis.Fix
Take the ctx from the
afterDrawingcallback argument (already in network coordinate space) and draw node positions directly. Remove thetoCanvashelper and itsscale/offset/canvaslocals. Thenetwork.on('afterDrawing', drawHyperedges)registration is unchanged — vis-network calls the callback with(ctx), so the newdrawHyperedges(ctx)signature binds automatically.After this change, hyperedge rendering uses the same coordinate space as vis-network's own node/edge rendering, so it is correct on any
devicePixelRatioby construction.No other changes: colors, alpha, expansion factor (
1.15), font, label position, and the hook name are all left as-is, so this reviews as a pure coordinate-math fix.Verification
Out of scope
Self-intersecting hyperedge polygons for 3+ nodes drawn in extraction order (not convex hull). Separate follow-up.