Cannot read property 'force' of undefined (Simple D3 Network graph)

Question

I am new to D3 and Javascript but have typically had luck with just copying the basic D3 scripts and getting my data into the proper format for the visualization to work. I have tried several of the D3 Network graphs and have gotten the same error for all of them when I inspect the page.

Uncaught TypeError: Cannot read property 'force' of undefined.

If you look at the script here: http://bl.ocks.org/jose187/4733747 I just copied it completely along with the respective .json file and am getting the above error. It seems to think that d3.layout.force() is an "anonymous function". Any ideas what is going on? Or how to fix it? Thank you!

Answer 1

The force layout d3.layout.force has been renamed to d3.forceSimulation in D3 V4 among many other changes.

Refer to this link for more information: D3 V4 Force

Answer 2

I have faced that problem too.The problem was the d3 version I was using which is version 4.When I use d3 version 3 it works properly.

Answer 3

You will have to downgrade your D3 Version because version 3's d3.layout.force is now d3.layout.forceSimulation in version 4 as answered already.

Use this CDN for D3 Version 3 :

<script src="https://d3js.org/d3.v3.js"></script>