d3.js. Spinning globe with bars

Question

I am trying to create spinning globe with bars like in this example. You can see my example here. And everything goes fine until bars go over horizon. I have no idea how to cut

Answer 1

Just keep track of the range of visible longitudes and hide the bars if they are not in that range

.attr("display", function(d) {
    // make the range from 0 to 360, so that it's easier to compare
    var longitude = Number(d.Longitude) + 180;
    // +270 => -90 => the position of the left edge when the center is at 0
    // -value because a rotation to the right => left edge longitude is reducing
    // 360 because we want the range from 0 to 360
    var startLongitude = 360 - ((longitudeScale(current) + 270) % 360);
    // the right edge is start edge + 180
    var endLongitude = (startLongitude + 180) % 360;
    if ((startLongitude < endLongitude && longitude > startLongitude && longitude < endLongitude) ||
        // wrap around
        (startLongitude > endLongitude && (longitude > startLongitude || longitude < endLongitude)))
        return "block";
    else
        return "none";
})

---

Fiddle - http://jsfiddle.net/b12ryhda/