Fatal编程技术网

Javascript D3图表执行错误

javascript d3.js

Javascript D3图表执行错误,javascript,d3.js,Javascript,D3.js,我对D3图表有问题。数据将不会加载，控制台将给出一个错误 索引：54未捕获类型错误：nv.addGraph不是函数 <!DOCTYPE html> 这是我从中获得代码的演示： 我希望这不是一件愚蠢的事情！感谢您的帮助您似乎引用了NVD3，但只声明了D3。如果您使用的是NVD3，它是D3之上的一个软件包。谢谢，但即使在实现了NVD3之后，我也遇到了同样的问题。未捕获的TypeError:nv.models.discreteBarChart….x….y….交错标签….工具提示

我对D3图表有问题。数据将不会加载，控制台将给出一个错误

索引：54未捕获类型错误：nv.addGraph不是函数

<!DOCTYPE html>

这是我从中获得代码的演示：

我希望这不是一件愚蠢的事情！感谢您的帮助

您似乎引用了NVD3，但只声明了D3。如果您使用的是NVD3，它是D3之上的一个软件包。谢谢，但即使在实现了NVD3之后，我也遇到了同样的问题。未捕获的TypeError:nv.models.discreteBarChart….x….y….交错标签….工具提示….showValues….转换不是一个函数…You's example包含在内，对我有效。可能比找到确切的东西更容易谢谢，我会试试 
<meta charset="utf-8">
<title>Doodsoorzaak door huidkanker </title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.2/d3.min.js" charset="utf-8"></script>

<!--  <link href="css/d3.min.css" rel="stylesheet" type="text/css"> -->
<link rel="stylesheet" href="css/colors.css" />
<link rel="stylesheet" href="css/height.css" />
<link rel="stylesheet" href="css/cssstyles.css" />

</script>
<style>
    text {
        font: 12px sans-serif;
    }
    svg {
        display: block;
    }
    html, body, #chart1, svg {
        margin: 0px;
        padding: 0px;
        height: 100%;
        width: 100%;
    }
</style>

</head>

<body>
    <container>
    </ul>
        <header>
            <nav class="col-xs-12 h300" class="navbar navbar-default navbar-inverse" role="navigation">
                <div class="container-fluid">
                    <center><img id="logo" src="img/Logo.png" width="auto" height="auto" /></center>            
                        <ul id="menu">
                        <center> <h4> De laatste jaren is het aantal sterfte gevallen door huidkanker toegenomen. Vooral 60-plussers sterven het vaakst door huidkanker.</h4> </center>
                        </ul>

                </div>
            </nav>
        </header>
        <body>

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

            <script type="text/javascript">
nv.addGraph(function() {
  var chart = nv.models.discreteBarChart()
      .x(function(d) { return d.label })    //Specify the data accessors.
      .y(function(d) { return d.value })
      .staggerLabels(true)    //Too many bars and not enough room? Try staggering labels.
      .tooltips(false)        //Don't show tooltips
      .showValues(true)       //...instead, show the bar value right on top of each bar.
      .transitionDuration(350)
      ;

  d3.select('#chart svg')
      .datum(exampleData())
      .call(chart);

  nv.utils.windowResize(chart.update);

  return chart;
});

//Each bar represents a single discrete quantity.
function exampleData() {
 return  [ 
    {
      key: "Cumulative Return",
      values: [
        { 
          "label" : "Infectieuze en parasitaire ziekten" ,
          "value" : 3104
        } , 
        { 
          "label" : "Ziekten van hart en vaatstelsel" , 
          "value" : 37862
        } , 
        { 
          "label" : "Uitwendige oorzaken v. ziekte en sterfte" , 
          "value" : 6813
        } 
      ]
    }
  ]

}



        </script>


        </body>         

        <footer>
            <section class="col-xs-12 h100">
                <center>
                    <p>
                        <br><br>
                            Copyright Tufan Ugurel
                    </p>
                </center>
            </section>
        <footer>
    </container>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://code.jquery.com/jquery.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>

    <script href="js/d3.min.js"></script>