javascript - D3 map ， 'd' 属性

Question

(对不起，我的英语水平很差)嗨，我第一次使用 D3 和 mithril js。 map 没问题，但我对省份的颜色有疑问，它来自“d”属性以获取省份的 id。该属性未定义，我不明白“d”到底是什么。是 Mithril 的问题吗？还有其他方法可以获得“d”属性吗？

controller.map = function(el){
    var width = 1160;
    var height = 960;
    var scale = 10000;
    var offset = [width / 2, height / 2];
    var center = [0, 50.64];
    var rotate = [-4.668, 0];
    var parallels = [51.74, 49.34];

    var projection = d3.geo.albers()
        .center(center)
        .rotate(rotate)
        .parallels(parallels)
        .scale(scale)
        .translate(offset)
    ;
    var path = d3.geo.path()
        .projection(projection)
    ;
    var svg = d3.select(el).append("svg")
        .attr("width",width)
        .attr("height",height)
    ;
    d3.json("belprov.json",function(error,be){
        if (error) return console.error(error);

        var bounds  = path.bounds(topojson.feature(be, be.objects.subunits));
        var hscale  = scale*width  / (bounds[1][0] - bounds[0][0]);
        var vscale  = scale*height / (bounds[1][1] - bounds[0][1]);
        scale   = (hscale < vscale) ? hscale : vscale;
        offset  = [width - (bounds[0][0] + bounds[1][0])/2,
            height - (bounds[0][1] + bounds[1][1])/2];
        var centroid = d3.geo.centroid(topojson.feature(be, be.objects.subunits));
        center = [0, centroid[1]];
        rotate = [-centroid[0],0];
        projection = d3.geo.albers()
            .center(center)
            .rotate(rotate)
            .parallels(parallels)
            .scale(scale)
            .translate(offset);

        svg.selectAll(".province")
            .data(topojson.feature(be, be.objects.provinces).features)
            .enter().append("path")
            .attr("class", function(d) { return "province " + d.id })
            .attr("d", path)
        ;
    })
};

Answer 1

路径对象中的 "d" 属性定义路径必须经过的点的连续坐标(它还指示路径是否应使用贝塞尔曲线、直线、 ETC。)。参见 some documentation here .

注意:在 d3 中，d 通常用作表示当前绑定(bind)到当前元素的数据的匿名函数的参数。所以这两者是完全不同的东西。

在这里，你的台词

.attr("d", path)

应该看起来更像

.attr("d", function(d){return d.path})

即，采用数据元素中的字段 path。