0

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

Uncaught TypeError: d3.bullet is not a function
因为我安装了 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>
4

1 回答 1

0

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

    .enter().appennd("svg")

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

于 2017-04-04T16:46:07.313 回答