TypeError: CanvasRenderService is not a constructor

user_14341604 0
Viewed 1306

MY corona bot was working for a long time. it was offline for 3 months. Now, i have hosted it in vultr (hosting service). But i never faced this error, but facing this now....

New:

I just had a look, still i am having new error. MY code: https://paste.gg/p/anonymous/16c003ce7e49471b9fc7f4af25a688ae

Error is: 5|x | (node:19549) UnhandledPromiseRejectionWarning: Error: An options parameter object is required –

Yes i have moved from CanvasRenderService to ChartJSNodeCanvas

Old:

 const { CanvasRenderSerice } = require("chartjs-node-canvas")
 
       const canvasRenderService = new CanvasRenderService(
           width,
           height,
           ChartJS => {}
        );

With error:

5|x | (node:18303) UnhandledPromiseRejectionWarning: TypeError: CanvasRenderService is not a constructor
5|x |     at Client.<anonymous> (/root/covid/bot.js:357:37)
5|x |     at processTicksAndRejections (internal/process/task_queues.js:97:5)
chart.js discord.js canvas javascript
1 Answers

They have renamed their service from CanvasRenderSerice in version 2.x.x to ChartJSNodeCanvas in version 3.x.x.

So you might be using version 3.x.x. Either downgrade your chartjs-node-canvas version 2.x.x or update your code according to new version.

2.x.x syntax

CanvasRenderService(width, height, chartCallback, type, chartJsFactory)

3.x.x

ChartJSNodeCanvas(options)

so in new version you've to use like

new ChartJSNodeCanvas({ width, height })


const { ChartJSNodeCanvas } = require('chartjs-node-canvas');
 
const chartCallback = (ChartJS) => {
    // Global config example: https://www.chartjs.org/docs/latest/configuration/
    ChartJS.defaults.global.elements.rectangle.borderWidth = 2;
};
 
const canvasRenderService = new ChartJSNodeCanvas({ width, height, chartCallback});

(async () => {
  const configuration = {
    type: "line",
    data: {
      labels: dates,
      datasets: [
        {
          label: "Total Cases",
          data: cases,
          backgroundColor: "rgba(255,255,0,0.1)",
          borderColor: "rgba(255,255,0,1)",
          borderWidth: 2,
          pointRadius: 2
        },

        {
          label: "Recoveries",
          data: recovered,
          backgroundColor: "rgba(0,255,0,0.1)",
          borderColor: "rgba(0,255,0,1)",
          borderWidth: 2,
          pointRadius: 2
        },
        {
          label: "Deaths",
          data: deaths,
          backgroundColor: "rgba(255,0,0,0.1)",
          borderColor: "rgba(255,0,0,1)",
          borderWidth: 2,
          pointRadius: 2
        }
      ]
    },
    options: {
      legend: {
        position: "bottom",
        labels: {
          fontColor: "rgb(255, 255, 255,1)",
          fontSize: 16
        }
      },
      scales: {
        xAxes: {
          grid: {
            display: false
          },
          ticks: {
            fontColor: "rgba(255, 255, 255, 1"
          }
        },
        yAxes: {
          grid: {
            lineWidth: 2,
            color: "rgba(255, 255, 255, 0.8)"
          },
          ticks: {
            fontColor: "rgba(255, 255, 255, 1"
          }
        }
      }
    }
  };
})
const image = await canvasRenderService.renderToBuffer( configuration );

user_45959340
Related