Firestore orderBy(“日期”,“描述”)在chart.js图形中无法正常工作

zysjyyx4  于 2023-03-02  发布在  Chart.js
关注(0)|答案(1)|浏览(126)

我们的Firestore数据集包括显示日期和时间的数据,我已经使用了... orderBy(“Date”,“desc”);我已经在表格中尝试过这个方法,它在表格中工作得很好,但在chartiderjs线图中不起作用。
到目前为止,我做了以下程序:

$(document).ready(function(){

        firebase.initializeApp(firebaseConfig);
        var db = firebase.firestore();

        var timeOptions = {hourCycle: 'h23', hour: '2-digit', minute:'2-digit'};
        var dateOptions = { day: 'numeric', month: 'numeric' };
    
    
        var docRef = db.collection('Users').doc('000').collection('Data').orderBy("Date", "desc").limit(100);

       docRef.get().then((querySnapshot) => {
          querySnapshot.forEach((doc)=>{
            var one = doc.data();

            var date = one.Date.toDate().toLocaleDateString('en-CA', dateOptions) + " " +  one.Date.toDate().toLocaleTimeString( [],  timeOptions);
            labelsDateArray.push(date);
});

var ctx = document.getElementById("myChart");
        var myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: labelsDateArray,
            datasets: [{
                label: 'Kefa-Firestore-Dataset',
                fill: false,
                showLine: true,
                lineTension: 0.2,
                backgroundColor: "rgba (75, 192, 192,0.4)",
                borderColor: "rgba(139, 0, 0, 1)",
                borderCapStyle: 'butt',
                borderDash: [],
                borderDashOffset: 0.0,
                borderJoinStyle: 'miter',
                pointBorderColor: "rgba(139, 0, 0, 0.5)",
                pointBackgroundColor: "red",
                pointBorderWidth: 2,
                pointHoverRadius: 5,
                pointHoverBackgroundColor: "rgba(0, 0, 0, 1)",
                pointHoverBorderColor: "rgba(0, 0, 0, 1)",
                pointHoverBorderWidth: 5,
                pointRadius: 3,
                pointHitRadius: 10,
            }]
        },
    
        }); 
        
    }).catch((error) => {
        console.log("Error getting document:", error);
    }); 
});

输出是这样的:

那么,我如何才能在这种情况下正确地订购日期和时间,任何人都可以帮助?!
Firestore中的日期格式如下所示:

uurv41yg

uurv41yg1#

2023年,主流浏览器中的Javascript将2022年引入的bug 16399提取到Unicode通用语言环境数据库中,该漏洞将en-CA数字日期格式设置为美国日期格式,而不是加拿大标准的YYYY-MM-DD格式。
在unicode和浏览器修复之前,一个变通方案是使用“fr-CA”日期格式。

相关问题