admin管理员组

文章数量:1420110

Following the example on .html I ran into above mentioned error. I have set up php -S localhost:8000. Then I open this .html file:

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-patible" content="ie=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>C3 Example</title>

<!-- Load c3.css -->
<link href="c3/c3.css" rel="stylesheet">

<!-- Load d3.js and c3.js -->
<script src="d3/d3.min.js" charset="utf-8"></script>
<script src="c3/c3.min.js"></script>
</head>


<body>
    <div id="chart"></div>

    <script type="text/javascript">
    var chart = c3.generate({
    bindto: '#chart',
    data: {
      columns: [
        ['data1', 30, 200, 100, 400, 150, 250],
        ['data2', 50, 20, 10, 40, 15, 25]
      ],
      axes: {
        data2: 'y2' // ADD
      }
    },
    axis: {
      y2: {
        show: true // ADD
      }
    }
});
    </script>

</body>
</html>

What am I doing wrong here? All I did was copypasting the codesample.

Following the example on https://c3js/gettingstarted.html I ran into above mentioned error. I have set up php -S localhost:8000. Then I open this .html file:

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-patible" content="ie=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>C3 Example</title>

<!-- Load c3.css -->
<link href="c3/c3.css" rel="stylesheet">

<!-- Load d3.js and c3.js -->
<script src="d3/d3.min.js" charset="utf-8"></script>
<script src="c3/c3.min.js"></script>
</head>


<body>
    <div id="chart"></div>

    <script type="text/javascript">
    var chart = c3.generate({
    bindto: '#chart',
    data: {
      columns: [
        ['data1', 30, 200, 100, 400, 150, 250],
        ['data2', 50, 20, 10, 40, 15, 25]
      ],
      axes: {
        data2: 'y2' // ADD
      }
    },
    axis: {
      y2: {
        show: true // ADD
      }
    }
});
    </script>

</body>
</html>

What am I doing wrong here? All I did was copypasting the codesample.

  • javascript
  • node.js
  • d3.js
  • c3.js
Share Improve this question asked Dec 16, 2020 at 12:01 schmarkschmark 711 silver badge7 bronze badges 1
  • Which version of d3 did you use in this example? If you are unsure, you can use console.log(d3.version) to check. – Andrew Reid Commented Dec 17, 2020 at 19:39
Add a ment  | 

2 Answers 2

Reset to default 7

Looks like you have downloaded the latest version of both c3 and d3, but the latest version of the c3 library is requiring v5 of the d3 library, it is not patible with the newest version (v6) yet.

So, just downgrade your d3 version to v5.16.0 and it should be good. Here is your code with just the sources updated to the currently latest c3 (v0.7.20) and v5.16.0 of d3, tested, seems to work without issues.

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-patible" content="ie=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>C3 Example</title>

    <!-- Load c3.css -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare./ajax/libs/c3/0.7.20/c3.min.css" integrity="sha512-cznfNokevSG7QPA5dZepud8taylLdvgr0lDqw/FEZIhluFsSwyvS81CMnRdrNSKwbsmc43LtRd2/WMQV+Z85AQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />

    <!-- Load d3.js and c3.js -->
    <script src="https://cdnjs.cloudflare./ajax/libs/d3/5.16.0/d3.min.js" integrity="sha512-FHsFVKQ/T1KWJDGSbrUhTJyS1ph3eRrxI228ND0EGaEp6v4a/vGwPWd3Dtd/+9cI7ccofZvl/wulICEurHN1pg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdnjs.cloudflare./ajax/libs/c3/0.7.20/c3.min.js" integrity="sha512-+IpCthlNahOuERYUSnKFjzjdKXIbJ/7Dd6xvUp+7bEw0Jp2dg6tluyxLs+zq9BMzZgrLv8886T4cBSqnKiVgUw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>


<body>
    <div id="chart"></div>

    <script type="text/javascript">
    var chart = c3.generate({
    bindto: '#chart',
    data: {
      columns: [
        ['data1', 30, 200, 100, 400, 150, 250],
        ['data2', 50, 20, 10, 40, 15, 25]
      ],
      axes: {
        data2: 'y2' // ADD
      }
    },
    axis: {
      y2: {
        show: true // ADD
      }
    }
});
    </script>

</body>
</html>

in the example you provided it is <script src="/path/to/d3.v5.min.js" charset="utf-8"></script> but you are missing v5 on your own code. Check in "Network" tab of your browser if your d3 library is loaded or if your browser fails to find the file because of this filename difference. If so, fix the filename

本文标签： javascriptUncaught TypeError thisd3set is not a functionStack Overflow

版权声明：本文标题：javascript - Uncaught TypeError: this.d3.set is not a function - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744710140a2621080.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。