I'm trying to show my data into chart js graph, my data format is this:
> {length: 3, objects: Array(3)}
length: 3
objects: Array(3)
0: {counter: 1, date: '2022-06-01 00:00:00', income: '233.000', …}
1: {counter: 2, date: '2022-05-01 00:00:00', income: '1000.000', …}
2: {counter: 3, date: '2022-04-01 00:00:00', income: '89.000', …}
length: 3
[[Prototype]]: Array(0)
[[Prototype]]: Object
here is what i tried in my js:
function listChartMonOutcome(){
$.ajax({
type:'GET',
url:'/listcharts/data/',
success:function(data){
var totalMonthCanvas = $('#listChart').get(0).getContext('2d')
var totalMonthData = {
labels: [
data
],
data:{
datasets:[{
data:[{
data
}]
}]
}
}
var totalMonthOptions = {
responsive : true,
maintainAspectRatio : false,
datasetFill : false,
parsing: {
xAxisKey: 'income',
yAxisKey: 'date'
}
}
var totalMonthChart = new Chart(totalMonthCanvas, {
type: 'bar',
data: totalMonthData,
options: totalMonthOptions
})
}
})
}
listChartMonOutcome()
} <div class="card-body">
<div class="chart">
<canvas id="listChart" style="height:250px; min-height:250px"></canvas>
</div>
</div>but it shows nothing, in the console as well.
and also tried this in the data :
labels = [data.map(({datE}) => date) ]
datasets: [
{
data: [
data.map(({income}) => income)
],
}
]
but raise this error:
Uncaught TypeError: data.map is not a function
is there any solution for this problem please?
Thank you for helping