Javascript 根据当前';第'天;是
我正在创建一个数据可视化,并尝试根据当前日期动态渲染第2-7天 获取当前日期的动态函数正在工作,并保存为名为“day”的变量。然而,我不知道根据“day”变量的不同,用什么逻辑在我的谷歌图表中创建以下工作日Javascript 根据当前';第'天;是,javascript,arrays,google-visualization,Javascript,Arrays,Google Visualization,我正在创建一个数据可视化,并尝试根据当前日期动态渲染第2-7天 获取当前日期的动态函数正在工作,并保存为名为“day”的变量。然而,我不知道根据“day”变量的不同,用什么逻辑在我的谷歌图表中创建以下工作日 // Temporary array of placeholder dates for the last 9 days let tempArray = [{time: "2020-11-28T04:13:30.000Z", value: 30},
// Temporary array of placeholder dates for the last 9 days
let tempArray = [{time: "2020-11-28T04:13:30.000Z", value: 30},
{time: "2020-11-27T04:13:40.000Z", value: 77},
{time: "2020-11-26T04:13:50.000Z", value: 96},
{time: "2020-11-25T04:14:00.000Z", value: 64},
{time: "2020-11-24T04:14:10.000Z", value: 58},
{time: "2020-11-23T04:14:20.000Z", value: 45},
{time: "2020-11-22T04:14:30.000Z", value: 24},
{time: "2020-11-21T04:14:40.000Z", value: 19},
{time: "2020-11-20T04:14:50.000Z", value: 44},
{time: "2020-11-19T04:15:00.000Z", value: 49}]
// Function to turn ISO date format into an integer from 0-6 to get the day
function getDayWeek(timeData, i){
let date = timeData[i].time
switch (new Date(date).getDay()) {
case 0:
day = "Sun";
break;
case 1:
day = "Mon";
break;
case 2:
day = "Tue";
break;
case 3:
day = "Wed";
break;
case 4:
day = "Thu";
break;
case 5:
day = "Fri";
break;
case 6:
day = "Sat";
}
}
...
// Render Google Chart
function drawChart(dayData) {
...
// Fires function
getDayWeek(tempArray, 0)
// Graph row render
// 'day' variable returns Sat
// Code is missing the logic/function for dynamically rendering the following days
let color = '#2196F3'
var data = google.visualization.arrayToDataTable([
["Day", "Battery", { role: "style" } ],
[day, data1, '#B33D3C'],
[day2, data2, color],
[day3, data3, color],
[day4, data4, color],
[day5, data5, color],
[day6, data6, color],
[day7, data7, color],
]);
...
}
那么,如何根据当前“天”是什么来动态渲染接下来的工作日呢
如果您需要我进一步解释,请告诉我。正如我在评论中告诉您的,使用非常好。这是一个或另一个日期库,但不是本机JS
date
一些开始的例子
const now = moment();
const now_as_date = now.toDate(); // give a valid JS Date
const dayName = now.format('dddd');
const aDate = moment('2020-11-28T04:13:30.000Z');
//clone to not modify the aDate, important !
const previousDay = aDate.clone().add(-1, 'day');
const fourDaysLater = aDate.clone().add(4, 'days');
以下是您如何使用它
function drawChart(dayData) {
//You have a date somewhere, you use it with getDayWeek but I don't see it in the provided code
//let's put something
var date = new Date('2020-11-19T04:15:00.000Z');
const dataTable = ["Day", "Battery", { role: "style" } ];
new Array(7).fill().forEach( (e, i) => {
const day = moment(date).add(i, 'days').format('ddd');
//Where does data1,data2, come from?
const data = '??';
const color = (i===0) ? '#2196F3' : '#B33D3C';
dataTable.push([day, data, color])
});
var data = google.visualization.arrayToDataTable(dataTable);
}
您可以添加值为毫秒的
天来获取下一个日期
const followDays=(dateStr)=>{
常数msInDay=24*60*60*1000;
返回新数组(7)
.fill(0)
.map((u,i)=>
新日期(新日期(dateStr).getTime()+i*msInDay.toDateString())
);
};
日志(以下天数((新日期().toString()));
控制台日志(以下日期('2020-11-24')代码>我强烈建议您使用类似的方法来解决此类问题。谢谢您的回复!日期是从上面的临时数组中提取的。数据是tempArray中每个元素的值。有了你的回答,我清理了很多代码。新的数据表几乎完美地满足了我的需求。只是有一个小错误,不得不将“Day”、“Battery”、“role:“style”}放入自己的头数组中。再次感谢您的回复,并将在将来使用momentJS!