Created
September 25, 2014 16:09
-
-
Save rjbriody/ac774c917707595bcac6 to your computer and use it in GitHub Desktop.
reproduce sigma.js parent container resize issue. This is basic.html w/ minor mods.
This file contains 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
<!-- START SIGMA IMPORTS --> | |
<script src="../src/sigma.core.js"></script> | |
<script src="../src/conrad.js"></script> | |
<script src="../src/utils/sigma.utils.js"></script> | |
<script src="../src/utils/sigma.polyfills.js"></script> | |
<script src="../src/sigma.settings.js"></script> | |
<script src="../src/classes/sigma.classes.dispatcher.js"></script> | |
<script src="../src/classes/sigma.classes.configurable.js"></script> | |
<script src="../src/classes/sigma.classes.graph.js"></script> | |
<script src="../src/classes/sigma.classes.camera.js"></script> | |
<script src="../src/classes/sigma.classes.quad.js"></script> | |
<script src="../src/captors/sigma.captors.mouse.js"></script> | |
<script src="../src/captors/sigma.captors.touch.js"></script> | |
<script src="../src/renderers/sigma.renderers.canvas.js"></script> | |
<script src="../src/renderers/sigma.renderers.webgl.js"></script> | |
<script src="../src/renderers/sigma.renderers.def.js"></script> | |
<script src="../src/renderers/webgl/sigma.webgl.nodes.def.js"></script> | |
<script src="../src/renderers/webgl/sigma.webgl.nodes.fast.js"></script> | |
<script src="../src/renderers/webgl/sigma.webgl.edges.def.js"></script> | |
<script src="../src/renderers/webgl/sigma.webgl.edges.fast.js"></script> | |
<script src="../src/renderers/webgl/sigma.webgl.edges.arrow.js"></script> | |
<script src="../src/renderers/canvas/sigma.canvas.labels.def.js"></script> | |
<script src="../src/renderers/canvas/sigma.canvas.hovers.def.js"></script> | |
<script src="../src/renderers/canvas/sigma.canvas.nodes.def.js"></script> | |
<script src="../src/renderers/canvas/sigma.canvas.edges.def.js"></script> | |
<script src="../src/renderers/canvas/sigma.canvas.edges.curve.js"></script> | |
<script src="../src/renderers/canvas/sigma.canvas.edges.arrow.js"></script> | |
<script src="../src/renderers/canvas/sigma.canvas.edges.curvedArrow.js"></script> | |
<script src="../src/middlewares/sigma.middlewares.rescale.js"></script> | |
<script src="../src/middlewares/sigma.middlewares.copy.js"></script> | |
<script src="../src/misc/sigma.misc.animation.js"></script> | |
<script src="../src/misc/sigma.misc.bindEvents.js"></script> | |
<script src="../src/misc/sigma.misc.drawHovers.js"></script> | |
<!-- END SIGMA IMPORTS --> | |
<div id="container"> | |
<style> | |
#graph-container { | |
/*===================================*/ | |
/*===================================*/ | |
/*===================================*/ | |
/* MODIFIED*/ | |
/*===================================*/ | |
/*===================================*/ | |
/*===================================*/ | |
width: 800px; | |
height: 800px; | |
border: 1px solid black; | |
} | |
</style> | |
<div id="graph-container"></div> | |
</div> | |
<script> | |
/** | |
* This is a basic example on how to instantiate sigma. A random graph is | |
* generated and stored in the "graph" variable, and then sigma is instantiated | |
* directly with the graph. | |
* | |
* The simple instance of sigma is enough to make it render the graph on the on | |
* the screen, since the graph is given directly to the constructor. | |
*/ | |
var i, | |
s, | |
N = 100, | |
E = 500, | |
g = { | |
nodes: [], | |
edges: [] | |
}; | |
// Generate a random graph: | |
for (i = 0; i < N; i++) | |
g.nodes.push({ | |
id: 'n' + i, | |
label: 'Node ' + i, | |
x: Math.random(), | |
y: Math.random(), | |
size: Math.random(), | |
color: '#666' | |
}); | |
for (i = 0; i < E; i++) | |
g.edges.push({ | |
id: 'e' + i, | |
source: 'n' + (Math.random() * N | 0), | |
target: 'n' + (Math.random() * N | 0), | |
size: Math.random(), | |
color: '#ccc' | |
}); | |
// Instantiate sigma: | |
s = new sigma({ | |
graph: g, | |
container: 'graph-container' | |
}); | |
/*===================================*/ | |
/*===================================*/ | |
/*===================================*/ | |
/* MODIFIED*/ | |
/*===================================*/ | |
/*===================================*/ | |
/*===================================*/ | |
setTimeout(function () { | |
document.getElementById('graph-container').style.width = '400px'; | |
document.getElementById('graph-container').style.height = '400px'; | |
// Turning this on causes the graph to resize correctly | |
// s.renderers[0].resize(); | |
s.refresh(); | |
}, 3000); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment