Estoy usando chart.js para trazar un conjunto de datos, que es una proporción de dos variables y varía de 10 a -10. Pero la mayoría de las veces oscila alrededor de y=1.
Estoy tratando de trazar un gráfico de líneas completas de este conjunto de datos con la ayuda de chart.js3. ¿Cómo cambio la dirección de relleno cuando está por debajo de 1 (es decir, y<1) en lugar de y=0 por defecto?
Puede establecer un objeto para el relleno en el que puede configurar esto:
const options = { type: 'line', data: { labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], datasets: [{ label: '# of Votes', data: [12, 19, 3, 5, 2, 3], borderColor: 'orange', fill: { target: { value: 8 }, above: 'rgb(255, 0, 0)', // Area will be red above the value 8 below: 'rgb(0, 0, 255)' // And blue below the value 8 } }] }, options: {} } const ctx = document.getElementById('chartJSContainer').getContext('2d'); new Chart(ctx, options); <body> <canvas id="chartJSContainer" width="600" height="400"></canvas> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.js"></script> </body>