Two simple code, one fails, one runs ?

Community Help
1

Hi,
Continuing my journey through the d3’s docs, I tried executing this code snippet.
var matrix = [
[11975, 5871, 8916, 2868],
[ 1951, 10048, 2060, 6171],
[ 8010, 16145, 8090, 8045],
[ 1013, 990, 940, 6907]
];
var tr = d3.select(“body”)
.append(“table”)
.selectAll(“tr”)
.data(matrix)
.enter().append(“tr”);
var td = tr.selectAll(“td”)
.data((d) => d)
.enter().append(“td”)
.text((d) => d);

which I manage to have working in this notebook https://beta.observablehq.com/@maliky/table-example-working,
But then I copied the code to another notebook and it failed.
https://beta.observablehq.com/@maliky/table-example-broken
with a
TypeError: TypeError: d3.select(…).append(…).selectAll(…).data(…).join is not a function
at eval (eval at Dt (https://static.observableusercontent.com/worker/worker.6257841301f9ded022c9b58fa57227d7a7b6c7aa9cd35a3b3f62100b54b51d6d.js:2:36229), :17:6)
at https://static.observableusercontent.com/worker/worker.6257841301f9ded022c9b58fa57227d7a7b6c7aa9cd35a3b3f62100b54b51d6d.js:2:28757

I was careful for hidden chars, checked both code with https://beta.observablehq.com/@randomfractals/notebook-info but cannot find the difference. Although I must be missing something obvious but I fail to see. Please help ?

Thank you

2

Can you share your most recent version? I don’t see any errors in the one that is currently public.

3

notebook with error updated.

4

I don’t see any error

It’s possible you had version mismatch somehow

here is the version, which is referenced in https://beta.observablehq.com/@d3/selection-join

08%20PM

5

Ok, I saw my error
d3 = require("d3@v5") should have been d3 = require("d3@5")

That last notation points by default to the last version in d3@5 version, while d3@v5 points to the first version of d3@5 right ?

6

As far as npm is concerned both “v5” and “5” point to the same version. The “v” prefix is ignored by npm’s semver library, but is commonly used in tags.

7

It’s probable that your browser was just using a cached older version of d3. That also happened to me after d3 5.8.0 was released. Hard refreshing some number of times and clearing caches eventually fixed it.

2 Likes
8

Ok… I still need to get those dev reflex but getting there thanks to you.