Javascript 为colorbrewer呈现d3.js库可视化

Javascript 为colorbrewer呈现d3.js库可视化,javascript,d3.js,Javascript,D3.js,我正在尝试实现渲染欧盟d3地图,可视化不同组成国家的数据 当我尝试执行本教程的最后一步时,使用以下功能结合d3.js库,根据数据以不同的方式为国家着色: queue() .defer(d3.json, "eu.json") .defer(d3.json, "data.json") .await(ready); function ready(error, europe, data) { if (error) return console.error(error);

我正在尝试实现渲染欧盟d3地图,可视化不同组成国家的数据

当我尝试执行本教程的最后一步时,使用以下功能结合d3.js库,根据数据以不同的方式为国家着色:

queue()
    .defer(d3.json, "eu.json")
    .defer(d3.json, "data.json")
    .await(ready);

function ready(error, europe, data) {
    if (error) return console.error(error);

    var quantize = d3.scale.quantile()
             .domain(d3.extent(d3.values(data), function (d) { return d.value; }))
             .range(d3.range(6)),
        cb = "Reds";

    function fill(datum, index) {
          var iso = datum.properties.iso_n3,
               val = data[iso] && data[iso].value;
          if (val) {
              var c = colorbrewer[cb][6][quantize(val)];
              return c;
          } else {
              return "lightgray";
          }
    }


    var svg = d3.select("#container").append("svg")
        .attr("width", width)
        .attr("height", height);

    var eu = topojson.feature(europe, europe.objects.europe),
        countries = eu.features;

    projection.scale(1).translate([0, 0])

    var b = path.bounds(eu),
        s = .95 / Math.max((b[1][0] - b[0][0]) / width, (b[1][1] - b[0][1]) / height),
        t = [(width - s * (b[1][0] + b[0][0])) / 2, (height - s * (b[1][1] + b[0][1])) / 2];

    projection.scale(s).translate(t);

    svg.selectAll("path")
        .data(countries)
        .enter().append("path")
        .attr("d", path)
        .attr("class", "country")
        .classed("eu-country", isEuCountry);

    svg.selectAll(".eu-country")
        .style("fill", fill);
}
程序崩溃,我的浏览器没有加载任何内容

我已经把范围缩小到那个代码了

也许更熟悉Javascript的人能够找出这里的问题所在

组件中命名的文件:

queue()
    .defer(d3.json, "eu.json")
    .defer(d3.json, "data.json")
    .await(ready);

与我的index.html文件位于同一目录中。所以这不是问题所在

您需要以这种方式包括coldbrewer,就像java include语句一样

    <script src="http://d3js.org/colorbrewer.v1.min.js"></script>

你说它崩溃是什么意思?你是如何将它缩小到你发布的代码的范围的?你能上传到某个地方并添加指向这两个文件eu.json、data.json的链接,这样就可以在另一台计算机上复制代码了吗?同时,你可能会对这个欧盟地图的例子感兴趣:我解决了这个问题,并把它作为一个答案发布了出来