Skip to content

Commit

Permalink
Merge pull request #3321 from cytoscape/fix/3320
Browse files Browse the repository at this point in the history
fix webgl mode showing hidden nodes/edges
  • Loading branch information
mikekucera authored Jan 22, 2025
2 parents 66fd845 + 2362de7 commit 5623dea
Show file tree
Hide file tree
Showing 4 changed files with 20 additions and 19 deletions.
2 changes: 1 addition & 1 deletion src/extensions/renderer/canvas/webgl/atlas.js
Original file line number Diff line number Diff line change
Expand Up @@ -528,7 +528,7 @@ export class AtlasManager {
}
}

isRenderable(ele, type) {
isVisible(ele, type) {
const opts = this.getRenderTypeOpts(type);
return opts && opts.isVisible(ele);
}
Expand Down
2 changes: 1 addition & 1 deletion src/extensions/renderer/canvas/webgl/defaults.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,6 @@ export const renderDefaults = defaults({
getRotation: null,
getRotationPoint: null,
getRotationOffset: null,
isVisible: null,
isVisible: () => true, // this is an extra check for visibility in addition to ele.visible()
getPadding: null,
});
21 changes: 18 additions & 3 deletions src/extensions/renderer/canvas/webgl/drawing-elements-webgl.js
Original file line number Diff line number Diff line change
Expand Up @@ -377,7 +377,7 @@ export class ElementDrawingWebGL {

drawTexture(ele, eleIndex, type) {
const { atlasManager } = this;
if(!atlasManager.isRenderable(ele, type)) {
if(!ele.visible() || !atlasManager.isVisible(ele, type)) {
return;
}
if(!atlasManager.canAddToCurrentBatch(ele, type)) {
Expand Down Expand Up @@ -434,6 +434,9 @@ export class ElementDrawingWebGL {


drawEdgeArrow(edge, eleIndex, prefix) {
if(!edge.visible()) {
return;
}
// Edge points and arrow angles etc are calculated by the base renderer and cached in the rscratch object.
const rs = edge._private.rscratch;

Expand All @@ -453,6 +456,7 @@ export class ElementDrawingWebGL {
return;
}

// check shape after the x/y check because pstyle() is a bit slow
const arrowShape = edge.pstyle(prefix + '-arrow-shape').value;
if(arrowShape === 'none' ) {
return;
Expand Down Expand Up @@ -504,15 +508,21 @@ export class ElementDrawingWebGL {


drawEdgeLine(edge, eleIndex) {
if(!edge.visible()) {
return;
}
const points = this.getEdgePoints(edge);
if(!points) {
return;
}

// line style
const baseOpacity = edge.pstyle('opacity').value;
const lineOpacity = edge.pstyle('line-opacity').value;
const width = edge.pstyle('width').pfValue;
const color = edge.pstyle('line-color').value;
const opacity = baseOpacity * lineOpacity;

const points = this.getEdgePoints(edge);

if(points.length/2 + this.instanceCount > this.maxInstances) {
this.endBatch();
}
Expand Down Expand Up @@ -591,6 +601,11 @@ export class ElementDrawingWebGL {

getEdgePoints(edge) {
const rs = edge._private.rscratch;

// if bezier ctrl pts can not be calculated, then die
if( rs.badLine || rs.allpts == null || isNaN(rs.allpts[0]) ){ // isNaN in case edge is impossible and browser bugs (e.g. safari)
return;
}
const controlPoints = rs.allpts;
if(controlPoints.length == 4) {
return controlPoints;
Expand Down
14 changes: 0 additions & 14 deletions src/extensions/renderer/canvas/webgl/drawing-redraw-webgl.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,3 @@
// import { EdgeDrawing } from './drawing-edges-webgl';
// import { EdgeBezierDrawing } from './drawing-edges-curved-webgl';
// import { NodeDrawing } from './drawing-nodes-webgl';
import { ElementDrawingWebGL } from './drawing-elements-webgl';
import { RENDER_TARGET, renderDefaults } from './defaults';
import { OverlayUnderlayRenderer } from './drawing-overlay';
Expand Down Expand Up @@ -50,24 +47,13 @@ CRp.initWebgl = function(opts, fns) {
return label && label.value;
};

// r.edgeDrawing = new EdgeBezierDrawing(r, gl, opts, renderDefaults({
// getKey: fns.getLabelKey,
// getBoundingBox: fns.getLabelBox,
// drawElement: fns.drawLabel,
// getRotation: getLabelRotation,
// getRotationPoint: fns.getLabelRotationPoint,
// getRotationOffset: fns.getLabelRotationOffset,
// isVisible: isLabelVisible,
// }));

r.eleDrawing = new ElementDrawingWebGL(r, gl, opts);
const our = new OverlayUnderlayRenderer(r);

r.eleDrawing.addTextureRenderType('node-body', renderDefaults({
getKey: fns.getStyleKey,
getBoundingBox: fns.getElementBox,
drawElement: fns.drawElement,
isVisible: ele => ele.visible(),
}));

r.eleDrawing.addTextureRenderType('node-label', renderDefaults({
Expand Down

0 comments on commit 5623dea

Please sign in to comment.