Reputation: 1809
I'm trying to write a function in d3 that will check the "time" of my data and see whether it is between two other times, and filter accordingly.
//start with a function to check if time for each data point is in between two other times
function timeInterval(data, start, end) {
var time = data.Time
if (start <= time <= end) {
return "inline";
} else {
return "none";
};
}
//set the display of points to either inline or none
function updateTime(value) {
d3.selectAll(".events")
.style("display", timeInterval("20:00", "24:00"));
}
//When radio button on, call updateTime function
d3.selectAll("#timeFilterRadioButton").on("change", function() {
updateTime()
});
My issue is that I'm unable to call timeInterval
with the start and end parameters. Calling timeInterval("20:00", "24:00")
results in time being undefined. The only way I can successfully pass in the data is if I call the function without any parameters:
function updateTime(value) {
d3.selectAll(".events")
.style("display", timeInterval); //calling timeInterval in this manner, I'm able to console.log the time property of the data
}
Where am I going wrong here?
Upvotes: 3
Views: 153
Reputation: 102198
Just use an anonymous function to get the data and wrap your timeInterval
function in it:
function updateTime(value) {
d3.selectAll(".events")
.style("display", function(d) {
//your datum is here---^
return timeInterval(d, "20:00", "24:00")
//use it here-------^
});
};
Not related, but this:
if (start <= time <= end)
Will return true
for all start <= time
, regardless end
.
Upvotes: 3