Ir al contenido
Menú
Se marcó esta pregunta
1 Responder
3025 Vistas

Is it possible to include a script in a qweb report which then shows a Radar Chart including values from a module?

Static view for the script is:

const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
type: 'radar',
data: {
labels: [One, Two, Three, Four, Five, Six, Seven],
datasets: [{
label: 'My First Dataset',
data: [65, 59, 90, 81, 56, 55, 40],
fill: true,
backgroundColor: 'rgba(255, 99, 132, 0.2)',
borderColor: 'rgb(255, 99, 132)',
pointBackgroundColor: 'rgb(255, 99, 132)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgb(255, 99, 132)'
}, {
label: 'My Second Dataset',
data: [28, 48, 40, 19, 96, 27, 100],
fill: true,
backgroundColor: 'rgba(54, 162, 235, 0.2)',
borderColor: 'rgb(54, 162, 235)',
pointBackgroundColor: 'rgb(54, 162, 235)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgb(54, 162, 235)'
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
}
}
});


How can I change the labels and the data in variables from the module.

Avatar
Descartar
Mejor respuesta

Hi,

If you want to get the data from the backend, you need to do an ajax call and return the data from the controller and create the chart in the .then function of the ajax result.

JavaScript

var ctx = document.querySelector("#_id_of_radar_chart");
ajax.jsonRpc('/controller_name', 'call',{'values to pass to the controller in dictionary format'})
.then(function (result) {
const myChart = new Chart(ctx, {
type: 'radar',
data: {
labels: result['labels'],
datasets: [{
label: 'My First Dataset',
data: result['datas'],
fill: true,
backgroundColor: 'rgba(255, 99, 132, 0.2)',
borderColor: 'rgb(255, 99, 132)',
pointBackgroundColor: 'rgb(255, 99, 132)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgb(255, 99, 132)'
}, {
label: 'My Second Dataset',
data: [28, 48, 40, 19, 96, 27, 100],
fill: true,
backgroundColor: 'rgba(54, 162, 235, 0.2)',
borderColor: 'rgb(54, 162, 235)',
pointBackgroundColor: 'rgb(54, 162, 235)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgb(54, 162, 235)'
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
}
}
});
 
}

Python

@route(['/controller_name'], type='json')
def controller_name(self, **kwargs):
#kwargs will have the values passed from the ajax call.
return {'labels': [label 1, label 2], 'datas': [data 1, data 2]}

Regards

Avatar
Descartar
Publicaciones relacionadas Respuestas Vistas Actividad
3
ago 17
9549
0
ene 25
1394
0
feb 24
1632
0
ago 23
2738
1
feb 24
13457