d3 - 在24小時制時間格式化一個整數

Question

我已經看到類似於這個的其他問題，但我的是一個獨特的案例。

我從一個模擬器繪製點，每隔9秒收集數據24小時。這將返回一個包含9600個值的數組。

目前，我通過將數組索引轉換爲0到24之間的整數（0.0025（9/60/60 == 0.0025））來顯示整數。所以9600 * .0025 == 24.

但是，我希望能夠顯示半小時和四分之一小時，因此上午1:15會顯示爲1:15，並且下午3:30會顯示截至15:30。

我該怎麼做？

Answer 1

如果我理解正確，在午夜設置基準日期然後添加到它可能會更容易，因此您可以使用d3.time.format，下面的某種形式。

var i = 4800 
var date = new Date(); 
date.setHours(0,0,0,0); //set date to midnight 

var format = d3.time.format("%H:%M %p") //format to Hour Minutes 
date.setSeconds(date.getSeconds() + (9 * i)); //9*4800 for Noon 

alert(format(date)) //Alerts 12 P.M. 

然後用剔格式爲中軸線，每刻鐘，它類似於下面

d3.svg.axis() 
    .scale(x) 
    .orient("bottom") 
    .ticks(d3.time.minutes, 15) 
    .tickFormat(d3.time.format("%H:%M")); 

Answer 2

如果有人有一個整數範圍，並希望在這裏展示的蜱時，用它們作爲小時v4的解決方案：

var yScale = d3.scaleLinear() 
    .domain(timeExtent) // [6, 20] from 06:00 to 20:00 
    .range([0, height - cellHeight]); 

var yAxis = d3.axisLeft(yScale) 
    .tickFormat(function (hour) { 
     var now = new Date(); 
     now.setHours(hour, 0, 0, 0); 
     return d3.timeFormat("%H:%M")(now); 
    });