Question

大家好，我在为javascript网页项目创建简单的d3图表时遇到问题。这段代码就像在教程中创建的一样，所以我不知道为什么会出现错误：

未捕获的TypeError：d3.bullet不是函数
因为我安装了d3和我也在第一个脚本中链接最新的d3版本。在谷歌搜索或在stackoverflow上搜索之前，我还没有看到这个错误。

     <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示例中的bullet.js，那么你应该使用d3.v3而不是v4，因为他们＆＃ 39;不兼容。

未捕获的TypeError：d3.bullet不是函数

1 个答案: