Melewati tanggal dari metode web ke bagan anotasi Google

Saya mencoba menampilkan bagan anotasi Google menggunakan visual studio, memanggil metode web melalui data ajax & JSON. Saya telah mencoba berbagai format tetapi kolom date sepertinya tidak menyukai format tanggal yang saya lewati.

Saat saya menjalankan ini, hasil json.parse yang dibuat dari data pengujian saya adalah:

[
    ["Thu Dec 24 2015 18:00:00 GMT-0600 (Central Standard Time)",1094,"0","test"], 
    ["Wed Dec 16 2015 18:00:00 GMT-0600 (Central Standard Time)",4000,"2","test"], 
    ["Mon Dec 14 2015 18:00:00 GMT-0600 (Central Standard Time)",7888,"4","test"], 
    ["Sun Dec 13 2015 18:00:00 GMT-0600 (Central Standard Time)",10804,"0",""], 
    ["Wed Dec 09 2015 18:00:00 GMT-0600 (Central Standard Time)",3878,"0",""],
    ["Tue Dec 08 2015 18:00:00 GMT-0600 (Central Standard Time)",1312,"0",""], 
    ["Mon Dec 07 2015 18:00:00 GMT-0600 (Central Standard Time)",2565,"1","test"]
]

Dan akhirnya saya menerima kesalahan:

Kesalahan waktu proses JavaScript: Ketik tidak cocok. Nilai Kam 24 Des 2015 18:00:00 GMT-0600 (Waktu Standar Tengah) tidak sesuai dengan jenis tanggal di kolom indeks 0.

Saya telah mencari solusi selama 2 hari tetapi tidak berhasil.

<script type="text/javascript">
function drawAnnoChart() {
    var dUser = document.getElementById('MainContent_lblUsername').innerHTML;
    var dUnit = document.getElementById('MainContent_hfUnitChoice').value;
    var data = new google.visualization.DataTable();
    dateFormatter = new google.visualization.DateFormat({ formatType: 'short' });

    data.addColumn('date', 'Date');
    data.addColumn('number', 'Distance');
    data.addColumn('string', 'Felt');
    data.addColumn('string', 'Notes');

    $.ajax({
        type: "POST",
        url: "me.aspx/GetSwimData",
        data: JSON.stringify({ 'dUser': dUser, 'dUnit': dUnit }),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (r) {
            var dstring = '';
            for (var i = 0; i < r.d.length; i++) {
                r.d[i][0] = '"' + new Date(r.d[i][0]) + '"';
                r.d[i][2] = '"' + r.d[i][2] + '"';
                r.d[i][3] = '"' + r.d[i][3] + '"';
                if (i == 0) { dstring = '[' + r.d[i] + ']'; }
                else { dstring = dstring + ',' + '[' + r.d[i] + ']'; }
            }
            dstring = '[' + dstring + ']';
            data.addRows(JSON.parse(dstring));
        },
        failure: function (r) {
            alert(r);
        },
        error: function (r) {
            alert(r);
        }
    });

    var chart = new  google.visualization.AnnotationChart(document.getElementById('chart_div'));
    var options = {
        displayAnnotations: true
    };
    chart.draw(data, options);
}

</script>

javascript visual-studio google-visualization
person user5729209    schedule 30.12.2015    source sumber
comment
memformat dan menyusun ulang prosa   -  person Steve    schedule 30.12.2015

Jawaban (3)


arrow_upward
0
arrow_downward

Cobalah mengembalikan sesuatu seperti:

[
    ["Date(2015,12,24,18,0,0)",1094,"0","test"], 
    ["Date(2015,12,16,18,0,0)",4000,"2","test"], 
    ["Date(2015,12,14,18,0,0)",7888,"4","test"], 
    ["Date(2015,12,13,18,0,0)",10804,"0",""], 
    ["Date(2015,12,9,18,0,0)",3878,"0",""],
    ["Date(2015,12,8,18,0,0)",1312,"0",""], 
    ["Date(2015,12,7,18,0,0)",2565,"1","test"]
]
person Saúl Martínez Vidals    schedule 30.12.2015

arrow_upward
0
arrow_downward

Hanya perlu memformat tanggal dengan benar, sesuatu seperti ini akan berfungsi...

google.charts.load('current', {'packages':['annotationchart']});
google.charts.setOnLoadCallback(drawAnnoChart);


function drawAnnoChart() {
    var data = new google.visualization.DataTable();

    data.addColumn('date', 'Date');
    data.addColumn('number', 'Distance');
    data.addColumn('string', 'Felt');
    data.addColumn('string', 'Notes');

    var dataArr = [
        ["Thu Dec 24 2015 18:00:00 GMT-0600 (Central Standard Time)",1094,"0","test"], 
        ["Wed Dec 16 2015 18:00:00 GMT-0600 (Central Standard Time)",4000,"2","test"], 
        ["Mon Dec 14 2015 18:00:00 GMT-0600 (Central Standard Time)",7888,"4","test"], 
        ["Sun Dec 13 2015 18:00:00 GMT-0600 (Central Standard Time)",10804,"0",""], 
        ["Wed Dec 09 2015 18:00:00 GMT-0600 (Central Standard Time)",3878,"0",""],
        ["Tue Dec 08 2015 18:00:00 GMT-0600 (Central Standard Time)",1312,"0",""], 
        ["Mon Dec 07 2015 18:00:00 GMT-0600 (Central Standard Time)",2565,"1","test"]
    ];

    for (var i = 0; i < dataArr.length; i++) {
        data.addRow([
            new Date(dataArr[i][0].substr(4, 20)),
            dataArr[i][1],
            dataArr[i][2],
            dataArr[i][3]
        ]);
    }
  
    var chart = new  google.visualization.AnnotationChart(document.getElementById('chart_div'));
    var options = {
        displayAnnotations: true
    };
    chart.draw(data, options);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div" style="width: 900px; height: 500px;"></div>

person WhiteHat    schedule 30.12.2015
comment
itu tidak berhasil. Ini meneruskan nilai tanggal yang tidak valid ke datatable, yang kemudian menciptakan kesalahan karakter yang tidak valid. - person user5729209; 30.12.2015

arrow_upward
0
arrow_downward

terima kasih untuk kedua jawaban. Saya memecahkan masalah ini dengan mengubah cara saya mengisi datatable. Saya menggunakan metode datatable.setValue untuk mengatur nilai sel satu per satu.

person user5729209    schedule 30.12.2015