Question

我正在尝试学习这段代码以介绍d3 javascript。这就是我要复制的http://curran.github.io/screencasts/introToD3/examples/viewer/#/97。

我得到的错误如下：

simplify.js：2未捕获的ReferenceError：未定义require（匿名函数）@ simplify.js：2 d3.min.js：3未捕获TypeError：无法读取nullta.extent @的属性'length'

我真的不知道如何将外部js文件包含到html文件中。我不知道我哪里出错了。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>D3 temp</title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
    <script src="simplify.js"></script>
    </head>
  <body>
    <script>

    var outerWidth   = 500;
    var outerHeight  = 250;
    var circleRadius = 3;
    var margin = {left: 30, top: 30, right: 30, bottom: 30};

    var xColumn = "timestamp";
    var yColumn = "temperature";

    var svg = d3.select("body").append("svg")
        .attr("width", outerWidth)
        .attr("height", outerHeight);
    var g = svg.append("g")
        .attr("transform", "translate(" + margin.left + "," + margin.top +")");

    var innerWidth = outerWidth   - margin.left  - margin.right;
    var innerHeight = outerHeight - margin.top - margin.bottom;

    var xScale = d3.time.scale().range([0, innerWidth]);
    var yScale = d3.scale.linear().range([innerHeight, 0]);

    function render(data)
    {
        xScale.domain(d3.extent(data, function(d){ return d[xColumn]; }));
        yScale.domain(d3.extent(data, function(d){ return d[yColumn]; }));

        var circles = g.selectAll("circle").data(data);
        circles.enter().append("circle")
            .attr("r", circleRadius);
        circles
            .attr("cx", function(d){ return xScale (d[xColumn]); })
            .attr("cy", function(d){ return yScale (d[yColumn]); });

        circles.exit().remove();
    }

    function type(d){
      d.timestamp   = new Data(d.timestamp);
      d.temperature = +d.temperature;
      return d;
    }



    d3.csv("SFweek.csv", type, render);
   </script>
  </body>
</html>

由于该文件已经是csv文件，我只使用simplify.js

    // A Node.js script that filters data.
    var fs = require('fs');
    var d3 = require('d3');
    var csv = fs.readFileSync('SFWeek.csv', 'utf-8');
    var data = d3.csv.parse(csv);

    // Filter by city.
    data = data.filter(function (d) {
      return d.city === "San Francisco";
    });

    // Only include 2 rows.
    data = data.map(function (d) {
      return {
        timestamp: d.timestamp,
        temperature: d.temperature
      };
    });

    fs.writeFileSync('SFweek.csv');

外部Javascript文件的未捕获的ReferenceError

0 个答案: