Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

d3 layout is undefined

Trying to use d3.js and not sure how to reference it properly:

<!DOCTYPE html>
<head>
<link rel="stylesheet" href="bootstrap.min.css">
<script src="jquery-1.7.1.js"></script>
<<<<other scripts>>>
<script src="topbar.js"></script>
<script>
$(function() {
    var n = 4, // number of layers
        m = 64, // number of samples per layer
     data = d3.layout.stack()(stream_layers(n, m, .1)),
    color = d3.interpolateRgb("#aad", "#556");
});
</script>
</head>
...
</html>
like image 687
quantumpotato Avatar asked Dec 28 '11 05:12

quantumpotato


3 Answers

You need to include d3.layout.js in addition to d3.js; the layout module is in a separate file by default. You can also make a custom build of d3.js that includes everything you need in a single file.

like image 79
mbostock Avatar answered Nov 11 '22 10:11

mbostock


(it's not the answer for this question)

For the people with the same error:

d3.layout is undefined

In my case was the problem I just link directly to the latest release (v4)
https://d3js.org/d3.v4.min.js

With (v3) it is working again.
https://d3js.org/d3.v3.min.js

like image 37
gfjr Avatar answered Nov 11 '22 10:11

gfjr


You should use d3.stack instead.

Every symbol in D3 4.0 now shares a flat namespace rather than the nested one of D3 3.x. For example, d3.scale.linear is now d3.scaleLinear, and d3.layout.treemap is now d3.treemap.

For other d3.layout changes go here: https://github.com/d3/d3/blob/master/CHANGES.md

like image 21
Tweak3r Avatar answered Nov 11 '22 11:11

Tweak3r