SeanSobey / ChartjsNodeCanvas

A node renderer for Chart.js using canvas.
MIT License
230 stars 75 forks source link

Cannot find module 'chart.js #52

Closed clarson1229 closed 2 years ago

clarson1229 commented 3 years ago

Hello, Context: I am trying to Create an auto email service that runs on a timer and sends emails out on a scheduled basis. I use Cronjobs.org which hits my Lambda function hosted on netlify. This function creates the email template and then sends the email using SendGrid. This all works fine and dandy Until I try to put a chart into this template.

The issue is I cannot get chartjs to create the said chart.
Because I am using a lambda function to create this email template no canvas object is available. This is where I stumbled upon this library as it looks like it can do exactly what I want.

Problem: Using the default chart from the documentation to test things. I want to be able to create the graph that then renders it to a URL that can be sent to an image tag. However, whenever the lambda function is called from netlify it returns the error : {"errorType":"Runtime.ImportModuleError","errorMessage":"Error: Cannot find module 'chart.js'" Chart.js is installed and I have tried numerous variations of require statements that still are not working.

Any help would be appreciated.

const { CanvasRenderService } = require('chartjs-node-canvas');
// const { ChartJS } = require('chart.js');  //Does not work 
const width = 400; //px
const height = 400; //px
const canvasRenderService = new CanvasRenderService(width, height, (ChartJS) => { });

module.exports = async (data) => { 
    const configuration = {
        type: 'bar',
        data: {
            labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
            datasets: [{
                label: '# of Votes',
                data: [12, 19, 3, 5, 2, 3],
                backgroundColor: [
                    'rgba(255, 99, 132, 0.2)',
                    'rgba(54, 162, 235, 0.2)',
                    'rgba(255, 206, 86, 0.2)',
                    'rgba(75, 192, 192, 0.2)',
                    'rgba(153, 102, 255, 0.2)',
                    'rgba(255, 159, 64, 0.2)'
                ],
                borderColor: [
                    'rgba(255,99,132,1)',
                    'rgba(54, 162, 235, 1)',
                    'rgba(255, 206, 86, 1)',
                    'rgba(75, 192, 192, 1)',
                    'rgba(153, 102, 255, 1)',
                    'rgba(255, 159, 64, 1)'
                ],
                borderWidth: 1
            }]
        },
        options: {
            scales: {
                yAxes: [{
                    ticks: {
                        beginAtZero: true,
                        callback: (value) => '$' + value
                    }
                }]
            }
        }
    };
    const dataUrl = await canvasRenderService.renderToDataURL(configuration);
    return dataUrl;
}
Fohlen commented 3 years ago

I happen to have the same issue, and it seems to be related to Webpack.

RifkyAfpom commented 3 years ago

check the npm list first. if you get error message npm ERR! peer dep missing: chart.js@^2.x.x or Error: Cannot find module 'chart.js' you need download chart.js to complited chartjs-node-canvas module by run npm i chart.js
check the npm list again after that

SeanSobey commented 3 years ago

Yes, chart.js is a peer dependency so you need to install it yourself