第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

使用 Chart.js 使用數(shù)據(jù)庫中的數(shù)據(jù)實(shí)時(shí)更新圖表

使用 Chart.js 使用數(shù)據(jù)庫中的數(shù)據(jù)實(shí)時(shí)更新圖表

PHP
天涯盡頭無女友 2023-11-03 17:41:16
我在使用 Chart.js 時(shí)遇到了一些問題。我正在制作一個(gè)投票系統(tǒng),我想動(dòng)態(tài)更新該系統(tǒng)以供用戶查看。有點(diǎn)像strawpoll 網(wǎng)站。當(dāng)用戶提交投票時(shí),結(jié)果頁面將自動(dòng)更新為新的票數(shù)。我一直在尋找這個(gè)問題的答案,我覺得我已經(jīng)成功了一半。我可以更新實(shí)際的圖表,但它只是復(fù)制數(shù)據(jù)并永遠(yuǎn)持續(xù)下去。我希望它“替換”或只是更新數(shù)字和/或查看新的投票問題。每秒復(fù)制一次的圖表圖片這是我正在運(yùn)行的代碼:<div id="chart-container">    <canvas id="dataChart"></canvas></div><script>    var ctx = $("#dataChart");    var dataChart = new Chart(ctx, {        type: 'bar',        data: {            labels: [],            datasets: [{                label: '<?php echo($row['vote_name']) ?>',                backgroundColor: '#49e2ff',                borderColor: '#46d5f1',                hoverBackgroundColor: '#CCCCCC',                hoverBorderColor: '#666666',                data: [],            }]        },        options: {}    });    var updateChart = function() {        $('#dataChart').html('');        $('#dataChart').html('<canvas id="dataChart"></canvas>');        $.ajax({            url: "data.php?form=<?php echo($vote_id) ?>",            type: "GET",            dataType: "json",            success: function(data) {                console.log(data);                var name = [];                var marks = [];                for (var i in data) {                    dataChart.data.labels.push(data[i].question);                    dataChart.data.datasets[0].data.push(data[i].vote_count);                }                dataChart.update();            },            error: function(data) {                console.log(data);            }        });    }    updateChart();    setInterval(() => {        updateChart();    }, 1000);</script>問題是:這不起作用有什么原因嗎?無論我如何嘗試,我似乎都無法做到正確。任何幫助,將不勝感激!
查看完整描述

1 回答

?
守著一只汪

TA貢獻(xiàn)1872條經(jīng)驗(yàn) 獲得超4個(gè)贊

success功能可以更改如下:

success:?function(data)?{
??dataChart.data.labels?=?data.map(v?=>?v.question);
??dataChart.data.datasets[0].data?=?data.map(v?=>?v.vote_count);
??dataChart.update();
},

該解決方案使用的Array.map()方法創(chuàng)建一個(gè)新的array,并填充在array.


查看完整回答
反對(duì) 回復(fù) 2023-11-03
  • 1 回答
  • 0 關(guān)注
  • 207 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)