在chartjs数据集中使用select选项时,我代码出现问题
下面是html代码
<div class="form-group">
<select name="tahun" id="tahun" class="form-control">
@for ($i = 2021; $i <= date('Y'); $i++)
<option @if ($i == date('Y')) <?php echo 'selected'; ?> @endif value="{{ $i }}">{{ $i }}</option>
@endfor
</select>
</div>
<div id="parent-canvas">
<canvas id="chartpendapatan" width="400" height="200"></canvas>
</div>
jquery代码如下所示:
const ctxpendapatan = document.getElementById('chartpendapatan').getContext('2d');
const myChartpendapatan = new Chart(ctxpendapatan, {
type: 'bar',
data: {
labels: [],
datasets: [{
label: 'Pendapatan Desa',
data: [],
borderWidth: 1
}]
},
options: {
legend: {
display: false
},
scales: {
y: {
beginAtZero: true
}
}
}
});
var getData = function() {
var tahun = $("#tahun").val();
$.ajax({
url: "{{ url('/grafik_pendapatan') }}" + '/' + tahun,
type: "GET",
dataType: "JSON",
success: function(data) {
$.each(data.result, function(id, value) {
myChartpendapatan.data.labels.push(value.nama_bidang);
myChartpendapatan.data.datasets[0].data.push(value.total_anggaran);
});
myChartpendapatan.update();
},
error: function() {
alert("Tidak Ada Data");
}
});
};
const brgy = document.getElementById('tahun');
brgy.addEventListener('change', getData);
我代码的输出是:是我选2021年后的数据
但在我再次选择2022年后,输出如下:
当我第一次点击2021年时,图表中显示了4个数据,因为数据库中有4个数据。但是当我点击2022年后,2021年的数据仍然存在,2022年的数据也显示出来。所以我的问题是,在我选择另一年后,如何不显示以前的数据?
1条答案
按热度按时间6qftjkof1#
你推到标签和数据数组,如果你不想显示以前的数据,你需要先删除这个数据或只是完全覆盖数组: