Ir al contenido
Menú
Se marcó esta pregunta
1 Responder
2528 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
8799
0
ene 25
754
0
feb 24
1033
0
ago 23
2132
1
feb 24
12608