问调用if…然后在d3节点上运行
EN

Stack Overflow用户

提问于 2015-11-13 17:09:34

回答 2查看 39关注 0票数 1

我试图在d3中调用一个条件函数，但在运行此代码时遇到了问题。

我的d3代码：

//create a div element within #container for each object
day = d3.select("#container").selectAll("div")
    .data(data)
    .enter()
        .append("div");

根据对象的date属性，我想添加一个具有不同文本的p元素：

//get today's date
var today = new Date();

//if after today
if (Date.parse(d.date) > today) {

    //print 'after today!'
    day.append('p').text(function(d) { return "after today!" });

//otherwise
} else {

    //print 'today or before'
    day.append('p').text(function(d) { return "today or before!" });
};

有没有人能帮我把这个弄好？

javascript

d3.js

人脸识别特惠活动

精准实时的人脸检测、分析、识别等服务，在线、离线满足多样需求，可应用于智慧零售、智慧社区、在线娱乐等多种应用场景

回答 2

Stack Overflow用户

发布于 2015-11-13 17:46:11

你没有提到d.date是什么格式的。如果已经是约会了，就这么做：

day
 .append('p')
 .text(function(d) { 
   return (d.date.getTime() > Date.now()) ? "after today!" : "before today!";
 });

如果不是日期，则转换为日期，然后调用getTime()

编辑

对于您在注释中描述的情况，请使用.each

var data = [1,0,1];
      
var div = d3.select('body')
  .selectAll('div')
  .data(data)
  .enter()
  .append('div')
  .each(function(d){
    var self = d3.select(this);
    if (d === 1){
      self.append('p')
        .text('Hi Mom!')
    } else {
      self.append('img')
        .attr('src','https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png')
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

票数 1

Stack Overflow用户

发布于 2015-11-13 17:21:20

附带的是一把小提琴：http://jsfiddle.net/nkqL4c26/7/。

JS：

//sample data:
var data = [
    {'date': "Sat Nov 15 2015 08:09:49 GMT+0530"},
    {'date': "Sat Nov 14 2015 08:09:49 GMT+0530"},
    {'date': "Sat Nov 13 2015 08:09:49 GMT+0530"},
    {'date': "Sat Nov 12 2015 08:09:49 GMT+0530"},
    {'date': "Sat Nov 11 2015 08:09:49 GMT+0530"}
];

d3.select("#container")
    .data(data, function(d, i ) { return d +i;})
    .enter()
    .append('p')
    .text(function(d) {
        var self = d3.select(this);
        return (Date.parse(d.date) > Date.now()) ? 
                " after today!"
                :" today or before!";
    });

HTML：

<div id="container">  </div>

由@sergio进行的编辑

我在这里实际上想做的是，如果日期早于今天的日期，则在a标记中附加一个img标记，如果日期在今天的日期之后，则只附加img标记(不带链接)。我认为这就是我正在寻找的行为，但我不确定我的语法是否正确：

day.append(function(d) {
    return (Date.parse(d.date) > Date.now()) ? 
        ('img').attr('src', 'img/inactive.png') : 
        ('a').attr('href', d.url)
            .append('img').attr('src', 'img/active.png');
});