Skip to content

Instantly share code, notes, and snippets.

@etpinard
Last active February 8, 2016 20:41
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save etpinard/744228c927ee95871559 to your computer and use it in GitHub Desktop.
Save etpinard/744228c927ee95871559 to your computer and use it in GitHub Desktop.
trace struct flattener
selection.order().exit().remove(
<!DOCTYPE html>
<html>
<body>
<div id='graph'></div>
<script type="text/javascript" src="https:/cdn.plot.ly/plotly-latest.min.js"></script>
<script type="text/javascript">
var d3 = Plotly.d3;
var ORDER = ['heatmap', 'contour', 'bar', 'histogram', 'scatter'];
function plot(data) {
var s = d3.select('#graph').selectAll('p')
.data(data, function(d) { return d.uid; })
s.enter().append('p');
s.sort(function(a, b) {
return (
ORDER.indexOf(a.type) - ORDER.indexOf(b.type)
);
});
s.exit().remove();
s.text(function(d) { return d.type + ' ' + d.uid;} );
}
var data0 = [{
type: 'scatter',
uid: '0'
}, {
type: 'bar',
uid: '1'
}, {
type: 'heatmap',
uid: '2'
}, {
type: 'contour',
uid: '2.5'
}];
plot(data0)
var data1 = [{
type: 'scatter',
uid: '1'
}, {
type: 'bar',
uid: '0'
}, {
type: 'heatmap',
uid: '2'
}, {
type: 'contour',
uid: '3'
}];
plot(data1);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment