未捕获的类型错误:d3.bullet 不是一个函数

Question

大家好，我在为 JavaScript Web 项目创建简单的 D3 图表时遇到了问题。这段代码有点像在教程中创建的，所以我真的不知道为什么我会收到错误：

未捕获的类型错误：d3.bullet 不是一个函数，因为我安装了 d3，
并且还在第一个脚本中链接了最新的 d3 版本。我以前在谷歌搜索或在堆栈溢出上搜索它时从未见过此错误。

     <script type="text/javascript" src="https://d3js.org/d3.v4.min.js"></script>
 <script src="js/bullet.js"></script>
 <script>
  var margin = {top: 5, right: 40, bottom:20 , left:120},
  width = 800-margin.left - margin.right,
  height = 50-margin.top - margin.bottom;
  var chart = d3.bullet()
          .width(width)
          .height(height);
  d3.json("data/jsonFakeDaten.json", function(error, data) {
    var svg = d3.select("body").selectAll("svg")
          .data(data)
        .enter().appennd("svg")
          .attr("class","bullet")
          .attr("width",width + margin.left + margin.right)
          .attr("height", height + margin.top + margin.bottom)
        .append("g")
          .attr("transform", "translate(" + margin.left + "," + margin.top + ")")
          .call(chart);

    var title = svg.append("g")
        .style("text-anchor", "end")
        .attr("transform", "translate(-6," + height / 2 + ")");
    title.append("text")
      .attr("class", "title")
      .text(function(d) { return d.title; });
    title.append("text")
      .attr("class", "subtitle")
      .attr("dy", "lem")
      .text(function (d) { return d.subtitle; });
    d3.selectAll("button").on("click", function() {
      svg.datum(randomize).call(chart.duration(1000));
    });
  });
  function randomize(d) {
    if(!d.randomizer) d.randomizer = randomizer(d);
    d.markers = d.markers.map(d.randomizer);
    d.measures = d.measures.map(d.randomizer);
    return d;
  }
  function randomizer(d) {
    var k = d3.max(d.ranges) * .2;
    return function(d) {
      return Math.max(0,d + k * (Math.random() - .5));
    };
  }
</script>

Answer 1

我注意到的第一件事是你在这里有一个错字：

    .enter().appennd("svg")

这可能会给您带来一些错误，如果您使用的是 Bostock bl.ocks.org 示例中的子弹.js那么您应该使用 d3.v3 而不是 v4，因为它们不兼容。