Created
June 15, 2014 16:09
-
-
Save gre/8caa85c90b134f3c8852 to your computer and use it in GitHub Desktop.
GLSL.io 1.3 graph dependencies
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
<html> | |
<head> | |
<title>dependo</title> | |
<style> | |
body { | |
background: #fff; | |
padding:0; | |
margin:0; | |
font-family:helvetica,arial; | |
overflow: hidden; | |
} | |
.graph { | |
width:100%; | |
height: 100%; | |
fill: #000; | |
overflow: hidden; | |
position: relative; | |
} | |
svg { | |
height: 100%; | |
width: 100%; | |
} | |
g.dimmed { | |
stroke-opacity: 0.05; | |
} | |
g.dimmed text.shadow { | |
stroke-opacity: 0; | |
} | |
circle { | |
fill: #ccc; | |
stroke: #333; | |
stroke-width: 1.5px; | |
} | |
text { | |
font: 10px sans-serif; | |
pointer-events: none; | |
} | |
text.shadow { | |
stroke: #fff; | |
stroke-width: 3px; | |
stroke-opacity: .8; | |
} | |
path.link { | |
fill: none; | |
stroke: #666; | |
stroke-width: 1.5px; | |
} | |
path.link.licensing { | |
stroke: green; | |
} | |
path.link.resolved { | |
stroke-dasharray: 0,2 1; | |
} | |
.control-zoom { | |
position: fixed; | |
top: 10px; | |
left: 10px; | |
background: rgba(0, 0, 0, 0.25); | |
padding: 5px; | |
border-radius: 7px; | |
z-index: 100; | |
} | |
.control-zoom a { | |
background: rgba(255, 255, 255, 0.75); | |
background-position: 50% 50%; | |
background-repeat: no-repeat; | |
display: block; | |
width: 19px; | |
height: 19px; | |
border-radius: 4px; | |
} | |
.control-zoom a:last-child { | |
margin: 0; | |
} | |
.control-zoom a:hover { | |
background-color: white; | |
} | |
.control-zoom > .control-zoom-in { | |
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJAQMAAADaX5RTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkUwRTZCRkI3NjQzNzExRTBBQUI3RTAwMUU2MTZDRkQ5IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkUwRTZCRkI4NjQzNzExRTBBQUI3RTAwMUU2MTZDRkQ5Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RTBFNkJGQjU2NDM3MTFFMEFBQjdFMDAxRTYxNkNGRDkiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RTBFNkJGQjY2NDM3MTFFMEFBQjdFMDAxRTYxNkNGRDkiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7cwPMXAAAABlBMVEUAAAD///+l2Z/dAAAAAnRSTlP/AOW3MEoAAAARSURBVAhbY3jcwABBcAATAQBxlwhT4XiahwAAAABJRU5ErkJggg==); | |
margin-bottom: 5px; | |
} | |
.control-zoom > .control-zoom-out { | |
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJAQMAAADaX5RTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkU5MjRDMEQ5NjQzNzExRTBCM0JDQkU2MzVGQTBCNjRDIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkU5MjRDMERBNjQzNzExRTBCM0JDQkU2MzVGQTBCNjRDIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RTkyNEMwRDc2NDM3MTFFMEIzQkNCRTYzNUZBMEI2NEMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RTkyNEMwRDg2NDM3MTFFMEIzQkNCRTYzNUZBMEI2NEMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7uh53jAAAABlBMVEUAAAD///+l2Z/dAAAAAnRSTlP/AOW3MEoAAAARSURBVAhbY/jfwABBcAATAQB6xwj7vHGbwAAAAABJRU5ErkJggg==); | |
margin-bottom: 5px; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="graph"> | |
<div class="control-zoom"> | |
<a class="control-zoom-in" href="#" title="Zoom in"></a> | |
<a class="control-zoom-out" href="#" title="Zoom out"></a> | |
</div> | |
</div> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.0.1/d3.v3.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.3/underscore-min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> | |
<script> | |
var getGraphData = function() { return {"directed":true,"multigraph":false,"graph":[],"nodes":[{"id":"core/app"},{"id":"core/router"},{"id":"lodash"},{"id":"q"},{"id":"react"},{"id":"ui/app"},{"id":"core/cache"},{"id":"store"},{"id":"director"},{"id":"qdebounce"},{"id":"embed/LinearPlayer"},{"id":"mixins/Promises"},{"id":"ui/TransitionCanvas/index"},{"id":"embed/index"},{"id":"images/index"},{"id":"images/resolveTextureUniforms"},{"id":"qimage"},{"id":"images/textures"},{"id":"index"},{"id":"model/index"},{"id":"screens/index"},{"id":"qajax"},{"id":"screens/about/article"},{"id":"highlight.js"},{"id":"screens/about/index"},{"id":"screens/editor/EditorScreen/index"},{"id":"glsl-transition-validator"},{"id":"screens/editor/LicenseLabel/index"},{"id":"screens/editor/TransitionActions/index"},{"id":"screens/editor/TransitionComments/index"},{"id":"screens/editor/TransitionEditor/index"},{"id":"screens/editor/TransitionInfos/index"},{"id":"screens/editor/TransitionPreview/index"},{"id":"screens/editor/UniformsEditor/index"},{"id":"screens/editor/UniformsEditor/uniformValuesForUniforms"},{"id":"ui/Toolbar/index"},{"id":"screens/editor/GlslEditor/index"},{"id":"ui/Link/index"},{"id":"screens/editor/PublishButton/index"},{"id":"ui/Button/index"},{"id":"screens/editor/SaveButton/index"},{"id":"screens/editor/StatusMessage/index"},{"id":"ui/Vignette/index"},{"id":"screens/editor/UniformComponentInput/index"},{"id":"screens/editor/UniformComponentInput/primitiveTypes"},{"id":"screens/editor/UniformEditor/arityForType"},{"id":"screens/editor/UniformEditor/componentLinesForType"},{"id":"screens/editor/UniformEditor/index"},{"id":"screens/editor/UniformEditor/labelsForType"},{"id":"screens/editor/UniformEditor/primitiveForType"},{"id":"screens/editor/index"},{"id":"qstart"},{"id":"screens/error/index"},{"id":"screens/gallery/GalleryScreen/index"},{"id":"screens/gallery/TransitionsBrowser/index"},{"id":"screens/gallery/TransitionPreview/index"},{"id":"screens/gallery/TransitionsBrowserPager/index"},{"id":"ui/TransitionCanvasCache/SharedCanvas"},{"id":"ui/button/index"},{"id":"screens/gallery/index"},{"id":"ui/Footer/index"},{"id":"ui/Header/index"},{"id":"ui/Logo/index"},{"id":"ui/ScreenContainer/index"},{"id":"glsl-transition"},{"id":"ui/TransitionCanvasCache/index"},{"id":"raf"},{"id":"ui/vignette/index"}],"links":[{"source":0,"target":1},{"source":0,"target":2},{"source":0,"target":3},{"source":0,"target":4},{"source":0,"target":5},{"source":6,"target":3},{"source":6,"target":7},{"source":1,"target":8},{"source":1,"target":2},{"source":1,"target":3},{"source":1,"target":9},{"source":10,"target":11},{"source":10,"target":4},{"source":10,"target":12},{"source":13,"target":10},{"source":13,"target":14},{"source":13,"target":15},{"source":13,"target":2},{"source":13,"target":3},{"source":13,"target":4},{"source":14,"target":3},{"source":14,"target":16},{"source":15,"target":17},{"source":15,"target":2},{"source":15,"target":3},{"source":17,"target":16},{"source":18,"target":0},{"source":18,"target":2},{"source":18,"target":19},{"source":18,"target":3},{"source":18,"target":4},{"source":18,"target":20},{"source":11,"target":3},{"source":19,"target":0},{"source":19,"target":6},{"source":19,"target":21},{"source":22,"target":23},{"source":22,"target":2},{"source":22,"target":4},{"source":24,"target":21},{"source":24,"target":22},{"source":25,"target":1},{"source":25,"target":26},{"source":25,"target":15},{"source":25,"target":2},{"source":25,"target":11},{"source":25,"target":19},{"source":25,"target":3},{"source":25,"target":4},{"source":25,"target":27},{"source":25,"target":28},{"source":25,"target":29},{"source":25,"target":30},{"source":25,"target":31},{"source":25,"target":32},{"source":25,"target":33},{"source":25,"target":34},{"source":25,"target":35},{"source":36,"target":2},{"source":36,"target":4},{"source":27,"target":4},{"source":27,"target":37},{"source":38,"target":4},{"source":38,"target":39},{"source":40,"target":4},{"source":40,"target":41},{"source":40,"target":39},{"source":41,"target":4},{"source":28,"target":4},{"source":28,"target":38},{"source":28,"target":40},{"source":28,"target":37},{"source":29,"target":4},{"source":29,"target":37},{"source":30,"target":26},{"source":30,"target":4},{"source":30,"target":36},{"source":30,"target":41},{"source":31,"target":4},{"source":31,"target":37},{"source":32,"target":4},{"source":32,"target":42},{"source":43,"target":17},{"source":43,"target":2},{"source":43,"target":4},{"source":43,"target":44},{"source":44,"target":17},{"source":45,"target":2},{"source":47,"target":2},{"source":47,"target":4},{"source":47,"target":43},{"source":47,"target":45},{"source":47,"target":46},{"source":47,"target":48},{"source":47,"target":49},{"source":48,"target":2},{"source":49,"target":2},{"source":33,"target":2},{"source":33,"target":4},{"source":33,"target":47},{"source":33,"target":34},{"source":34,"target":2},{"source":34,"target":45},{"source":34,"target":49},{"source":50,"target":14},{"source":50,"target":15},{"source":50,"target":2},{"source":50,"target":3},{"source":50,"target":51},{"source":50,"target":25},{"source":52,"target":4},{"source":52,"target":37},{"source":53,"target":2},{"source":53,"target":4},{"source":53,"target":54},{"source":53,"target":37},{"source":53,"target":35},{"source":55,"target":4},{"source":55,"target":42},{"source":54,"target":2},{"source":54,"target":4},{"source":54,"target":55},{"source":54,"target":56},{"source":54,"target":57},{"source":56,"target":4},{"source":56,"target":58},{"source":59,"target":26},{"source":59,"target":14},{"source":59,"target":15},{"source":59,"target":2},{"source":59,"target":3},{"source":59,"target":51},{"source":59,"target":53},{"source":20,"target":24},{"source":20,"target":50},{"source":20,"target":52},{"source":20,"target":59},{"source":60,"target":4},{"source":60,"target":37},{"source":61,"target":2},{"source":61,"target":4},{"source":61,"target":37},{"source":61,"target":62},{"source":37,"target":1},{"source":37,"target":4},{"source":37,"target":39},{"source":62,"target":4},{"source":62,"target":37},{"source":63,"target":4},{"source":35,"target":4},{"source":12,"target":64},{"source":12,"target":2},{"source":12,"target":4},{"source":57,"target":64},{"source":57,"target":2},{"source":65,"target":2},{"source":65,"target":3},{"source":65,"target":66},{"source":65,"target":4},{"source":5,"target":4},{"source":5,"target":60},{"source":5,"target":61},{"source":5,"target":63},{"source":58,"target":11},{"source":58,"target":3},{"source":58,"target":4},{"source":67,"target":64},{"source":67,"target":2},{"source":67,"target":3},{"source":67,"target":4},{"source":67,"target":37},{"source":67,"target":12},{"source":67,"target":65}]};}; | |
(function() { | |
var url = 'data.json' | |
var r = 10; | |
var graph, layout, zoom, nodes, links, data; | |
var linkedByIndex = {}; | |
var graphWidth, graphHeight; | |
// Helpers | |
function formatClassName(prefix, object) { | |
return prefix + '-' + object.id.replace(/(\.|\/)/gi, '-'); | |
} | |
function findElementByNode(prefix, node) { | |
var selector = '.'+formatClassName(prefix, node); | |
return graph.select(selector); | |
} | |
function isConnected(a, b) { | |
return linkedByIndex[a.index + "," + b.index] || linkedByIndex[b.index + "," + a.index] || a.index == b.index; | |
} | |
function fadeRelatedNodes(d, opacity, nodes, links) { | |
// Clean | |
$('path.link').removeAttr('data-show'); | |
nodes.style("stroke-opacity", function(o) { | |
if (isConnected(d, o)) { | |
thisOpacity = 1; | |
} else { | |
thisOpacity = opacity; | |
} | |
this.setAttribute('fill-opacity', thisOpacity); | |
this.setAttribute('stroke-opacity', thisOpacity); | |
if(thisOpacity == 1) { | |
this.classList.remove('dimmed'); | |
} else { | |
this.classList.add('dimmed'); | |
} | |
return thisOpacity; | |
}); | |
links.style("stroke-opacity", function(o) { | |
if (o.source === d) { | |
// Highlight target/sources of the link | |
var elmNodes = graph.selectAll('.'+formatClassName('node', o.target)); | |
elmNodes.attr('fill-opacity', 1); | |
elmNodes.attr('stroke-opacity', 1); | |
elmNodes.classed('dimmed', false); | |
// Highlight arrows | |
var elmCurrentLink = $('path.link[data-source=' + o.source.index + ']'); | |
elmCurrentLink.attr('data-show', true); | |
elmCurrentLink.attr('marker-end', 'url(#regular)'); | |
return 1; | |
} else { | |
var elmAllLinks = $('path.link:not([data-show])'); | |
if(opacity == 1) { | |
elmAllLinks.attr('marker-end', 'url(#regular)'); | |
} else { | |
elmAllLinks.attr('marker-end', ''); | |
} | |
return opacity; | |
} | |
}); | |
} | |
function render() { | |
zoom = d3.behavior.zoom(); | |
zoom.on("zoom", onZoomChanged); | |
// Setup layout | |
layout = d3.layout.force() | |
.gravity(.05) | |
.charge(-300) | |
.linkDistance(100); | |
// Setup graph | |
graph = d3.select(".graph") | |
.append("svg:svg") | |
.attr("pointer-events", "all") | |
.call(zoom) | |
.append('svg:g') | |
.attr('width', graphWidth) | |
.attr('height', graphHeight); | |
d3.select(window).on("resize", resize); | |
// Load graph data | |
var graphData = window.getGraphData(); | |
renderGraph(graphData); | |
data = graphData; | |
// Resize | |
resize(); | |
centerGraph(); | |
// Controlers | |
$('.control-zoom a').on('click', onControlZoomClicked); | |
} | |
function resize() { | |
graphWidth = window.innerWidth, | |
graphHeight = window.innerHeight; | |
graph.attr("width", graphWidth) | |
.attr("height", graphHeight); | |
layout.size([graphWidth, graphHeight]) | |
.resume(); | |
} | |
function centerGraph() { | |
var centerTranslate = [ | |
(graphWidth / 2) - (graphWidth * 0.2 / 2), | |
(graphHeight / 2) - (graphHeight * 0.2 / 2), | |
]; | |
zoom.translate(centerTranslate); | |
// Render transition | |
graph.transition() | |
.duration(500) | |
.attr("transform", "translate(" + zoom.translate() + ")" + " scale(" + zoom.scale() + ")"); | |
} | |
function renderGraph(data) { | |
// Markers | |
graph.append("svg:defs").selectAll("marker") | |
.data(['regular']) | |
.enter().append("svg:marker") | |
.attr("id", String) | |
.attr("viewBox", "0 -5 10 10") | |
.attr("refX", 15) | |
.attr("refY", -1.5) | |
.attr("markerWidth", 6) | |
.attr("markerHeight", 6) | |
.attr("orient", "auto") | |
.append("svg:path") | |
.attr("d", "M0,-5L10,0L0,5"); | |
// Lines | |
links = graph.append('svg:g').selectAll("line") | |
.data(data.links) | |
.enter().append("svg:path") | |
.attr('class', 'link') | |
.attr("data-target", function(o) { return o.target }) | |
.attr("data-source", function(o) { return o.source }) | |
.attr("marker-end", function(d) { return "url(#regular)"; }); | |
// Nodes | |
nodes = graph.append('svg:g').selectAll("node") | |
.data(data.nodes) | |
.enter().append("svg:g") | |
.attr("class","node") | |
.call(layout.drag) | |
.on("mousedown", onNodeMouseDown); | |
// Circles | |
nodes.attr("class", function(d) { return formatClassName('node', d) }) | |
nodes.append("svg:circle") | |
.attr("class", function(d) { return formatClassName('circle', d) }) | |
.attr("r", 6) | |
.on("mouseover", _.bind(onNodeMouseOver, this, nodes, links)) | |
.on("mouseout", _.bind(onNodeMouseOut, this, nodes, links) ); | |
// A copy of the text with a thick white stroke for legibility. | |
nodes.append("svg:text") | |
.attr("x", 15) | |
.attr("y", ".31em") | |
.attr("class", function(d) { return 'shadow ' + formatClassName('text', d) }) | |
.text(function(d) { return d.id; }); | |
nodes.append("svg:text") | |
.attr("class", function(d) { return formatClassName('text', d) }) | |
.attr("x", 15) | |
.attr("y", ".31em") | |
.text(function(d) { return d.id; }); | |
// Build linked index | |
data.links.forEach(function(d) { | |
linkedByIndex[d.source.index + "," + d.target.index] = 1; | |
}); | |
// Draw the | |
layout.nodes(data.nodes); | |
layout.links(data.links); | |
layout.on("tick", onTick); | |
layout.start(); | |
zoom.scale(0.4); | |
// Render transition | |
graph.transition() | |
.duration(500) | |
.attr("transform", "scale(" + zoom.scale() + ")"); | |
} | |
function onNodeMouseOver(nodes, links, d) { | |
// Highlight circle | |
var elm = findElementByNode('circle', d); | |
elm.style("fill", '#b94431'); | |
// Highlight related nodes | |
fadeRelatedNodes(d, .05, nodes, links); | |
} | |
function onNodeMouseOut(nodes, links, d) { | |
// Highlight circle | |
var elm = findElementByNode('circle', d); | |
elm.style("fill", '#ccc'); | |
// Highlight related nodes | |
fadeRelatedNodes(d, 1, nodes, links); | |
} | |
function onTick(e) { | |
links.attr("d", function(d) { | |
var dx = d.target.x - d.source.x, | |
dy = d.target.y - d.source.y, | |
dr = Math.sqrt(dx * dx + dy * dy); | |
return "M" + d.source.x + "," + d.source.y + "A" + dr + "," + dr + " 0 0,1 " + d.target.x + "," + d.target.y; | |
}); | |
nodes.attr("cx", function(d) { return d.x; }) | |
.attr("cy", function(d) { return d.y; }) | |
.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; }); | |
} | |
function onControlZoomClicked(e) { | |
var elmTarget = $(this) | |
var scaleProcentile = 0.20; | |
// Scale | |
var currentScale = zoom.scale(); | |
var newScale; | |
if(elmTarget.hasClass('control-zoom-in')) { | |
newScale = currentScale * (1 + scaleProcentile); | |
} else { | |
newScale = currentScale * (1 - scaleProcentile); | |
} | |
newScale = Math.max(newScale, 0); | |
// Translate | |
var centerTranslate = [ | |
(graphWidth / 2) - (graphWidth * newScale / 2), | |
(graphHeight / 2) - (graphHeight * newScale / 2) | |
]; | |
// Store values | |
zoom | |
.translate(centerTranslate) | |
.scale(newScale); | |
// Render transition | |
graph.transition() | |
.duration(500) | |
.attr("transform", "translate(" + zoom.translate() + ")" + " scale(" + zoom.scale() + ")"); | |
} | |
function onZoomChanged() { | |
graph.attr("transform", "translate(" + d3.event.translate + ")" + " scale(" + d3.event.scale + ")"); | |
} | |
function onNodeMouseDown(d) { | |
d.fixed = true; | |
d3.select(this).classed("sticky", true); | |
} | |
render(); | |
})(); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment