Question

您好我一直试图解决这个问题几个小时但如果有人能帮助我的话会不会很好！

代码：

bars
        .transition()
        .duration(2000)
        .ease("quad")
        .attr("transform", function(d) {
            console.log(d.Sequence + " " + "translate(" + x0(d.Sequence) + ",0)");
            return "translate(" + x0(d.Sequence) + ",0)"; }) ;

一切似乎都正常工作但是条形图不会沿着X轴重新排列到分配给它们的动态值。如果我给他们静态值，他们会移动.. 这是console.log

protein.js:220 ANTFLEEVR translate(5,0)
protein.js:220 YTACETAR translate(65,0)
protein.js:220 LAACLEGNCAEGLGTNYR translate(125,0)
protein.js:220 GHVNITR translate(185,0)
protein.js:220 SGIECQLWR translate(245,0)
protein.js:220 YPHKPEINSTTHPGADLQENFCR translate(305,0)
protein.js:220 NPDSSTTGPWCYTTDPTVR translate(365,0)
protein.js:220 QECSIPVCGQDQVTVAMTPR translate(425,0)
protein.js:220 SEGSSVNLSPPLEQCVPDR translate(485,0)
protein.js:220 GQQYQGR translate(545,0)
protein.js:220 LAVTTHGLPCLAWASAQAK translate(605,0)
protein.js:220 HQDFNSAVQLVENFCR translate(665,0)
protein.js:220 TATSEYQTFFNPR translate(725,0)
protein.js:220 TFGSGEADCGLRPLFEK translate(785,0)
protein.js:220 ELLESYIDGR translate(845,0)
protein.js:220 IVEGSDAEIGMSPWQVMLFR translate(905,0)
protein.js:220 SPQELLCGASLISDR translate(965,0)
protein.js:220 WVLTAAHCLLYPPWDK translate(1025,0)
protein.js:220 NFTENDLLVR translate(1085,0)
protein.js:220 KPVAFSDYIHPVCLPDR translate(1145,0)
protein.js:220 ETAASLLQAGYK translate(1205,0)
protein.js:220 VTGWGNLK translate(1265,0)
protein.js:220 ETWTANVGK translate(1325,0)
protein.js:220 GQPSVLQVVNLPIVERPVCK translate(1385,0)
protein.js:220 ITDNMFCAGYKPDEGK translate(1445,0)
protein.js:220 GDACEGDSGGPFVMK translate(1505,0)
protein.js:220 WYQMGIVSWGEGCDR translate(1565,0)
protein.js:220 YGFYTHVFR translate(1625,0)
protein.js:220 VIDQFGE translate(1685,0)

如果我手动输入0或10等代替x0（d.Sequence），则条形移动到该位置，并且当坐标相同时全部堆积，但是当使用日志中的值时x0（d .Sequence），根本没有任何条形移动...我可以确认记录的翻译值与原始条形图状态有很大不同，所以事情应该移动......

有什么想法吗？救命！？谢谢：）尤瓦

编辑，发布更多代码：

    groupData.sort(function(a, b) {
        return a["StartIndex"] - b["StartIndex"];
    });
    var bars =  d3.select("#barchart").selectAll("g.group")
        .data(groupData);

    var x0 = d3.scale.ordinal()
        .rangeRoundBands([0, width]);

    var xAxis = d3.svg.axis()
        .scale(x0)
        .orient("bottom");


    var groups = ["Before Incubation", "After Incubation"];
    groupData.forEach(function (d) {
        d.groups = groups.map(function (name) {
            return {name: name, value: +d[name]};
        });
        console.log(d.groups)
    });

    x0.domain(groupData.map(function (d) {
        console.log(d);
        return d.Sequence;
    })); // groups

D3 JS在条形图中转换条形时非常奇怪

0 个答案: