Javascript d3js时间轴动态标记持续时间设置

我正在尝试创建一个带有时间x轴的条形图。我在动态设置刻度值时遇到问题

.ticks(d3.time.minutes, 10)

以上代码适用于我，但当数据较多时，我希望持续时间增加到30分钟，即

.ticks(d3.time.minutes, 30)

我试过了

.ticks(function () { return (dataPassed.length > 5) ? ((d3.time.minutes, 30)) : ((d3.time.minutes, 10)); })
.tickValues(xScale.domain())

以上方法都不起作用。我的代码的JSIDLE链接：。我把这两个数据集放在了一起，越来越少的值。谁能帮我一下吗

提前谢谢

[更新：] 事实上，这不仅仅是我想要的两个条件。我的更新代码是：

if (dataPassed.length < 4)
        {
            var xAxis = d3.svg.axis()
                    .scale(xScale)
                    .orient('bottom')
                    .ticks(d3.time.minutes, 10)
                    .tickFormat(d3.time.format('%H:%M'))
                    .tickSize(5);

            var boxNoBarWidth = (svgWidth + widthPad) / (dataPassed.length + 3);

        }
        else if (dataPassed.length > 3 && dataPassed.length < 6)
        {
            var xAxis = d3.svg.axis()
                    .scale(xScale)
                    .orient('bottom')
                    .ticks(d3.time.minutes, 15)
                    .tickFormat(d3.time.format('%H:%M'))
                    .tickSize(5);

           var boxNoBarWidth = (svgWidth + widthPad) / (dataPassed.length + 8);
        }
        else if (dataPassed.length > 5) {
            var xAxis = d3.svg.axis()
                    .scale(xScale)
                    .orient('bottom')
                    .ticks(d3.time.minutes, 30)
                    .tickFormat(d3.time.format('%H:%M'))
                    .tickSize(5);

           var boxNoBarWidth = (svgWidth + widthPad) / (dataPassed.length + 10);
        }

我还想调整酒吧的宽度和地方勾在酒吧的中心。有没有办法在时间尺度上通过代码动态地实现这一点

，本教程使用序数轴进行此操作

[更新]：首先，非常感谢您的帮助。关于调整宽度，以下是指向我的图表截图的链接：

,

希望这能让你对我所说的酒吧宽度有所了解。如果不清楚，请告诉我

正如Lars所建议的，我尝试了序数轴，相同的jsfiddle在这里：。如果您观察到这些值，则它们是数据中的精确值，如..9:06、10.45、11.06。我希望勾号值以固定的间隔正确排列

.ticks不接受函数参数，但在您的情况下，您不需要它，因为您没有引用绑定到任何元素的任何动态数据。你所需要的只是

.ticks(dataPassed.length > 5 ? (d3.time.minutes, 30) : (d3.time.minutes, 10))

---

完成演示。

谢谢Lars的回复，请检查我的更新问题和帮助。。。拜托…听起来你真的想要一个序数刻度。您还没有说明要如何调整条的宽度。