d3 is not defined - ReferenceError

后端 未结 11 1321
被撕碎了的回忆
被撕碎了的回忆 2020-12-08 07:46

I am trying to use a \"fancy graph\" found at http://bl.ocks.org/kerryrodden/7090426:

\"enter

相关标签:
11条回答
  • 2020-12-08 08:14

    If you are using Visual Studio you can go to Tools -> Options -> Text Editor -> JavaScript -> IntelliSense and check the box "Download remote references". That did the trick for me.

    0 讨论(0)
  • 2020-12-08 08:15

    I had to do a grunt build to get get rid of this error. (Using Yeoman and Ember.js.)

    0 讨论(0)
  • 2020-12-08 08:27

    UPDATE: there is now a d3-webpack-loader package which makes it easy to load d3 in webpack. I am not the creator of the package, I've only used it to see if it works. Here's a quick example.

    // Install the loader
    npm install --save d3-webpack-loader
    
    // Install the d3 microservices you need
    npm install --save d3-color
    npm install --save d3-selection
    

    In our entry.js file we'll require d3 using the d3-webpack-loader with:

    const d3 = require('d3!');
    

    and can then use some of the d3 methods with:

    d3.selectAll("p").style("color", d3.color("red").darker());
    
    0 讨论(0)
  • 2020-12-08 08:29

    Super late to this response but none of the above solutions worked out for me. I found a fix though!

    I am on macOS Catalina. For some bizarre reason, it turned out to be a decompression/unpack issue with the .tgz file from Observable's website. I use an application called The Unarchiver to decompress files, but in this case, the .tgz file did not properly unpack. There was a folder and file missing compared to a friend's computer not using the same program.

    Solution: I unpacked .tgz without a third party program – just used macOS (simply double clicking on the file). Then, I loaded the page locally and it worked!

    If double clicking on the file fails to unpack, try running tar -xzf filename.tgz in Terminal.

    0 讨论(0)
  • 2020-12-08 08:30

    I just moved my reference to the package as the first import in my head tag:

    <head>
    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    ...
    ...
    </head>
    

    Seemed to work for me

    0 讨论(0)
提交回复
热议问题