javascript - 如何在我的 d3js 示例中添加 if 条件

标签 javascript html css svg d3.js

考虑 jsfiddle 链接 http://jsfiddle.net/5D5eD/5/ .它具有数据值 [2,2]、[3,3]、[4,4]、[5, 4]、[5.5, 5]、[6, 6]、[6, 7]、[5,6 ].在此示例中,最后两个值是 [6,7] 和 [5,6]。我想添加一个条件,即如果 y 值小于先前的值,则数据点应将 y 值增加 1 个单位。在我的例子中,从 [6,7] 到 [5,6] 的行应该替换为从 [6,7] 到 [5,8] 的行。如何在代码中实现这一点?

 var line = d3.svg.line()
 .x(function(d){return x(d[0]);})
  .y(function(d){return y(d[1]);})
 .interpolate("linear");  

   g.append("path")
  .attr("d", function(d) { return line(data)})
  .attr("transform", "translate(0,0)")
   .style("stroke-width", 2)
        .style("stroke", "steelblue")
        .style("fill", "none");
   // end of drawing lines

       main.append("g")
   .attr("class", "grid")
   .attr("transform", "translate(0," + height + ")")
   .call(make_x_axis()
   .tickSize(-height, 0, 0)
   .tickFormat(""))

    main.append("g")
   .attr("class", "grid")
   .call(make_y_axis()
   .tickSize(-width, 0, 0)
   .tickFormat(""))

    function make_x_axis() {
    return d3.svg.axis()
    .scale(x)
    .orient("bottom")
     .ticks(30)
     }

    function make_y_axis() {
    return d3.svg.axis()
    .scale(y)
    .orient("left")
    .ticks(17)
    }

最佳答案

请看这个FIDDLE .我认为这就是您想要的。

var py;
data.map(
    function(d) {
        if (d[1] < py)
            d[1] = py + 1;
        py = d[1];
    }
);

关于javascript - 如何在我的 d3js 示例中添加 if 条件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22683142/

相关文章:

css - ngClass 不接受 3 个条件

jquery - 在 Jquery 中展开和折叠表行

javascript - 转换日期,以便可以将 jquery 日历值设置为日期

javascript - 计算n个长度的字符串和每个位置的n个字符的组合

html - CSS 美学对 CSS 的帮助

HTML电子邮件链接颜色困境

javascript - 如何从一个地方获取文本然后在同一页面的其他地方呈现?

javascript - react handleChange 语法

javascript - 编辑样式不起作用

html - 如何让 "fit-content"跨浏览器工作?