0

I looked for a lot of things to add a feature to my chart but I couldn't find it in the documentation or here, I would like to add a visual addition of today's date, on the bottom legend for example, does anyone have any examples or ideas? thank you in advance Example of my chart with the feature

new Chart(canvas, {
    type: 'line',
    data: {
        labels: [ <?php echo $txt_labels; ?> ],
        datasets: [{
            label: 'Réelle',
            yAxisID: 'A',
            data: [ <?php echo $txt_series1; ?> ],
            borderColor: 'rgba(238, 121, 83, 1)',
            backgroundColor: 'rgba(0, 0, 0, 0)',
            pointBackgroundColor: "rgba(238, 121, 83, 1)",
            pointRadius: 5,            
        }, {
            label: 'Attendue',
            yAxisID: 'B',
            data: [ <?php echo $txt_series2; ?> ],
            borderColor: 'rgba(167, 172, 200, 1)',
            backgroundColor: 'rgba(0, 0, 0, 0)', 
            pointBackgroundColor: "rgba(167, 172, 200, 1)",
            pointRadius: 5,  
        }]
    },
    options: {
      animation: {
        animateScale: true,
        animateRotate: true,
        duration: 1500,
        easing: 'easeInOutSine',        
       },
        scales: {
          x:{
            grid: {
            borderColor: 'rgba(16, 16, 18, 0.5)',
            offset: true,       
            },
          },
            A: {
                type: 'linear',
                position: 'left',
                grid: {
                  display: false,
                  borderColor: 'rgba(16, 16, 18, 0.5)',
                },
                ticks: {
                  font: {
                    size: 14,
                  },
                  callback: function(value, index, values) {
                    return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
                  }
                }, 
            },
            B: {
                type: 'linear',
                position: 'right',                                             
                  }
                },               
            },
        },       
    }
});
Gwen973
  • 23
  • 4
  • Does this answer your question? [Chart.js — drawing an arbitrary vertical line](https://stackoverflow.com/questions/30256695/chart-js-drawing-an-arbitrary-vertical-line) – winner_joiner Dec 02 '22 at 11:07
  • I think the easiest way is to use annotation plugin https://github.com/chartjs/chartjs-plugin-annotation – user2057925 Dec 02 '22 at 11:09
  • I tested version 3 and it doesn't correspond to my data or else I can't understand how to integrate it... in the example, the visualization of the line is something static, so I would have to correspond to today's date – Gwen973 Dec 02 '22 at 12:52

0 Answers0