Componente

Chart

Gráfico Chart.js (bar, line, pie, doughnut, radar...) con datos y opciones configurables.

{% comp_chart ... %}

Código a utilizar

template.html 
{% comp_chart id="chart-demo" type="bar" data={"labels":["Ene","Feb","Mar","Abr","May","Jun"],"datasets":[{"label":"Ventas","data":[42,73,28,91,55,67],"backgroundColor":["#3b82f6","#2563eb","#1d4ed8","#1e40af","#60a5fa","#93c5fd"]}]} options=[{"value": "1", "label": "Opción Alpha"}, {"value": "2", "label": "Opción Beta"}, {"value": "3", "label": "Opción Gamma"}] height="300px" %}

Vista previa en vivo

API Props & Playground

Los cambios actualizan la vista previa en tiempo real
Prop Valor
id
None
type
Tipo técnico del elemento HTML
'bar'
data
None
options
None
 3 elementos
height
'400px'
classes
''

Carga la librería con {% load components_ui %} antes de usar el componente.